2013-02-17 93 views
0

如果我有这样的一个动态元素的动态增长因素:http://jsfiddle.net/kfm5b/2/抓取使用jQuery

<select name="roomFac1" id="roomFac1"> 
    <option selected="selected">Any</option> 
</select> 
<input type="button" value="Add" class="pmbtn" id="addFac"/> 
<input type="button" value="Remove" class="pmbtn" id="removeFac"/> 

$(document).ready(function(){ 
    $('#addFac').click(function(){ 
     var $objs = $('select[name*=roomFac]'); 
     var n = $objs.size() + 1; 
     var $obj = $objs.first().clone(); 
     $obj.attr('name', 'roomFac'+n).attr('id', 'roomFac'+n); 
     $obj.appendTo($('body')); 
    }); 
    $('#removeFac').click(function(){ 
     var $objs = $('select[name*=roomFac]'); 
     if($objs.size() > 1){ 
      $objs.last().remove(); 
     } 
    }); 
}); 

我将如何获取其输出在AJAX提交使用,一旦用户点击提交按钮例如

$("#submit").click(function() { 
... 
... 
var dataString = ....; // how I would I implement the dynamically created elements here s I don't know the size 
... 
... 
$.ajax({ 
    type: "POST", 
    url: "process.php", 
    data: dataString, 
    cache: false, 
    success: function (html) { 
     $('#search_room').html(html); 
    } 
}); 

其次,我会在PHP文档中处理处理?

+0

你是什么意思'实现动态创建elements' ..你想'每个被选元素的values'在'select'标签,或你想要别的东西......请澄清 – AdityaParab 2013-02-17 06:09:16

回答

0

考虑你需要把在dataString所有选定元素的值。

$("#submit").click(function() { 

    var dataString = ""; 

     $('select[name*=roomFac]').each(function(){ 
      dataString+=$(this).val(); 
      dataString+=","; 
     }); 

     $.ajax({ 
      type: "POST", 
      url: "process.php", 
      data: dataString.substring(0, dataString.length - 1);, 
      cache: false, 
      success: function (html) { 
       $('#search_room').html(html); 
      } 
     }); 
    }); 

php方面:

$dataFromClient = $_POST['data']; 
    $dataFromClient = explode(',',$dataFromClient); 

//now $dataFromClient will be an array that contains all the values. 
0

我猜你试图做这样的事情:

$("#submit").on('click', function(e) { 
    e.preventDefault(); 
    var dataString = $.map($('[id^="roomFac"]'), function(val, i) { 
     return {val.name : val.value}; //return name and value of elements 
    }); 

    $.ajax({ 
     type: "POST", 
     url: "process.php", 
     data: dataString, 
     success: function (html) { 
      $('#search_room').html(html); 
     } 
    }); 
});