2014-11-09 57 views
0

你好嗎?用ajax發送2個或多個同名輸入

我有nex代碼。

<input name='uno[]' value='gonzalo' /> 
<input name='uno[]' value='marcos'/> 
<input name='uno[]' value='martin'/> 
<input name='uno[]' value='claudio'/> 

如果y發送表單到Ejample procesa.php,我可以採用這種方式獲取變量。

$variable=$_POST['uno']; 

回聲$變量[2] //馬丁

但是,我怎麼能通過Ajax發送的變量?

任何幫助?

+0

http://api.jquery.com/serialize/ – CBroe 2014-11-09 03:05:58

回答

0

把你的數據到一個數組

var uno = []; 
$('input[name="uno[]"]').each(function() { 
    uno.push(this.value); 
}); 

,並將其發送

$.ajax({ 
    type: "POST", 
    url: "procesa.php", 
    data: {uno: uno} 
}) 
0

管理表單的各個領域的另一個解決方案。

form.html

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Document</title> 
</head> 
<body> 

    <form action="procesa.php" id="myUno" method="post"> 
    <input name='uno[0]' value='gonzalo' /><br/> 
    <input name='uno[1]' value='marcos'/><br/> 
    <input name='uno[2]' value='martin'/><br/> 
    <input name='uno[3]' value='claudio'/><br/> 

    <select name="uno[4]" id=""> 
    <option value="">....</option> 
     <option value="opt1">opt1</option> 
     <option value="opt2" selected>opt2</option> 
     <option value="opt3">opt3</option> 
     <option value="opt4">opt4</option> 
    </select><br/> 

    <textarea name="uno[5]" id="" cols="30" rows="4">test content!!</textarea><br/> 

    <label for="checkbox_1">checkbox 1</label> 
    <input type="checkbox" name="uno[6]" id="checkbox_1" value="checkbox_1" checked="checked"><br/> 

    <label for="apple">Apple</label> 
    <input type="radio" id="apple" name="uno[7]" value="apple"> 
    <label for="orange">Orange</label> 
    <input type="radio" id="orange" name="uno[7]" value="orange" checked="checked"> 


    <br/> 
    <input type="submit" id="form_submit"> 
    </form> 

    <div id="result"></div> 

    <script src="https://code.jquery.com/jquery-2.1.1.js"></script> 
    <script src="process.js"></script> 
</body> 
</html> 

procesa.php

<?php 

$uno = $_POST['uno']; 
var_dump($_POST); 

process.js

$(function() { 

    $("#myUno").submit(function(event) { 
    event.preventDefault();// 

    //we get the data in a single table through our function below 
    var formData = $('#myUno').serializeAssoc(); 
    console.log(formData); 

    $.ajax({ 
    type: "POST", 
    url: "procesa.php", 
    data: { uno: formData.uno } 
    }) 
    .done(function(data) { 
     $('#result').html(data); //displays the response returned. This is used to debug if necessary 
    }); 

    }); 
}); 


$.fn.serializeAssoc = function() { 
    var data = {}; 
    $.each(this.serializeArray(), function(key, obj) { 
    var a = obj.name.match(/(.*?)\[(.*?)\]/); 
    if(a !== null) 
    { 
     var subName = a[1]; 
     var subKey = a[2]; 
     if(!data[subName]) data[subName] = [ ]; 
     if(data[subName][subKey]) { 
      if($.isArray(data[subName][subKey])) { 
      data[subName][subKey].push(obj.value); 
      } else { 
      data[subName][subKey] = [ ]; 
      data[subName][subKey].push(obj.value); 
      } 
     } else { 
      data[subName][subKey] = obj.value; 
     } 
     } else { 
     if(data[obj.name]) { 
      if($.isArray(data[obj.name])) { 
      data[obj.name].push(obj.value); 
      } else { 
      data[obj.name] = [ ]; 
      data[obj.name].push(obj.value); 
      } 
     } else { 
      data[obj.name] = obj.value; 
     } 
     } 
    }); 
    return data; 
}; 

我發現這個插件$ .fn.serializeAssoc很好用here