1

我对 jsRender 真的很陌生,但是因为我发现它对于填充我的下拉列表非常有用(只有几行)我想问你是否可以使用 jsRender 创建控件而不在这些控件上显示任何数据(至少现在不行)

这是我现在正在做的连接几行 html 代码的简化版本

HTML 代码:

<table>
    <tr>
        <td>
            <fieldset id="fldRetorno">
                <legend>Return Details</legend>
                <input id="addRow" type="button" value="+ Add" />
                <table id="tbRetornosModelos" class="tabla-retorno">
                    <tbody></tbody>
                </table>
            </fieldset>
        </td>
    </tr>
</table>
</table>

JS代码:

 var counter = 0; // Counter for number of rows     

 $("#addRow").on('click', function () {
     counter = counter + 1;

     var newName = "Name" + counter;
     var newType = "Type" + counter;

     var newEnlaceEstruct = "tbExp_s1_e" + counter;
     var newRow = '<tr><td>Return # ' + counter + ':  </td>' +
         '<td>' + '  Name</td>' +
         '<td><input type="text" id="' + newName + '" />' + '</td>' +
         '<td>Data Type</td>' +
         '<td><select name="select" id="' + newType + '"> <option value="Seleccione" selected>Select...</option> <option value="Number" >Number</option><option value="Text">Text</option></select></td>' +
         '<td><input type="button" value="-Remove" class="deleteFila"></td>' +
         '<td><input type="hidden" id="enlace' + counter + '" value="' + newEnlaceEstruct + '" /></td>' +
         '</tr>';
     $('table.tabla-retorno >tbody').append(newRow);

     $(".deleteFila").on("click", function (event) {
         $(this).closest("tr").remove();
     });
 });

jsfiddle简化版http://jsfiddle.net/edaloicaro18/YURDR/2/ _

将所有列连接成一行,然后为其分配表append(newRow)的部分是我想要摆脱的部分。我曾想过使用在<script>标签中声明的模板,将所有 id 放在一个 json 数组中并将其传递给render方法,就像我对下拉列表所做的那样,我几乎可以肯定它会做到。

但是当我必须编辑时我该怎么办(而不是像我现在正在做的那样插入)?然后,我不仅要为控件生成 id,还必须在这些控件中显示数据。那我该怎么办??jsRender 是否在 render 方法中接受多个数据源???

在这种情况下你会怎么做?也许我只是在鼹鼠丘上造一座山

感谢您的帮助,阿克塞尔

PS这是我需要做的完整版本,只是为了提供一个更好的主意。http://jsfiddle.net/edaloicaro18/4yQML/25/embedded/result/ 我认为如果我找到如何处理简化版本,我不会对复杂版本有任何问题。

4

1 回答 1

1

JsRender 允许您将任何您想要的数据传递给渲染方法,还允许您在附加的上下文参数中传递辅助方法和元数据等:

myTemplate.render(data, context)

render 方法的 API 文档在这里

从模板中,您可以使用 或 访问上下文对象的属性或~someProperty方法~someMethod(...)

但是您可能会考虑使用 JsRender 来呈现您的全部内容,而不仅仅是选项。如果您使用 JsViews,那么您不需要编写代码来追加或删除 DOM 元素。它只能以声明方式工作。

这里有一个非常简单的示例Data-linked tags,还有更多示例:JsViews samples

您可能也对此页面感兴趣(更高级) - 因为它显示了有时您可以选择插入 ID 或使用不再需要的替代方法......

于 2013-10-09T02:31:44.743 回答