A

Anonymous

Question

cftextarea value is blank when RichText

Forum|Forum|8 years ago
December 19, 2017
10 replies
1932 views

Recently, a user informed me that the RichText editor within her form had changed. When she used the form to send out an email, the copy that she got had no message text. After two more try's, I decided to try this on our test environment and the same thing happened.

When this field (textarea1) gets filled in and I dump the FORM elements I get textarea1 [empty string]. Any ideas why this would have started happening and what I need to do in order to correct it again??

Thanks in advance for any help you can provide.

David

This topic has been closed for replies.

C

ctreeves

Inspiring

I am by no means an expert, and you've certainly received expert help, but can I ask why you'd use cftextarea over something like ckeditor?

A

Anonymous

Because its a government application and there are only so many government 'approved' technologies I can use. It sucks I know.

A

Anonymous

Here is a simple example of what the issue is. Copy the code below and create a cfm page. Browse to it using, CF9, CF11, or CF2016. Enter text in the subject and the textarea. When you submit the form, you should get two javascript alerts. The first for the Subject, the second the textarea. The textarea field will be blank.

<cfform name="ShoutToolMessage" id="ShoutToolMessage">

   
   <table width="800" border="0" cellspacing="0" cellpadding="0" style="margin-top:10px; margin-left:10px">
    <tr>
       <td width="800" valign="top">

<table width="740" border="0" cellspacing="0" cellpadding="0" align="center" class="blueline_table">
       <tr>
        <td height="30" bgcolor="#006699" align="center" class="helptext" style="color:#FF0; font-weight:bold">
        COMPOSE MESSAGE
        </td>
       </tr>
       <tr>
        <td height="40">

         <table width="800" border="0" cellspacing="0" cellpadding="0" align="center">
          <tr>
           <td width="125" height="40" class="text"><b>SUBJECT</b>: </td>
           <td width="650">
           <cfinput name="subjectDJ" id="subjectDJ" type="text" size="60" required="yes" style="padding: 2px; font-family: Segoe, 'Segoe UI', 'DejaVu Sans', 'Trebuchet MS', Verdana, sans-serif; font-size:12px; color: ##333"
              message="Please enter a subject" validateat="onsubmit" validate="noblanks" />
           </td>
          </tr>
          <tr>
           <td valign="top" style="margin-top:55px" class="text"><b>MESSAGE</b>:</td>
           <td><cftextarea name="messageAreaDJ" id="messageAreaDJ" richtext="yes" width="630"></cftextarea></td>
            </tr>
          </table>

</td>
         </tr>
        <tr>
        <td height="50" align="right" style="padding:10px">
         <input type="button" name="submit" id="submit" value="Send Email" style="padding: 3px" onClick="shoutoutAction();">
        </td>
         </tr>
      </table>

EddieLotter

Inspiring

You cannot use JavaScript this way, because you are using cftextarea to get a rich editing experience, ColdFusion is replacing your form fields with its own to provide that functionality. However, once you actually submit the form, the form fields are available in the "form" scope using the "name" attribute of the form fields.

Try the following example:

<!doctype html>
<html lang="en">
<head>
 <meta charset="utf-8">
 <title>cfForm Test</title>
</head>
<body>
<cfif isDefined('form.fieldNames')>
 <cfdump var="#form#" >
</cfif>
  <cfform name="ShoutToolMessage" id="ShoutToolMessage" action="CfFormTest.cfm" method="post">
      <table width="740" border="0" cellspacing="0" cellpadding="0" align="center" class="blueline_table">
       <tr>
        <td height="30" bgcolor="#006699" align="center" class="helptext" style="color:#FF0; font-weight:bold">
        COMPOSE MESSAGE
        </td>
       </tr>
       <tr>
        <td height="40">
         <table width="800" border="0" cellspacing="0" cellpadding="0" align="center">
          <tr>
           <td width="125" height="40" class="text"><b>SUBJECT</b>: </td>
           <td width="650">
           <cfinput name="subjectDJ" id="subjectDJ" type="text" size="60" required="yes" style="padding: 2px; font-family: Segoe, 'Segoe UI', 'DejaVu Sans', 'Trebuchet MS', Verdana, sans-serif; font-size:12px; color: ##333"
              message="Please enter a subject" validateat="onsubmit" validate="noblanks" />
           </td>
          </tr>
          <tr>
           <td valign="top" style="margin-top:55px" class="text"><b>MESSAGE</b>:</td>
           <td><cftextarea name="messageAreaDJ" id="messageAreaDJ" richtext="yes" width="630"></cftextarea></td>
            </tr>
          </table>
        </td>
         </tr>
        <tr>
        <td height="50" align="right" style="padding:10px">
          <input type="submit" value="Submit">
        </td>
         </tr>
      </table>
    </cfform>
