Pass PHP array as argument to JavaScript function

We all know that, we widely use JavaScript in our PHP page to perform some task. Those tasks could be either any small calculation or anything else. We know that we use array in PHP for our tasks. Some time it’s a requirement to use PHP array into JavaScript function. So I write this blog to fulfill that requirement.

There are two ways to pass the PHP array to JavaScript function as arguments. I have explained both of them here.

Method 1: USE JSON_ENCODE

First method is to convert the PHP array into JSON_ENCODE so that function that receives that array use as a JavaScript array. Complete example is given as follows:

<script type="text/javascript">
function displayarrayelement(demoarray)
{
	for(i=0;i< demoarray.length;i++) 
	{
alert(demoarray [i]); 
}
}
</script>
<?php
	$newarray = array();
	For($i = 10; $i<100; $i=$i+10)
	{
		$newarray [] = $i;
	}
?>
<a onclick="displayarrayelement(<?php echo json_encode($newarray) ?>);"> Array in JavaScript </a>

Method 2: Manually make PHP array like JavaScript array (use implode and split)

In Second method, we make the PHP array format like the JavaScript array manually. So the function direct use that array. Complete example is given as follows:

<script type="text/javascript">
function displayarrayelement(demoarray)
{
	demoarray = demoarray.split(",");
	for(var i=0;i<demoarray.length;i++) 
	{
		alert(demoarray [i]); 
	}
}
</script>
<?php
	$newarray = array('a','b','c');
	$mov_str = implode(",", $newarray);
?>
<a href="#" onclick="displayarrayelement('<?php echo $mov_str ?>');"> Array in JavaScript </a>

Hope this will help you as it did to me.
Thanks.

Advertisements

How to add/remove an element to/from javascript array at/from the given position?

In previous week we have a requirement to add an element to javascript array at the given position.

To fulfill our requirement we have used javascript splice method.

The splice() method is changing the original array and add/remove an element to/from the given position.

It is returning the removed element. And it has three arguments.

Where first argument is “index”, which is an integer to specify at which position add/remove element.

Second argument is “how many”, which is the number of elements to be removed. If this argument is set to 0 then no element will be removed.

And third argument is “element”, which is the new element(s) will be added to the array and this argument is optional.

Now follow the under given example, which adds/removes an element to/from javascript array at/from the given position.

var vehicles = ["bicycle", "car", "bus"];
vehicles.splice(2,0,"truck");
document.write("Added: " +  vehicles + "<br />");
document.write("Removed: " + vehicles.splice(1,2,"tractor,train") + "<br />");
document.write("Vehicles: " + vehicles);

How to check variable / object is set or not in javascript?

Before few days we have a requirement to check that, the variable which we want to use is already set and defined or not.

To fulfill our requirement we have used javascript typeof operator.

The typeof operator in javascript returns the data type of given argument, such as whether an argument is numeric, string, boolean, object, null or undefined.

Here if we pass any variable / object as an argument which has not defined, then it returns undefined.

Following the example to check variable / object is set or not and its data type.

var check_numeric = 10;

alert(typeof(check_numeric));

alert(typeof("Hello"));

alert(typeof(true));

alert(typeof(check_undefined));

Jquery Load a file Without Iframe.

Jquery is a framework of Javascript. It is a well documented framework.

I m just giving information about load a file in DIV or in anyother object

HTML CODE

<div id="loadcleanupwizard"></div>

here suppose you have no content in the given div and you want to load a content from another file like .html, .php or etc… so you can do this with jquery

i have one file name is cleanupwizard.html so i am loading that file into div.

JQuery Code

$('#loadcleanupwizard').load('cleanupwizard.html');

I hope this will be usefull to you.

thanks have a good day.

Posted in jQuery. 2 Comments »

How to get index of checkbox on the base of checkbox value?

Before fifteen days, in my task I required to get index of checkbox from checkbox array on the base of checkbox value.
There were about 70 to 80 checkboxes in an array.

And I need an index of particular checkbox when I give value of that checkbox.

At that time I found a solution to use “Array.indexOf(searchStr[, startIndex])” method of javascript.

But it was not a proper solution, because javascript “Array.indexOf(searchStr[, startIndex])” method is not supported in Internet Explorer and older browsers.

So I used following javascript function to get index of particular checkbox.

function get_index_by_value(checkbox_array, value_to_search)
{
	for(var i=0; i< checkbox_array.length; i++)
    	if(checkbox_array [i].value == value_to_search)
     		return i;
}

Above function have two arguments.

First one is checkbox_array and second is value_to_search.

By calling get_index_by_value function with correct arguments, it returns the index of checkbox where the given value has been found.