Hrudaya Palwe
Hrudaya Palwe

Reputation: 103

How to send json and parse it on next html page through url in jquery?

I want to send json data through url to next html page. I checked it by emulator as I am working for mobile app, the url could not redirect to next page it is crashing at the moment what is the reason behind this. How can I parse it on next page .I am new to the jquery any idea? my json data contains result of two different sql queries in an array

 $.ajax({
         type : "POST",
         datatype : "json",
         url : "http://Localhost/phpBB3/check_pass.php?username="+ username + "&password="+ password+"&f=68",
         success: function(data){
             alert(data);

               window.location.href="source/testmenu.html?varid=" + data +"&username=" + username +"&password=" + password;
        }
 }); 

This is the code on next page

$(document).ready(function GetUrlValue(VarSearch){
       var SearchString = window.location.search.substring(1);

       var arr = SearchString.split('&');
       console.log(arr);
       //Set session variables
       var username = arr[1].split('=')[1];
       var password = arr[2].split('=')[1];
       document.getElementById('username').value = username;
       document.getElementById('password').value = password;
)};

Upvotes: 7

Views: 18745

Answers (4)

Gideon
Gideon

Reputation: 1517

Then try this one:

var data = {
    username: username,
    password: password
};

$.ajax({
    type: "POST",
    url: "http://Localhost/phpBB3/check_pass.php",
    params: $.param(data),
    success: function(a) {
        window.location.href = "source/testmenu.html?"
            + $.param(a) + "&" + $.param(data)
    }
});

And this would be your code for the next page (the iterator is from Satpal's answer):

$(document).ready(function() {
    var params = window.location.search;

    var getURLParams = function(params) {
        var hash;
        var json = {};
        var hashes = url.slice(url.indexOf('?') + 1).split('&');
        for (var i = 0; i < hashes.length; i++) {
            hash = hashes[i].split('=');
            json[hash[0]] = hash[1];
        }
        return json;
    }

    params = getURLParams(params);

    var username = params.username;
    var password = params.password;
    $('#username').val(username);
    $('#password').val(password);
});

Though I agree with @Jai that sending username and password in url is not recommended.

Upvotes: 2

wolfhammer
wolfhammer

Reputation: 2661

Once you get the URL to load you'll need to run your data through some encoding and decoding. You might have the wrong path. If you want "http://Localhost/source/testmenu.html" make sure the first character is a "/".

Make sure your data object is encoded correctly.

// Encode data for querystring value.
var data = {
  foo: "bar"
};

var data_str = JSON.stringify(data);
data_str = encodeURIComponent(data_str);

Decode and test your URL.

// Get data from querystring value.

// Get the query as an object with decoded values.
// Note that JSON values still need parsing.
function getQuery() {
  var s=window.location.search;
  var reg = /([^?&=]*)=([^&]*)/g;
  var q = {};
  var i = null;

  while(i=reg.exec(s)) {
    q[i[1]] = decodeURIComponent(i[2]);
  }

  return q;
}

var q = getQuery();

try {
  var data = JSON.parse(q.data);
} catch (err) {
  alert(err + "\nJSON=" + q.data);
}

Upvotes: 1

Ashish Bhagat
Ashish Bhagat

Reputation: 420

in your case in first page urlencode json

window.location.href="source/testmenu.html?varid=" + encodeURIComponent(data) +"&username=" + username +"&password=" + password;

and in next page

var data= arr[0].split('=')[1];
var recieved_json = $.parseJSON(data);

Upvotes: 3

Vedank Kulshrestha
Vedank Kulshrestha

Reputation: 220

Parameter should be html encode while navigating or requesting to the URL and decode at the receiving end. It may suspect potentially dangerous content which may leads to crash.

Upvotes: 0

Related Questions