Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New to the CF scene
    Join Date
    Jun 2009
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts

    "&" and Ajax submit problem

    Hello,
    I an a newbye trying to fix an Ajax submit problem.

    I am using an Ajax submit form. It works fine except when I submit a post with "&". Posting something with this character brakes down the submit up to that point when the character occurs.

    What should I do?
    Here is my submit Ajax code.

    Thank you,
    Mircea

    Code:
    <script type="text/javascript">
    var fieldname = 'postrowbody';
    var xmlHttp = http_object();
    
    function get(f)
    {
       var param = elem = '';
       for(var s = 0; s < f.elements.length; s++)
       { 
          elem = f.elements[s]; 
          if(param != '')
          { 
             param += '&'; 
          } 
          param += elem.name + '=' + elem.value; 
       }
       document.getElementById(fieldname).innerHTML += "<div id='load' class='preloader'><img src='/tabs/loading.gif' /><p>Requesting content...</p></div></div>";
    
       xmlHttp = http_object();
       xmlHttp.onreadystatechange = handle_return;
       xmlHttp.open("POST", '{S_AJAX_ACTION}', true);
       xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
       xmlHttp.send(param);
       
       //clear the message site
       document.postform.message.value = '';
    }
    
    function handle_return()
    {
       if (xmlHttp.readyState == 4)
       {
          var load = document.getElementById('load');
          load.parentNode.removeChild(load);
          document.getElementById(fieldname).innerHTML += xmlHttp.responseText;
          document.postform.reset();
       }
    }
    
    function http_object()
    {
       try
       {
          // Firefox, Opera 8.0+, Safari
          xmlHttp = new XMLHttpRequest();
       }
       catch (e)
       {
          // Internet Explorer
          try
          {
             xmlHttp = new ActiveXObject('Msxml2.XMLHTTP');
          }
          catch (e)
          {
             try
             {
                xmlHttp = new ActiveXObject('Microsoft.XMLHTTP');
             }
             catch (e)
             {
                alert("Your browser does not support AJAX!");
                return false;
             }
          }
       }
       return xmlHttp;
    }
    </script>

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,158
    Thanks
    203
    Thanked 2,548 Times in 2,526 Posts
    Try changing the & character to Unicode \u0026


    All advice is supplied packaged by intellectual weight, and not by volume. Contents may settle slightly in transit.

  • #3
    New to the CF scene
    Join Date
    Jun 2009
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanx for the fast reply. How can I do this?

  • #4
    Banned
    Join Date
    Mar 2009
    Posts
    248
    Thanks
    3
    Thanked 68 Times in 66 Posts
    MirceaP:

    This works for me, in IE6 and FF3:
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <title>Form</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script type="text/javascript">
    
    	var AdminResponse = "";
    
    	function parseResponse(){
    
    		var nMessage = document.getElementById('echoMsg');
    		nMessage.style.display = '';
    		nMessage.innerHTML = AdminResponse;
    	}
    
    	function registerUser(){
    
    		var AdminRequest = window.XMLHttpRequest ? new XMLHttpRequest() 
    					: window.ActiveXObject 
    					? new ActiveXObject("Microsoft.XMLHTTP") 
    					: null; 
    		AdminRequest.onreadystatechange = function()
    			{
    		 	 if (AdminRequest.readyState == 4)
    				{
    		 	 	 if (AdminRequest.status == 200)
    					{
    			 	 	 AdminResponse = AdminRequest.responseText;
    			 	 	 parseResponse();
    					}
    		 	 	 else 	{
    				 	 alert('Error postIt.php File '+ AdminRequest.statusText);
    					}
    				}
    			}
    		var nForm = document.forms[0];
    		var infoStr = "fname=" + escape(nForm['firstName'].value);
    		infoStr += "&surname=" + escape(nForm['surName'].value);
    		AdminRequest.open("POST", "postIt.php", true);
    		AdminRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
    		AdminRequest.send(infoStr); 
    	}
    	
    	function validate(nForm){
    
    		document.getElementById('echoMsg').style.display = 'none';
    		for (i=0; i<nForm.length; i++)
    			{
    			 if (nForm[i].value == "")
    				{
    				 alert('Please complete all fields');
    				 return false;
    				}
    			}
    		registerUser();
    	}
    
    </script>
    <style type="text/css">
    
    	 body {background-color:#eae3c6;margin-top:60px}
    	 form {width:240px;margin:auto}
    	 fieldset {width:210px;background-color:#f0fff0;border:1px solid #87ceeb}
    	 legend {font-family:times;font-size:14pt;color:#00008b;background-color:#87ceeb;
    		 padding-left:3px;padding-right:3px;margin-bottom:5px}
    	 label {font-family:times;font-size:12pt;color:#00008B;padding:5px}
    	.submitBtn {display:block;margin-left:auto;margin-right:auto;margin-top:5px;margin-bottom:5px}
    	.formField {font-family:times;font-size:10pt;margin-bottom:3px}
    	#echoMsg {font-family:tahoma;font-size:13pt;color:black;border:1px solid black;padding:5px;
    		  width:275px;height:auto;background-color:#87ceeb;margin-bottom:10px;margin-left:auto;
    		  margin-right:auto;text-align:center}
    
    </style>
    </head>
    	<body>
    		<div id='echoMsg' style='display:none'></div>
    		<form action="">
    		   <fieldset>
    			<legend>Personal Information</legend>
    				<label>First Name: <input type='text' size='15' name='firstName' class='formField'></label>
    				<label>Surname:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type='text' size='15' name='surName' class='formField'></label>
    			<input type='button' name='submit' value="Submit" class='submitBtn' onclick="validate(this.form)">
    		   </fieldset>
    		</form>
    	</body>
    </html>
    Last edited by 12 Pack Mack; 06-17-2009 at 01:21 PM.

  • #5
    Banned
    Join Date
    Mar 2009
    Posts
    248
    Thanks
    3
    Thanked 68 Times in 66 Posts
    MirceaP:

    I think I misunderstood the problem. To pass an ampersand as part of the POST string, escape the string.

    I edited my previous post to correct my error.

  • #6
    New to the CF scene
    Join Date
    Jun 2009
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    12 Pack Mack,
    Thanx for giving me the the solution. Unfortunately I nave no js knowledge and integrating your solution into my script was impossible for me.

    I did not wanted to bother you with other stupid newbye questions so I had opened anther thread speciffically on how to implement the escape function you told me about.

    If this looked like ignorance I am really sorry, it was not my intention.

    All the best


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •