2017-08-29 59 views
2

我已經使用jquery如下創建一個動態表一個jQuery一個陣列中的所有輸入值:獲取從動態表

$.ajax({ 
     data  : data, 
     type  : "get", 
     url  : url, 
     dataType : "json", 
     error : function(resp){ 
        alert("Error !!"); 
     },    
     success : function(resp){ 
        table = ''; 
        $.each(resp,function(indx,obj){ 
        table += '<tr>'; 
        table += '<td>'+parseInt(indx+1)+'</td>'; 
        table += '<td>'+'<input type="text" value="'+obj.ServiceDetail.service_code+'">'+'</td>'; 
        table += '<td>'+'<input type="text" value="'+obj.ServiceDetail.name+'">'+'</td>'; 
        table += '<td>'+'<input type="text" value="'+obj.ServicePrice.discount_price+'">'+'</td>'; 
        table += '</tr>';           
        }); 
        $("tbody#sevice_table_body").append(table); 
     }  
}); 

和一個按鈕:

<input type="button" class = "btn btn-success btn-sm" value="submit" > 

現在我想一切通過單擊提交按鈕在數組中輸入值,以便可以使用jquery ajax插入到數據庫表中。

+0

什麼問題呢?如果你把它們包裝在一個表單中,你可以在提交時序列化表單 – mplungjan

+0

否我想用jquery保存ajax –

+0

是'$(「#formID」)。on(「submit」,function(e){e.preventDefault ):$ .ajax(.... data:$(this).serialize()....})' – mplungjan

回答

0

使用名稱和數組添加屬性名稱。

$.ajax({ 
      data  : data, 
      type  : "get", 
      url  : url, 
      dataType : "json", 
      error : function(resp){ 
         alert("Error !!"); 
      },    
      success : function(resp){ 
         table = ''; 
         $.each(resp,function(indx,obj){ 
         table += '<tr>'; 
         table += '<td>'+parseInt(indx+1)+'</td>'; 
         table += '<td>'+'<input type="text" name="service_code[]" value="'+obj.ServiceDetail.service_code+'">'+'</td>'; 
         table += '<td>'+'<input type="text" name="name[]" value="'+obj.ServiceDetail.name+'">'+'</td>'; 
         table += '<td>'+'<input type="text" name="discount_price[]" value="'+obj.ServicePrice.discount_price+'">'+'</td>'; 
         table += '</tr>';           
         }); 
         $("tbody#sevice_table_body").append(table); 
      }  
    }); 
0

您可以使用此代碼循環輸入,並將它們添加到一個數組

var arrayOfVar = [] 
$.each($("input[type='text']"),function(indx,obj){ 
    arrayOfVar.push($(obj).val()); 
}); 
0

在這裏,你去了一個解決方案

var inputData = []; 
 

 
$('button[value="submit"]').click(function(){ 
 
    $('input[type="text"]).each(function(){ 
 
    inputData.push($(this).val()); 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

希望這會幫助你。

0

在你的錶款,加上name屬性是這樣的:

$.each(resp,function(indx,obj){ 
    table += '<tr>'; 
    table += '<td>'+parseInt(indx+1)+'</td>'; 
    table += '<td>'+'<input name="services[' + indx + '][code]" type="text" value="'+obj.ServiceDetail.service_code+'">'+'</td>'; 
    table += '<td>'+'<input name="services[' + indx + '][name]" type="text" value="'+obj.ServiceDetail.name+'">'+'</td>'; 
    table += '<td>'+'<input name="services[' + indx + '][price]" type="text" name="service[' + indx + '][price]" value="'+obj.ServicePrice.discount_price+'">'+'</td>'; 
    table += '</tr>';           
}); 

這將產生的名稱,如services[0][code]services[0][name]等,

現在,您可以訪問輸入值作爲PHP數組:

$services = $_POST['services']; 
foreach ($services as $index => $service) { 
    $code = $service['code']; 
    $name = $service['name']; 
    $price = $service['price']; 

    echo "$index : $code, $name, $price \n"; 
} 
1

您可以使用.serializeArray()它將元素編碼爲名稱和值的數組。

查找下面搗鼓更多信息

$(function() { 
 
    var data = $("#tbl2 :input").serializeArray(); // For converting it to array 
 
    //If needed below code is converting it to object 
 
    var obj = {}; 
 
    for (var i = 0, l = data.length; i < l; i++) { 
 
    obj[data[i].name] = data[i].value; 
 
    } 
 
    console.log(data); // Print Array in Console 
 
    console.log(obj);// Print Object in Console 
 
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table id="tbl2"> 
 
    <tr> 
 
    <td> 
 
     <input type="text" name="tb3" value="1" /> 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td> 
 
     <input type="text" name="tb4" value="2" /> 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td> 
 
     <input type="text" name="tb5" value="3" /> 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td> 
 
     <input type="text" name="tb6" value="4" /> 
 
    </td> 
 
    </tr> 
 
</table>