[SalesForce] Prepopulate HTML Text Area using AmpScript

I'm trying to Prefill a form in the cloud page by querying against salesforce campaigns and campaign members. I was able to set values for input fields just fine using amp script variables. For Text area when doing same way as the input fields it actually inserts placeholder special characters but not the actual values.

AMPSCRIPT:

%%[
/*  All the variables initalization    */
var @cmts, @formSubmit, @ans1 , @ans2, @campaignRows, @campaignMemberRow, @campMemId, @campId, @conId, @campMemStat, @resp1, @resp2, @preComm, @campaignRow, @name, @q1 , @q2, @updateRecord, @campaignMemberRows, @initialResp, @finalResp

/*  Look for query parameters to check if the form was submitted and reloaded or is it the first load*/
set @cmts = RequestParameter('comments')
set @ans1 = RequestParameter('q1')
set @ans2 = RequestParameter('q2')
SET @formSubmit = RequestParameter('submitted')

/* Query salesforce and display pre-poluated form only before the form was submitted*/
IF @formSubmit != "submitted" THEN

/* Query campaign record for pulling questions dynamically */
set @campaignRows = RetrieveSalesforceObjects(
"Campaign",
"Name,Question1__C,Question2__C",
"Id", "=", @CampaignID )
IF RowCount(@campaignRows) > 0 then /* there should be atleast one row */
set @campaignRow = Row(@campaignRows, 1)
set @name = Field(@campaignRow, "Name")
set @q1 = Field(@campaignRow, "Question1__C")
set @q2 = Field(@campaignRow, "Question2__C")
ENDIF

/* Query campaign member record to pre-populate the form*/
set @campaignMemberRows = RetrieveSalesforceObjects(
"CampaignMember","Id,CampaignId,ContactId,Status,Response1__C,Response2__C,Comments__c",
"CampaignId", "=", @CampaignID , "ContactId", "=", @Contact_ID  )
/*  Setting the attributes to pre-populate the form  */
IF RowCount(@campaignMemberRows) > 0 then 
set @campaignMemberRow = Row(@campaignMemberRows, 1)
set @campMemId = Field(@campaignMemberRow, "Id")
set @campId = Field(@campaignMemberRow, "CampaignId")
set @conId = Field(@campaignMemberRow, "ContactId")
set @campMemStat = Field(@campaignMemberRow, "Status")
set @resp1 = Field(@campaignMemberRow, "Response1__C")
set @resp2 = Field(@campaignMemberRow, "Response2__C")
set @preComm = Field(@campaignMemberRow, "Comments__c")
ENDIF /*   end of member row >0  */

]%%

HTML FORM:

    <div class="container">
  <form id="formItself" action="%%=RequestParameter('PAGEURL')=%%" method="post">
    <div id="formContainer">
      <label for="fname">First Name</label>
      <input type="text" id="fname" name="firstname" placeholder="Your name.." value="%%=v(@FirstName)=%%" readonly="">
      <label for="lname">Last Name</label>
      <input type="text" id="lname" name="lastname" placeholder="Your last name.." value="%%=v(@LastName)=%%" readonly="">
      <label for="lname">Email Address</label>
      <input type="text" id="email" name="email" placeholder="Your email address.." value="%%=v(@Email)=%%" readonly="">
      <label for="subject">Comments</label>
      <textarea id="comments" name="comments" placeholder="Accecpt/Reject Comments.." style="height:100px">%%=v(@preComm)=%%</textarea>
      <label for="subject">%%=v(@q1)=%%</label>
      <textarea id="q1" name="q1" placeholder=" " style="height:100px"> %%=v(@resp1)=%%</textarea>
      <label for="subject">%%=v(@q2)=%%</label>
      <textarea id="q2" name="q2" placeholder=" " style="height:100px"> 
        %%=v(@resp2)=%%</textarea>
      <!-- Hidden field to capture parameter to know the context of the form submission -->
      <input id="submitted" type="hidden" name="submitted" value="submitted"> 
      <label>Will you attend?&nbsp;&nbsp;</label>
      <div>
        <label>
          <input type="radio" value="Accept" name="Attendance" id="Attendance1"> I will attend</label>
        <label>
          <input type="radio" value="Decline" name="Attendance" id="Attendance2"> I cannot attend</label>
      </div>
      <center>
        <input id="sbmt" type="submit" value="Submit">
      </center>
    </div>
  </form>
</div>

FORM IMAGE:
Characters in the form

Question: Is this the right way to populate Text area using
ampscript? If not what is the right way to achieve this?

NOTE: I also tried adding value attribute with ampscript variables it
doesn't show any error but it doesn't show any values either!

Updated Observation: Tried printing the variables with h1 tag and they return values without any issues. Text area with static text looks fine too only when i insert an ampscript variable its automatically converting amp script variable to the special characters and displaying those characters in the text area as in the above image.

Best Answer

For now as a workaround I switched the static html into a SSJS output variable and used in the script blocks replicating the same functionality and it seems to work. As a side note I'm going to open a case with same with salesforce regarding the unexpected behavior of the Ampscript. Below is the working snippet.

<div class="container">
  <form id="formItself" action="%%=RequestParameter('PAGEURL')=%%" method="post">
    <div id="formContainer">      
      <br>
      <label for="fname">First Name</label>
      <input type="text" id="fname" name="firstname" placeholder="Your name.." value="%%=v(@FirstName)=%%" readonly="">

      <label for="lname">Last Name</label>
      <input type="text" id="lname" name="lastname" placeholder="Your last name.." value="%%=v(@LastName)=%%" readonly="">

      <label for="lname">Email Address</label>
      <input type="text" id="email" name="email" placeholder="Your email address.." value="%%=v(@Email)=%%" readonly="">

      <script type="text/javascript" runat="server">
        Platform.Load("core", "1.1.1");
        var preComm = Variable.GetValue("@preComm");
        var q1 =Variable.GetValue("@q1") ;
        var q2 =Variable.GetValue("@q2") ;
        var resp1 =Variable.GetValue("@resp1") ;
        var resp2 =Variable.GetValue("@resp2") ;
        var outputComm = '<label for="subject">Comments</label> <textarea id="comments" name="comments" rows="2" cols="20">'+ preComm +'</textarea>';
        var outputQ1 = '<label for="subject">'+q1+'</label><textarea id="q1" name="q1" rows="2" cols="20" > '+resp1+'</textarea>';
        var outputQ2 = '      <label for="subject">'+q2+'</label><textarea id="q2" name="q2" rows="2" cols="20" >'+resp2+' </textarea>';
        Write(outputComm+outputQ1+outputQ2);
      </script>

      <!-- Hidden field to capture parameter to know the context of the form submission -->
      <input id="submitted" type="hidden" name="submitted" value="submitted"> 
      <label>Will you attend?</label>
      <div>
        <label>
          <input type="radio" value="Accept" %%=IIF(@campMemStat=="Accepted"," checked ","")=%% name="Attendance" id="Attendance1"> I will attend</label>
        <label>
          <input type="radio" value="Decline" %%=IIF(@campMemStat=="Declined"," checked ","")=%% name="Attendance" id="Attendance2"> I cannot attend</label>
      </div>

      <center>
        <input id="sbmt" type="submit" value="Submit">
      </center>

    </div>
  </form>
Related Topic