jQuery param() method

The jQuery's param() method allows us to create a serialized representation of an object or an array. We can use these serialize values in the URL string when making an AJAX request.

This method has two parameters, obj and trad, in which the first one is mandatory, and the second parameter is optional to use.

Syntax

The parameter values of this method are defined as follows.

Parameter values

obj: It is the mandatory parameter. It can be an array or an object to serialize.

trad: This optional parameter is a Boolean value, which is used to specify whether or not to use the traditional style of param serialization.

Let's see some illustrations to understand how to use the param() method.

Example1

In this example, we are using the param() method for creating the serialized representation of an object. Here, there is an object named as student with some student details. We are implementing the param() method on the student object to create its serialized representation.

<!DOCTYPE html>
<html>

<head>
<title> jQuery param() </title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script></head>

<body>

<h1> Welcome to the javaTpoint.com </h1>

<h2> This is an example of using the jQuery's param() method. </h2>
<p> Click the following button to see the effect. </p>
<button> Click me</button>

<p id = "para"></p>

<script>
$(document).ready(function() {

student = new Object();

student.Name = "John";
student.Rollno = "19";
student.Standard = "Fourth";

$("button").click(function() {
$("#para").text($.param(student)).css("fontSize", "23px");
});
});
</script>
</body>

</html>

Test it Now

Output

After the execution of the above code, the output will be -

After clicking the given button, the output will be -

Example2

In this example, there are some complex objects. We are implementing the param() method on these complex objects to see the result. Here, we are using the decodeURIComponent to display the decoded object.

Here, there are two objects obj1 and obj2. We are implementing the param() method on these objects and display the result in decoded format.

<!DOCTYPE html>
<html>

<head>
<title> jQuery param() </title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script></head>

<body>

<h1> Welcome to the javaTpoint.com </h1>

<h2> This is an example of using the jQuery's param() method. </h2>
<p> Click the following button to see the effect. </p>
<button> Click me</button>

<p id = "p1"></p>
<p id = "p2"></p>

<script>
$(document).ready(function() {
var obj1 = new Object ({
a: [ 1, 2, 3 ]
});
var obj2 = new Object ({
a: { b: 1, c: 2, d: 3}, e: [ 4, 5]
});

$("button").click(function() {
var res1 = decodeURIComponent( $.param(obj1));
$("#p1").text(res1);
var res2 = decodeURIComponent( $.param(obj2));
$("#p2").text(res2);
});
});
</script>
</body>

</html>

After the execution of the above code, the output will be -