</body>
</html>

You will see what you typed as the message in the second field.

It's worth pointing out that the value of the messageAreaDJ field is in HTML, which is probably tripping you up.

Cheers

Eddie

A

Anonymous

Thanks for your thought Eddie, you are correct. I can submit it using the 'submit' but I'm sending the form through a JavaScript file for validation and then processing it using ColdFusion.Ajax.submitForm to a cfc function and the value doesn't come over. The example I gave was a simplified version so people would know the issue I am having. Thoughts?

A

Anonymous

Nope, the ID appears to change each time the form it accessed. I changed the code as suggested and still cannot get the value of that textarea. ARGH!!!

A

Anonymous

Good catch Carl, but, NO, CF shouldn't do that. I'll look at the form again and see it it has the same ID value and try to alert that instead.

A

Anonymous

Hi Carl.

Interestingly when I just try to alert the textarea field in JS I get 'undefined' but if I add an action to the cfform and submit the form that way instead of js (ColdFusion.Ajax.submitForm("ShoutToolMessage", "Tools/shoutout_Action.cfm", ShoutOutSuccessCallback, errorDisplay);), I get the textarea data.

Note, that when you submit the form, the alert for the cftextarea field is blank, even when you add text.

Here is a simple code snippet that does the exact same thing.

alert(document.getElementById('messageAreaDJ').value);
return false;
}
</script>

<div style="margin:10px">

<cfform name="ShoutToolMessage" id="ShoutToolMessage">

   
   <table width="800" border="0" cellspacing="0" cellpadding="0" style="margin-top:10px; margin-left:10px">
    <tr>
       <td width="800" valign="top">

<table width="740" border="0" cellspacing="0" cellpadding="0" align="center" class="blueline_table">
       <tr>
        <td height="30" bgcolor="#006699" align="center" class="helptext" style="color:#FF0; font-weight:bold">
        COMPOSE MESSAGE
        </td>
       </tr>
       <tr>
        <td height="40">

         <table width="800" border="0" cellspacing="0" cellpadding="0" align="center">
          <tr>
           <td width="125" height="40" class="text"><b>SUBJECT</b>: </td>
           <td width="650">
           <cfinput name="subject" type="text" size="60" required="yes" style="padding: 2px; font-family: Segoe, 'Segoe UI', 'DejaVu Sans', 'Trebuchet MS', Verdana, sans-serif; font-size:12px; color: ##333"
              message="Please enter a subject" validateat="onsubmit" validate="noblanks" />
           </td>
          </tr>
          <tr>
           <td valign="top" style="margin-top:55px" class="text"><b>MESSAGE</b>:</td>
           <td><cftextarea name="messageAreaDJ" id="messageAreaDJ" richtext="yes" width="630"></cftextarea></td>
            </tr>
          </table>

</td>
         </tr>
        <tr>
        <td height="50" align="right" style="padding:10px">
         <input type="button" name="submit" id="submit" value="Send Email" style="padding: 3px" onClick="shoutoutAction();">
        </td>
         </tr>
      </table>

       </td>
    </tr>
     </table>

</cfform>

</div>

Carl Von Stetten

Legend

It appears CF assigns a generated value for the "id" property on the actual TEXTAREA. From your DOM screenshot previously shown, that id was "cf_textarea462361889760434". So your document.getElementById() would need to use this generated id. Does ColdFusion use a random number in that generated id that changes each time the page is loaded? If so, you'll have to change it to something like:

alert(document.getElementsByName('messageAreaDJ')[0].value);

-Carl

A

Anonymous

Yes, the Virtual Directory is pointing to the correct folder. sigh!!

A

Anonymous

Charlie, my apologizes for the confusion. We are indeed running CF2016 and have all patches installed.

The default scripts entry didn't copy over correctly, it has /cf_scripts/scripts/ in it.
Checking into the IIS VD for the cf_scripts folder.

A

Anonymous

We are running CF2016 (11)

This is in the SETTINGS area of the CF ADMIN:

Default ScriptSrc Directory

Active ColdFusion
Mappings

Actions	Logical Path	Directory Path
	/CFIDE	C:/ColdFusion2016/cfusion/wwwroot/CFIDE
	/gateway	C:/ColdFusion2016/cfusion/gateway/cfc

Charlie Arehart

Community Expert

That's curious that the default scriptsrc is empty. It should not be. The default (in CF2016, which you say you're running) is /cf_scripts/scripts/. Put that in there, and try to requests again.

BTW, why did you say you are running "CF2016 (11)"? Someone might think you were saying CF2016 "update" 11, but the latest update is only 5.

Finally, you misunderstood the second part of my last note, in that you are showing a screenshot of your CF admin "mappings" page. That's not what I was referring to. I said:

"Then second, is THAT virtual directory defined in your web site in question?

Third, and I assume it is: is the PATH that it points to pointing to the CF wwwroot, and its scripts folder? It could be that it's pointing to the wrong set of script files."

So I'm asking you to look at your web server (IIS or Apache, whichever you use), and then for the site having trouble, does it have a /cf_scripts virtual directory defined? And if it does, does it point you C:\ColdFusion2016\cfusion\wwwroot\cf_scripts\scripts?

/Charlie (troubleshooter, carehart. org)

A

Anonymous

Thanks Charlie. The Network tab is 200 for both files and the console tab was clean.

Charlie Arehart

Community Expert

OK. And I know you think "nothing has changed", but you are probably meaning more about the code, but perhaps also the config.

Still, let's consider the config, going back to the scripts virtual directory I mentioned in my first comment here. First, what is your setting for that default scriptsrc in the CF Admin (see my first post above)? Then second, is THAT virtual directory defined in your web site in question?

Third, and I assume it is: is the PATH that it points to pointing to the CF wwwroot, and its scripts folder? It could be that it's pointing to the wrong set of script files.

You've not yet said what version of CF you are using. In CF2016, it should point to something like C:\ColdFusion2016\cfusion\wwwroot\cf_scripts\scripts (or wherever you have CF 2016 installed). In CF10 and 11, it would be like this C:\ColdFusion11\cfusion\wwwroot\CFIDE\scripts.

/Charlie (troubleshooter, carehart. org)

Charlie Arehart

Community Expert

You don't give us quite enough to know for sure what the problem is ("the copy that she got had no message text"), but I gather you mean that there's no problem with the form as it appears on the screen, but when a user fills it in and submits it, the form field for that textarea is blank.

So first, some debugging techniques: do a dump of the form scope (on the page called by the form submission), and see what it shows (for all fields, not just the one in question). Perhaps this is a bigger problem than that one field.

Second, in the form, do you show all the little icons for things like bold, italics, and such, which is what cftextarea is meant to bring to the table (over a traditional HTML textarea tag)? If you do not, then perhaps you're having a problem with the response that shows the user that form.

And a common problem with that is that the underlying javascript and related components didn't get served with the page when it was shown to the user. These rely on an underlying virtual directory, to be defined in your web server, of either CFIDE/scripts (by default in CF11 and before) or /cf_scripts/scripts (by default in CF2016 and above). Note that you can change the name of that virtual directory (in all versions of CF) in the CF Admin "server settings" page, in its "default scriptsrc directory" setting. For more on that, see https://www.petefreitag.com/item/774.cfm .

If you find that the web site in question does not have that virtual directory, then the browser will fail to run the needed javacript that the HTML (which CF builds for a CFTEXTAREA and similar tags) is sent to it.

You can also use browser developer tools to help identify and debug such problems on the client end, which is helpful when perhaps you have no control over or access to assess the web server configuration. For more on that, see an older post of mine: Need to solve browser problems? Did you know most modern browsers now have built-in developer tools?

Let us know how things turn out, whether this helps or not.

/Charlie (troubleshooter, carehart. org)

A

Anonymous

Thanks Charlie and I'm sorry I didn't provide more information, but you are correct. When the user submits the form, the textarea data is blank. I have dumped the FORM variables after the JS validation and that field is blank [empty string]. The RichText toolbars are displaying and working as expected the display is not the issue.

Interestingly when I just try to alert the textarea field in JS I get 'undefined' but if I add an action to the cfform and submit the form that way instead of js (ColdFusion.Ajax.submitForm("ShoutToolMessage", "Tools/shoutout_Action.cfm", ShoutOutSuccessCallback, errorDisplay);), I get the textarea data.

So with CFFORM ACTION=''Tools/shoutout_Action.cfm", I get the field data but submitting via JavaScript that field is blank [empty string].

ANY IDEAS? I'm stumped. Here is the DOM code below:

Charlie Arehart

Community Expert

Well, you are close. Look at the network tab instead, not the DOM tab. See if ANY of the files requested (when the form is displayed) has anything but a 200 or 304 status code. If any 404s or 401s or 500, etc, then those failed. And any failure could make part of the request fail, which could lead to the submission to fail to fill in the field.

Look also at the console tab. It will show if there were any javascript errors.

I realize this stuff may NOT be this issue, but you want to start by ruling it out, especially you have confirmed that if you submit the form yourself from the page, it HAS the data.

/Charlie (troubleshooter, carehart. org)

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded