jquery pass array key value on .post

Question

HTML:

<input name="id" value="id" id="id">
<input name="where[abc]" value="abc">
<input name="where[xyz]" value="xyz">
<input name="something_else" value="i do not want this be included on submit">
<input type="submit" id="go">

JS

$(document).on("click", "#go", function(){
  var data = $('input[name^="where["').serialize();
  $.post("url.php", {id:$('#id').val(), where: data}, function(data){ ... })
});

How to pass the dynamic where[key] = value to url.php, so that on url.php:

print_r($_POST['where']) will show:

[abc => abc, xyz => xyz]

Need $_POST[where] as array or json also happy.

It is currently showing as an string and i need to use parse_str($_POST['where'], $where) which looks like not the best way

Confusing, maybe you want `{where: $('[name="where[abc]"]').val() }` ? — adeneo, Nov 06 '16 at 23:32

score 0 · Answer 1 · edited May 23 '17 at 10:27

You actually don't have to do anything with your JS: simply serialise the form as is, and let the PHP script handled the named array keys as intended.

And for your JS, simply serialise the form. PHP will automatically parse the query string to return an associative array in the $_POST['where'] object.

$(document).on('click', '#go', function(){
  var d = $('input[name^="where"]').serialize();
  $.post('url.php', d, function(data){
    // Data handling
  })
});

The code above will provide the following query string

where%5Babc%5D=abc&where%5Bxyz%5D=xyz

...which is valid, and will be parsed by PHP as an associative array identified with the key where.

It is difficult to show how PHP code work, but as attached is a PHPfiddle link for a proof-of-concept example: http://phpfiddle.org/main/code/npm1-4q5i

$(document).on('click', '#go', function() {
  var d = $('input[name^="where"]').serialize();
  console.log(d);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input name="where[abc]" value="abc">
<input name="where[xyz]" value="xyz">
<input type="submit" id="go">

I do not want to serialize the whole form, I only need to serialize input=where[...] — SIDU, Nov 06 '16 at 23:41
You do not have to decode or unserialise anything. The entire `$_POST['where']` is an associative array, you can access the values by using key, e.g. `echo $_POST['where']['abc']` will give you `abc`. If unsure, do a var_dump on the `$_POST` global variable. On my local server I get this: `array(1) { ["where"]=> array(2) { ["abc"]=> string(3) "abc" ["xyz"]=> string(3) "xyz" } }` — Terry, Nov 06 '16 at 23:53

score 0 · Answer 2 · answered Nov 07 '16 at 00:53

I think there is no direct way to do that with JQuery.

Here i iterate with each input has name^="where[" and handled to get string between where[..] and each value.

Use .where_values() instead of .serialize().

$(document).on("click", "#go", function() {
  var data = $('input[name^="where["').where_values();
  console.log(data);
  $.post("url.php", {
    id: $('#id').val(),
    where: data
  }, function(data) {})
});

jQuery.fn.where_values = function() {
  var w = {};
  $(this).each(function() {
    var n = $(this).attr("name").split("[")[1].split("]")[0];
    var v = $(this).val();
    w[n] = v;
  });

  return w;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input name="id" value="id" id="id">
<input name="where[abc]" value="abc">
<input name="where[xyz]" value="xyz">
<input name="something_else" value="i do not want this be included on submit">
<input type="submit" id="go">

Thanks for the answer, in this case, i will still prefer to use php::parse_str() to work out. I thought in case there will be an easy solution in jquery — SIDU, Nov 07 '16 at 01:06

jquery pass array key value on .post

2 Answers2