Solved

Jquery CFML - CFtextarea value - form serialize

Posted on 2012-03-12
12
532 Views
Last Modified: 2012-03-13
I'm using
    $('#candidatediv').on('click','#candidatesubmit', function () {
      var strForm = $("form").serialize();
      $.ajax({
        type: 'POST',
        url: 'actEditStatusForm.cfm',
        data: 'form=' + strForm,
        error: function (xhr, textStatus, errorThrown){
        	// show error 
        	alert(errorThrown);},
        success: function (response1, textStatus, jqXHR){
      	ColdFusion.Grid.refresh('candidatesGrid', true);}
      });
    });

Open in new window


and the value of the cftextarea is the original value.  It does not show the changed value.

<cfset body_temp = "" />
<cftextarea name="candidate_profile" richtext="true" value="#body_temp#" width="1000" height="600" html="true">#CandidateInfo.profile#</cftextarea>

Open in new window


I'm not clear why body_temp is set to "" and used for the value attribute.
0
Comment
Question by:lantervj
  • 6
  • 5
12 Comments
 
LVL 52

Expert Comment

by:_agx_
Comment Utility
From what I can see, the value of "body_temp" is always an empty string.

ie
     <cfif CandidateInfo.profile EQ "">
        <cfset body_temp = '' />
     <cfelse>
           <cfset body_temp = "" />
     </cfif>

Also, I'm not sure which variable you're trying to use. But I think you're only supposed to set the value of the textarea in one place

ie Either using "value"
         <cftextarea value="#body_temp#" ... />

... or in the tag body
          <cftextarea ... >#CandidateInfo.profile#</cftextarea>

.. but not both
         <cftextarea value="#body_temp#" ... >#CandidateInfo.profile#</cftextarea>
0
 

Author Comment

by:lantervj
Comment Utility
Using the following;

