How to pass a PHP array to jQuery?

Question

I have an input field that I want to populate with a bunch of possible sources, but I need to grab these sources from several different areas: a file on my server and some stuff that is already in jQuery.

The input field is going to show up inside an iFrame, so I have a .php that will echo some html when it is called up as a source.

<?php
$array = array('Louisville, KY', 'Denver, CO');
echo "
<html>
<head>
<link rel='stylesheet' href='//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css'>
  <script src='//code.jquery.com/jquery-1.10.2.js'></script>
  <script src='//code.jquery.com/ui/1.10.4/jquery-ui.js'></script>
  <link rel='stylesheet' href='/resources/demos/style.css'>
  <script>
  $(function() {
    var availableTags = [
      'Boston, MA',
      'New York City, NY',
      'Los Angelos, CA'
    ];
    availableTags = $.merge(availableTags, ".$array.");

    $( '#tags' ).autocomplete({
      source: availableTags
    });
  });
  </script>
  </head>
<body>
Select a voting option.
<br>
<span id='options'>
<form method='post' action='/creations/tools/poll/pollstorage.php' target='mainframe'>
<input id='tags' name='score'/>
<input type='submit' value='Vote'/>
</form>
<br>
</span>
</body>
</html>
"
?>

In the jQuery that I will be echoing to the iframe, you can see that I try to merge together an existing jQuery array and the output of a PHP array: availableTags = $.merge(availableTags, ".$array.");. I tried it and none of the jQuery works.

What am I doing wrong here? How should I go about merging the PHP array and the jQuery array?

Sidenote: You have a missing closing semi-colon just before your closing PHP tag. — Funk Forty Niner
– Funk Forty Niner, Commented May 13, 2014 at 14:21
If you just want to send php array then convert it to json by using json_encode($arrayList); in php and return than json to jquery. Json can be used as simple as array in jQuery — poush
– poush, Commented May 13, 2014 at 14:21

Marek · Accepted Answer · 2014-05-13 14:31:21Z

1

Use json_encode():

$.merge(availableTags, ". json_encode($array).");

edited May 13, 2014 at 14:31

answered May 13, 2014 at 14:21

Marek

7,4431 gold badge24 silver badges34 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Isaiah Taylor Over a year ago

The rest of the jQuery code has started to work again, but the arrays are still not merged.

Isaiah Taylor Over a year ago

Oh, nevm... I got it! THANKYOUTHANKYOUTHANKYOU. Geez, this site is a lifesaver...

Marek Over a year ago

Just for future reference, availableTags was overwritten. I'll update the answer.

Community · Accepted Answer · 2023-11-17 19:22:09Z

1

You can convert php array in to json file and use it in java-Script or jquery. use php json_encode

edited Nov 17, 2023 at 19:22

CommunityBot

11 silver badge

answered May 13, 2014 at 14:22

Harry

446 bronze badges

Comments

Hossam Aldeen Ahmed · Accepted Answer · 2014-05-13 14:27:53Z

1

var php_array = [<?php echo '"'.implode('","',  $array).'"' ?>];
availableTags = $.merge(availableTags,php_array );

edited May 13, 2014 at 14:27

answered May 13, 2014 at 14:22

Hossam Aldeen Ahmed

7821 gold badge8 silver badges20 bronze badges

Comments

faster2b · Accepted Answer · 2014-05-13 14:38:32Z

0

I think the best solution is using json.

In PHP create a page than output a json data that you need:

page data.json

<?php 
    $obj['jsArray']= array('Boston, MA','New York City, NY','Los Angelos, CA');
    echo json_encode($obj);
?>

In your Html page using getJSON from load your page with json data (I am used a pseudo code not tested):

$.getJSON( "data.json", function( data ) {
  var availableTags = data.jsArray 
});

or, if you have availableTags and will add new data:

$.getJSON( "data.json", function( data ) {
  availableTags.push(data.jsArray)
});

answered May 13, 2014 at 14:38

faster2b

6526 silver badges23 bronze badges

Collectives™ on Stack Overflow

How to pass a PHP array to jQuery?

4 Answers 4

3 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

3 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related