2013-02-17 47 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); 
     } 
    }); 
});