Question

我正在使用jquery数据表，并且在表处于响应模式时很难返回输入的值：

这是我的表：

  <table id="productsTable" class="table table-striped table-bordered dt-responsive nowrap" cellspacing="0" width="100%">
    <thead>
        <tr>
            <th>Product Code</th>
            <th>Supplier</th>
            <th>Category</th>
            <th>Description</th>
            <th>Price ($)</th>
            <th>Quantity</th>
            <th></th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        {{#each context}}
        <tr>
            <td class="product_code">{{product_code}}</td>
            <td class="supplier">{{supplier}}</td>
            <td class="category">{{category}}</td>
            <td class="description">{{description}}</td>
            <td class="price">{{invoice_price}}</td>
            <td class="quantity"><input type="number" class="{{product_code}}"></td>
            <td><a class="details" href="/product/{{product_code}}">Details</a></td>
            <td><button id="{{product_code}}" type="button" class="btn btn-primary">Add to Cart</button></td>
        </tr>
        {{/each}}
    </tbody>
  </table>

我为每个输入的类分配了一个唯一的产品代码，并尝试使用以下命令返回值：

$(document).on('click', 'button.btn.btn-primary', function() { 
    var product_code = this.id; //product_code is defined by the Add to Cart's button ID
    //var quantity = $("." + product_code).val();
    var quantity = $("#productsTable input[name='"+ product_code+"'").val();
    console.log(quantity);

});

如果表格为完整大小但在表格收缩时返回未定义，则可以工作..有人可以帮忙吗？我可能需要一个特殊的函数来返回动态创建的输入，但我不知道该怎么做......

提前致谢！

Answer 1

您忘记实际给<input> name input[name='"+ product_code+"'")，即您提到的input[name='"+ product_code+"']")。那个选择器应该是]，你忘记了结束括号var table = $('#productsTable').DataTable()。

最终，当dataTable是＆＃34;没有响应时，你的代码会工作。因为您对可见元素进行只读查找。但是，在处理dataTable时，使用API通常也是一个好主意，同样也可以在微不足道的情况下使用。如果你有一张桌子

<input>

然后使用row()直接从API检索内部数量table.on('click', 'button.btn.btn-primary', function() { var trNode = table.row(this.parentElement.parentElement).node() var quantity = trNode.querySelector('input').value console.log(quantity) })，以获取当前值，而不管dataTable的状态如何：

<button>

这可以假设您的标记如上所述 - <input>未包含在其他元素中，table.on('click', 'button.btn.btn-primary', function() { var trNode = table.row($(this).closest('tr')).node() var quantity = $(trNode).find('input').val() console.log(quantity) })是唯一存在的每一行。

如果你想知道我为什么不使用jQuery方法，那是因为它看起来像这样

AGE,EDU,SEX,SALARY
67,10th,Male,<=50K
17,10th,Female,<=50K
40,Assoc-voc,Male,>50K
35,Assoc-voc,Male,<=50K
57,Assoc-voc,Male,<=50K
49,Assoc-voc,Male,>50K
42,Bachelors,Male,>50K
30,Bachelors,Male,>50K
23,Bachelors,Female,<=50K

如果你问我，会更加困惑......

在jquery数据表中返回输入

1 个答案: