passing looping data through ajax data

Question

My form contains hidden input looping. in my case, i declare the hidden input in ajax data manually without looping. so how to loop them in ajax data?

here's my form script

<form method="POST" name="myform"> <?php for($i=1;$i<=5;$i++) { ?> <input type="hidden" name="data<?php echo $i; ?>" value="data<?php echo $i; ?>"> <?php } ?> <input type='button' name='submitData' value='Submit' onClick='submitData();'> </form>

here's my Ajax script

function submitData() { var form = document.myform; $.ajax({ url: 'process.php', type: 'post', data: { data1 : form["data1"].value, data2 : form["data2"].value, data3 : form["data3"].value, data4 : form["data4"].value, data5 : form["data5"].value }, success: function (result) { console.log(result); }, error: function () { console.log("error"); } }); }

Shaunak D · Accepted Answer · 2015-06-13 05:22:20Z

3

Your hidden inputs have name and values,

use .serialize()

Encode a set of form elements as a string for submission

data : $('form[name=myform]').serialize()

This will return name=value pairs.

If you need {name:value}, use .each()

var formData = {} $('form :input:hidden[name^="data"]').each(function(){ formData[this.name] = this.value; });

And in ajax,

data : formData ,

Demo

edited Jun 13, 2015 at 5:22

answered Jun 13, 2015 at 4:13

Shaunak D

20.7k10 gold badges48 silver badges79 bronze badges

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

3 Comments

Mohamed-Yousef Over a year ago

I think it should be $('form :input[type="hidden"]')

Willyanto Halim Over a year ago

@ShaunakD it works, but it will get all of the input hidden, i just want to get the chosen name and value in form, is it possible to do that? thankyou before.

Shaunak D Over a year ago

Updated the code with $('form :input:hidden[name^="data"]')

Marcos Dimitrio · Accepted Answer · 2015-06-13 04:13:21Z

If you're posting the whole form, you can use jQuery's .serialize() directly in your request:

$.ajax({ url: 'process.php', type: 'post', data: $('#myform').serialize(), ...

Walter Chapilliquen - wZVanG · Accepted Answer · 2015-06-13 04:16:58Z

Also, a good way to do it is to convert the string to JSON object, and in PHP convert the string in an array:

var dataJSON = JSON.stringify({..Your form obj...}); $.ajax({ url: 'process.php', type: 'post', data: dataJSON, success: function (result) { console.log(result); }, error: function () { console.log("error"); } });

process.php

$data = json_decode($_POST["data"]); print_r($data);

Collectives™ on Stack Overflow

passing looping data through ajax data

3 Answers 3

3 Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

Comments

Comments

Related