How to pass an array through ajax?

Question

I have a form for a referral system which has two fields namely Name and email. I also have a 'refer another friend' button which allows the user to refer another friend (capped off to 11). So another Name and email field appears. Now I have also an ajax function $.post which is designed to take only one Name and email.

How do I make the ajax function work properly if there are more than one email entries (which can be different for different users). One thing I can think of is using an array after function addInput() and then passing it to ajax. Can someone help me figure this thing out?

    <script>
var countBox =1;
var boxName = 0;
function addInput()
{
     if(countBox<20)
     {  
     var boxName="textBox"+countBox; 
document.getElementById('responce').innerHTML+='<input name="name" size="50" class="resize" placeholder="&nbsp;&nbsp;Name" required type="text" id="'+boxName+'" value="'+'" "  />';
     countBox += 1;
     var boxName="textBox"+countBox; 
document.getElementById('responce').innerHTML+='<br/><input name="email" size="50" class="resize" required placeholder="&nbsp;&nbsp;Email Address" type="text" id="'+boxName+'" value="'+'" "  /><br/><br/>';
     countBox += 1;
     }
     else{
         alert("Max number of referrals reached");
         }
}
</script>

<script src="js/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="js/jquery.validate.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $('#emailForm').validate({
            submitHandler: function() {
                $.post("index1.php",{"name":$('#name').val(),"email":$('#email').val(),"userid": "<?php echo($user) ?>"},function(data) {
                    
                    if(data == "Email address has already received a referral")
                        alert("Email address has already received a referral");
                    else {
                        count = 3 - parseInt(data)
                        var content = "You have "+count+" referrals left";
                        $('h4').html(content);
                        alert ("Referral sent");
                    }
                });
            }
            });
    });
    
</script>

rajesh kakawat · Accepted Answer · 2013-12-11 05:29:37Z

3

try to make json array on client side and pass it to as string on server like below one

   [{"name" : "A","email" : "[email protected]"},{"name" : "B","email" : "[email protected]"},{"name" : "C","email" : "[email protected]"}]

on serverside use

json_decode($json)

will give you

  array
  0 => 
    array
      'name' => string 'A' (length=1)
      'email' => string '[email protected]' (length=11)
  1 => 
    array
      'name' => string 'B' (length=1)
      'email' => string '[email protected]' (length=11)
  2 => 
    array
      'name' => string 'C' (length=1)
      'email' => string '[email protected]' (length=11)

reference

http://php.net/json_decode

edited Dec 11, 2013 at 5:29

answered Dec 11, 2013 at 5:24

rajesh kakawat

10.9k1 gold badge24 silver badges40 bronze badges

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

Comments

Myth · Accepted Answer · 2013-12-11 05:25:59Z

0

I think you can append all the names to a single string with a separator in middle like

name=name1+","+name2;
email=email1+","+email2;

and now you can send it through ajax.

and on other side you can split it into an array using split() function

I am not familiar with PHP so excuse me if i am wrong. But this logic actually works good for me in JSP

answered Dec 11, 2013 at 5:25

Myth

4467 silver badges19 bronze badges

Comments

dave · Accepted Answer · 2013-12-11 05:26:30Z

0

You do

<input name="name[]">

and

<input name="email[]">

and it looks like you'll need to have

<input type="hidden" name="userid" value="<?php echo($user) ?>">

Then, you can use

 $.post("index1.php", $('#emailForm').serialize());

Then, in your php, you just need to loop through your post variables:

for ($i=0; $i < count($_POST['email']); $i++) {
  $email = $_POST['email'][$i];
  $name = $_POST['name'][$i];
  doStuff($name, $email);
}

answered Dec 11, 2013 at 5:26

dave

65.1k6 gold badges81 silver badges98 bronze badges

Comments

tptcat · Accepted Answer · 2013-12-11 05:29:48Z

0

You might have better luck using the jQuery .serialize() method (http://api.jquery.com/serialize/). Also, you might want to name your inputs like this:

name="name[]" and name="email[]". Otherwise if you pass all the posted inputs you'll only pass the last one of each since their names will overwrite each other.

answered Dec 11, 2013 at 5:29

tptcat

3,9712 gold badges36 silver badges52 bronze badges

Collectives™ on Stack Overflow

How to pass an array through ajax?

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related