Auto-fill the chat window fields with the procured form data

Auto-fill the chat window fields with the procured form data

Save the time that your visitors spend on filling the fields in the chat window while trying to initiate a chat with the operators of your firm,

Say you own an e-commerce page, you obviously would have procured prime particulars of the visitors visiting your page via a sign up form, then why not retrieve it and utilize it instead of prompting the visitors to enter their name, email address and contact number over and over again?

Shall we just consider a quick and simple example on how to use the following JS APIs to get your job done?

  • $zoho.salesiq.visitor.name();

  • $zoho.salesiq.visitor.email();

  • $zoho.salesiq.visitor.contactnumber();  

Say you create a sign up form prompting for the following particulars,

  1. <form id="myForm" action="/shop.html" method="post">

  3. First name: <input type="text" name="fname"><br>

  5. email: <input type="text" name="email"><br>

  7. Phone: <input type="number" name="phone"><br>

  9. <input type="submit" value="Submit" onclick="myFunction()">

  11. </form> 

Okay now say you have procured the details, how do I retrieve it and use it?

  1. <script>

  3. function myFunction() {

  5. var x = document.getElementById("myForm").elements[0].value;

  7. var y = document.getElementById("myForm").elements[1].value;

  9. var z = document.getElementById("myForm").elements[2].value;

  11. $zoho.salesiq.visitor.name(x);

  13. $zoho.salesiq.visitor.email(y);

  15. $zoho.salesiq.visitor.contactnumber(z);

  17. }

  19. </script> 

Once the method "ready()" inside the Zoho SalesIQ widget code is called, the values retrieved will be captured and will be set in the configured fields in the visitor chat window, 

  1. <script type="text/javascript"> 

  3. var $zoho=$zoho || {};$zoho.salesiq = $zoho.salesiq || 

  5. {widgetcode:"6369d474198d4fc9604656182c9c4e3ee6da94a87bb0400877114fe25f2803f64c9df2e59248c8d7bfee986a890ef9d0", 

  7. values:{},ready:function(){}};var 

  9. d=document;s=d.createElement("script");s.type="text/javascript";s.id="zsiqscript"; 

  11. s.defer=true;s.src=" ]; 

  13. t.parentNode.insertBefore(s,t);d.write("<div id='zsiqwidget'></div>"); 

  15. $zoho.salesiq.ready=function(embedinfo) 

  17. { 

  19. $zoho.salesiq.visitor.name(); 

  21. $zoho.salesiq.visitor.email(); 

  23. $zoho.salesiq.visitor.contactnumber(); 

  25. } 

  27. </script> 

If you are not ready to get all geeky and use JS APIs to get your job done, you can also use Zoho SalesIQ's auto-pick mechanism to achieve the same results ,
  1. <form id="myForm" action="/shop.html" method="post">

  3. First name: <input type="text" name="name" siqatrib="name"/><br>

  5. email: <input type="text" name="email" siqatrib="email"/><br>

  7. Phone: <input type="number" name="phone" siqatrib="phone"/><br>

  9. <input type="submit" value="Submit" onclick="myFunction()">

  11. </form> 


                                          

Hope this was helpful and comprehensible! Thanks for sticking around!

Fond regards,
Bala