Question

在List.js网站上，他们清楚地列出了如何使用表格甚至提供示例：http://www.listjs.com/examples/table ...

<tr>
    <td class="name">Jonny Stromberg</td>
    <td class="born">1986</td>
</tr>

但是，我想改用输入值......

<tr>
    <input class="name" value="Jonny Stromberg">
    <input class="born" value="1986">
</tr>

结果是意外的，输入值为空。但是，最终目标是给出输入值名称并在会话中保存列/行。

有没有人在同一条船上？

Answer 1

尝试将<input>包裹在<td></td>标记中。您已正确设置value代码的<inputs>，因此应正确填充。

这样的事情对我来说很好：

<table>
    <!-- IMPORTANT, class="list" have to be at tbody -->
    <tbody class="list">
      <tr>
        <td><input class="name" value="Jonny Stromberg"></td>
        <td><input class="born" value="1986"></td>
      </tr>
      <tr>
        <td><input class="name" value="Jonas Arnklint"></td>
        <td><input class="born" value="1985"></td>
      </tr>
      <tr>
        <td><input class="name" value="Martina Elm"></td>
        <td><input class="born" value="1986"></td>
      </tr>
      <tr>
        <td><input class="name" value="Gustaf Lindqvist"></td>
        <td><input class="born" value="1983"></td>
      </tr>
    </tbody>
</table>

JSFiddle - https://jsfiddle.net/oLbey91h/1/

Answer 2

我能够使用输入字段并填充value属性来获得所需的结果。这是一个Pastebin：http://pastebin.com/dEfjdNCi。

请注意＆＃34;选项＆＃34;类名指向属性＆＃34;值。＆＃34;

<div id="users">
    <table>
        <!-- IMPORTANT, class="list" have to be at tbody -->
        <tbody class="list">
        <tr>
            <td style="display:none;"><input class="id" type="hidden"></td>
            <td><input class="name"></td>
            <td><input class="born"></td>
        </tr>
        </tbody>
    </table>
</div>

<script>
    $(document).ready(function () {
        var options = {
            valueNames: [
                {attr: 'value', name: 'id'},
                {attr: 'value', name: 'name'},
                {attr: 'value', name: 'born'},
            ]
        };
</script>

List.Js - 使用输入字段而不是td，h3，o值

2 个答案: