$.post and $.ajax POST works perfect but not simple post

Question

Hi all I had issue with sending data in post format in jquery without ajax. I had URL as:

intranetUrl+"customer/Ri_logon5.asp?requestString=";

and want to send parameter are:

'manish|^info1234|^|^X|^11111985|^1.0|^|$'; 

I tried it with ajax as:

function handleLogin()
{

var form = $("#loginForm");    
 var u = $("#username", form).val();
var p = $("#password", form).val();
var d = $("#dob", form).val();

if(u != '' && p!= '')
{

    var finalStr = u+encodeURIComponent("|^")+p+encodeURIComponent("|^")+encodeURIComponent("|^")+"X"+encodeURIComponent("|^")+d+encodeURIComponent("|^")+"1.0"+encodeURIComponent("|^|$");
    var encodedURL = encodeURI(intranetUrl+"customer/Ri_logon5.asp?requestString=");
    var parameters =  decodeURIComponent(finalStr);
    alert("param:"+parameters);

    $.post(encodedURL, parameters ,
            function(data) {
              alert("Data Loaded: " + data);
            });

}


else
{

    alert("You must enter a username and password", function() {});
    $("#submitButton").removeAttr("disabled");
}

}

Here I got correct result.

When I use it as:

function handleLogin()
{

var form = $("#loginForm");    
 var u = $("#username", form).val();
var p = $("#password", form).val();
var d = $("#dob", form).val();

if(u != '' && p!= '')
{

    var finalStr = u+encodeURIComponent("|^")+p+encodeURIComponent("|^")+encodeURIComponent("|^")+"X"+encodeURIComponent("|^")+d+encodeURIComponent("|^")+"1.0"+encodeURIComponent("|^|$");
    var encodedURL = encodeURI(intranetUrl+"customer/Ri_logon5.asp?requestString=");
    var parameters =  decodeURIComponent(finalStr);
    alert("param:"+parameters);

 $.ajax({
        type: "POST",
        contentType:"application/x-www-form-urlencoded; charset=UTF-8",
        url: encodedURL,
        data: parameters
      }).done(function(msg)
              {
                  response  = msg
                  console.log("repon s???????????????e::>::"+response);
          });

}


else
{

    alert("You must enter a username and password", function() {});
    $("#submitButton").removeAttr("disabled");
}


}

Here also I got correct result but when I use following post method without ajax I didn't get expected result:

function handleLogin()
{

var form = $("#loginForm");    
 var u = $("#username", form).val();
var p = $("#password", form).val();
var d = $("#dob", form).val();

if(u != '' && p!= '')
{

    var finalStr = u+encodeURIComponent("|^")+p+encodeURIComponent("|^")+encodeURIComponent("|^")+"X"+encodeURIComponent("|^")+d+encodeURIComponent("|^")+"1.0"+encodeURIComponent("|^|$");
    var encodedURL = encodeURI(intranetUrl+"customer/Ri_logon5.asp?requestString=");
    var parameters =  decodeURIComponent(finalStr);
    alert("param:"+parameters);
    post_to_url(intranetUrl+"customer/Ri_logon5.asp", finalStr); 




}


else
{

    alert("You must enter a username and password", function() {});
    $("#submitButton").removeAttr("disabled");
}


}


function post_to_url(url, params) {
var form = document.createElement('form');
form.action = url;
form.method = 'POST';

var postParam = encodeURIComponent(params);

var input = document.createElement('input');
input.type = 'hidden';
input.name = 'requestString=';
input.value = postParam;
document.body.appendChild(input);
form.appendChild(input);  
form.submit();

}

But using this last code I didn't get desired output. What's wrong in this? Any suggestion will be appreciated.

Now on I checked what server got output it got it as:

requestString%3D=manish%25257C%25255Einfo1234%25257C.....

means special character are not encoded/decoded well.But I had encoded them in above then what is problem?

Answer 1

A few problems with the third way :

• you shouldn't set as action the whole URI but only intranetUrl+"customer/Ri_logon5.asp"

• you shouldn't set the value of an input field as an URIEncoded string. Leave the form submission do the encoding.

• it leaves the page as this is the normal comportment of form.submit();

• you should add the form to the page before submitting : document.body.appendChild(form);

The first two points mean you should call your function with

var finalStr = u+encodeURIComponent("|^")+p+encodeURIComponent("|^")+encodeURIComponent("|^")+"X"+encodeURIComponent("|^")+d+encodeURIComponent("|^")+"1.0"+encodeURIComponent("|^|$");
post_to_url(intranetUrl+"customer/Ri_logon5.asp", finalStr);