<cfif CandidateInfo.profile eq "">
<cfset CandidateInfo.form_text = ReReplace(#CandidateInfo.form_text#,"!Todays Date!","#dateformat(now(),"mmmm D, yyyy")#")>
<cfset CandidateInfo.form_text = ReReplace(#CandidateInfo.form_text#,"!candidatename!","#CandidateInfo.fullname#","all")>
<cftextarea name="candidate_profile" richtext="true" width="1000" height="600" html="true">#CandidateInfo.form_text#</cftextarea>
<cfelse>
<cfset CandidateInfo.profile = ReReplace(#CandidateInfo.profile#,"!Todays Date!","#dateformat(now(),"mmmm D, yyyy")#")>
<cfset CandidateInfo.profile = ReReplace(#CandidateInfo.profile#,"!candidatename!","#CandidateInfo.fullname#","all")>
<cftextarea name="candidate_profile" richtext="true" width="1000" height="600" html="true">#CandidateInfo.profile#	</cftextarea>
</cfif>

Open in new window


The post shows the element "candidate_profile" with the original value I display.  It does not show the changed value.
0
 
LVL 52

Accepted Solution

by:
_agx_ earned 500 total points
Comment Utility
Maybe it's related to the rich text editor? Some editors like tinyMC store the raw textarea value somewhere else.  In which case serialize() wouldn't pick up the right value. See this thread for details.

I can't test it right now, but try binding the textarea to a hidden field. Then use the hidden field's value instead. Something like

        <cftextarea name="candidate_profile" ...>

        <cfinput type="hidden" name="candidate_profile_actualValue"
             bind="{candidate_profile} /">
0
 
LVL 15

Expert Comment

by:myselfrandhawa
Comment Utility
very first thing:

data: 'form=' + strForm,

write is as:

data:strForm,

 because you are already declaring the var strForm = form.serialize()

now ur cftextarea Tag:

if you want to use cftextarea tag, use its own value attribute, do not write anything between the opening and closing cftextarea tag:

also on the server page use the cfdump var="#form#">

and view in firebug HTML what u see in dump,

try it and get back here
0
 

Author Comment

by:lantervj
Comment Utility
This is where I usually end up doing/not doing what was asked of me.   The dump shows the value of candidate_profile as the original value.  I blanked out the text area and keyed in "xxxxxxxxxxxxxxxxx"  and that is not what was passed to the action page.

<cfif CandidateInfo.profile eq "">
					<cfset CandidateInfo.form_text = ReReplace(#CandidateInfo.form_text#,"!Todays Date!","#dateformat(now(),"mmmm D, yyyy")#")>
					<cfset CandidateInfo.form_text = ReReplace(#CandidateInfo.form_text#,"!candidatename!","#CandidateInfo.fullname#","all")>
					<cftextarea name="candidate_profile" richtext="true" width="1000" height="600" html="true" value="#CandidateInfo.form_text#">
					
					</cftextarea>
				<cfelse>
					<cfset CandidateInfo.profile = ReReplace(#CandidateInfo.profile#,"!Todays Date!","#dateformat(now(),"mmmm D, yyyy")#")>
					<cfset CandidateInfo.profile = ReReplace(#CandidateInfo.profile#,"!candidatename!","#CandidateInfo.fullname#","all")>
					<cftextarea name="candidate_profile" richtext="true" width="1000" height="600" html="true" value="#CandidateInfo.profile#">
					
					</cftextarea>
				</cfif>

Open in new window


Just FYI;   this is what candidate_profile shows in the dump;

<p> </p><div align="center" style="text-align: center;"> </div> <div style="text-align: left;"><img src="http://www.hinc.com/assets/images/logo_main.jpg" alt="" />                                                                                                          March 1, 2012</div> <div align="center" style="text-align: center;"> </div> <div align="center" style="text-align: center;"> </div> <div align="center" style="text-align: center;"> </div> <div align="center" style="text-align:center"><b>CANDIDATE PROFILE</b></div><div align="center"
firebugscreenshot.JPG
0
 
LVL 52

Expert Comment

by:_agx_
Comment Utility
As I mentioned earlier, the richtexteditor might be the cause .. If the editor stores the current content somewhere else - and serialize uses the "value" attribute, that could be why you're seeing the old value.  Did you try what I suggested?

ie
- Bind the textarea to a separate form field.
- Make a change to ensure the other field is updated
- then submit the form.

What value does the new field contain?
0
What Should I Do With This Threat Intelligence?

Are you wondering if you actually need threat intelligence? The answer is yes. We explain the basics for creating useful threat intelligence.

 

Author Comment

by:lantervj
Comment Utility
Heck no.  I went to take a nap.  I just couldn't look at it anymore.  But, it worked like a charm.  Every time I looked at Firebug I would wonder about all those FCKeditor calls.  If I wasn't so far behind I would research an alternative.  That's how I end up with so-so code.
0
 

Author Closing Comment

by:lantervj
Comment Utility
Good catch!
0
 
LVL 52

Expert Comment

by:_agx_
Comment Utility
Heck no.  I went to take a nap.  I just couldn't look at it anymore.  

Lol, I so know the feeling!  Glad it worked out.
0
 
LVL 52

Expert Comment

by:_agx_
Comment Utility
If I wasn't so far behind I would research an alternative.  That's how I end up with so-so code.

I'm not sure you have a choice if you want to use jquery, because you're trying to get 2 different libraries (fckeditor and jquery) to work together.

Most rich text editors work by stealing control of the standard DOM "value" property. If you were posting with ColdFusion.navigate(...) it would handle the mechanics for you and submit the "new" value. But since you're using jquery,  you have to do a little extra for compatibility.  You need to push the "new value" out of the editor's buffer and into the standard DOM "value" property before calling serialize(). Either with javascript or a hidden field.

Here's an ugly example of what I mean. There's probably a slicker method in the FCKEditor API .. but I don't know it well enough to know that is.

<html>
<head>
<script type="text/javascript">
      function test() {
            // we must access the textarea by "name" because CF ignores the "ID"
            // you enter and assigns its own randomly generated value
            var textarea = document.getElementById('myForm').myTextArea;
            alert("OLD VALUE:\n"+ textarea.value);        
            // transfer new text from the rich text editor into the DOM element  
            textarea.value = ColdFusion.getElementValue('myTextArea');
            alert("NEW VALUE:\n"+ textarea.value);        
      }
</script>
</head>
<body>
<cfform id="myForm" name="myForm">
      <cftextarea id="myTextArea" richtext="true" name="myTextArea">old value</cftextarea>
      <cfinput type="button" name="testButton" value="Test" onClick="test()">
</cfform>
</body>
</html>
0
 

Author Comment

by:lantervj
Comment Utility
Thank you very much.  Great info.  Good point.
0
 
LVL 52

Expert Comment

by:_agx_
Comment Utility
Welcome.  Knowing what works (or doesn't) is good.. knowing why is even better imo ;-)
0

Featured Post

Find Ransomware Secrets With All-Source Analysis

Ransomware has become a major concern for organizations; its prevalence has grown due to past successes achieved by threat actors. While each ransomware variant is different, we’ve seen some common tactics and trends used among the authors of the malware.

Join & Write a Comment

Hi, I will be creating today a basic tutorial on how we can create a Mail Custom Function and use it where ever we want. The main advantage about creating a custom function is that we can accommodate a range of arguments to pass to the Function and …
PROBLEM:  How to open a cfwindow or run a function on double click of a cfgrid row. One of my clients wanted to be able to double click on a row item to get more detailed information about a transaction and to be able to modify the line items i…
Internet Business Fax to Email Made Easy - With eFax Corporate (http://www.enterprise.efax.com), you'll receive a dedicated online fax number, which is used the same way as a typical analog fax number. You'll receive secure faxes in your email, fr…
In this tutorial you'll learn about bandwidth monitoring with flows and packet sniffing with our network monitoring solution PRTG Network Monitor (https://www.paessler.com/prtg). If you're interested in additional methods for monitoring bandwidt…

763 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now