jQuery Datatables-無法從隱藏頁面獲取輸入值

Question

我的HTML中有此表：

<table>
    <thead>
        <tr>
            <th>Id</th>
            <th>Actual weight</th>
            <th>New weight</th>
        </tr>      
    </thead>

    <tbody>
        <tr>
            <td>1</td>
            <td>10</td>
            <td><input data-id="{{ object.id }}" type="number" name="input_new_weight" /></td>
        </tr>

        <tr>
            <td>1</td>
            <td>20</td>
            <td><input data-id="{{ object.id }}" type="number" name="input_new_weight" /></td>
        </tr>

        <!-- multiply by 10 the number of trs -->
    </tbody>
</table>

而且我的JavaScript中有以下代碼來獲取輸入值：

var new_weights = []
$("input[name='input_new_weight']").each(function(index, element){

    if( $(this).val() != "" ){
        var object_new_weight ={
            id: $(this).data('id'),
            new_weight: $(this).val()
        }
        new_weights.push(object_new_weight);
    }

});
console.log(new_weights);

我正在使用jQuery DataTables插件來生成表，並具有過濾，分頁，編排等功能。

在某些表格中，我有10多個條目，因此分頁在這里起作用。 在上面的示例中，它將是2頁：1和2。

執行我的JavaScript代碼時，它只會從可見表格頁面獲取輸入值。 隱藏頁面的輸入無法獲取！

假設在第1頁中，我將新的權重值分別設置為35、75和80，在第2頁中，我將新的權重值分別設置為40、54、97。當我的javascript代碼運行時，它只是從可見頁中獲取值。

拜托，有人可以告訴我為什么會這樣嗎？

Answer 1

您知道數據表是動態生成表的，這非常簡單，因此，當您在第1頁上時，頁面上根本沒有對應於第2頁的輸入（40、54、97）。

所以我想你已經把這個代碼發布到了全球

$("input[name='input_new_weight']").each(function(index, element){
    //stuff
});

這只運行一次； 當只有頁面1的輸入在那里時，在頁面的初始加載時，您寧願需要的是能夠每次重新運行datatable時重新運行代碼。您可以使用page.dt

將其放在初始化數據表的代碼之后

$('#yourtable').on('page.dt', function(){

    $("input[name='input_new_weight']").each(function(index, element){
        //stuff
    });

});