javascript中的asp.net轉發器使用模板

Question

我正在使用中繼器更改ASP.Net列表頁面以進行內聯編輯。 我想做的是在控件中創建用於編輯的模板（以便我可以對下拉列表進行數據綁定），然后向該行添加JavaScript click事件，該事件將用模板的副本替換該行並填寫原始綁定行中的字段。

這個小提琴顯示了我的追求： http : //jsfiddle.net/AsciiSmoke/U3z4s/1/

我顯然可以用純JavaScript編寫代碼，但是我發現使用模板將為我提供綁定，並使此處的其他開發人員更容易更新。

干杯，AsciiSmoke

來自JSFiddle的代碼

 This <br> <table> <tr> <td>Field 1</td> <td>Field 2</td> <td>Field 3</td> </tr> <tr> <td>Value 1</td> <td>Value 2</td> <td>Value 3</td> </tr> </table> <br>Becomes <br> <table> <tr> <td>Field 1</td> <td>Field 2</td> <td>Field 3</td> </tr> <tr> <td> <input value="Value 1"> </td> <td> <input value="Value 2"> </td> <td> <select> <option>value 3</option> <option>value 4</option> <option>value 5</option> </select> </td> </tr> </table> 

Answer 1

您實際上不需要模板。 您需要做的就是隱藏每個單元格中的表單字段，然后單擊隱藏文本並顯示表單字段。

這個StackOverflow問題是相關的和/或您要尋找的內容的重復項。

編輯＃1：一種替代方法是將所有表單字段的“模板”封裝在SCRIPT標記中：

<tr>
    <td>Field 1</td>
    <td>Field 2</td>
    <td>
        Field 3
        <script type="text/html">
            <td>
                <input value="Value 1">
            </td>
            <td>
                <input value="Value 2">
            </td>
            <td>
                <select>
                    <option>value 3</option>
                    <option>value 4</option>
                    <option>value 5</option>
                </select>
            </td>
        </script>
    </td>
</tr>

這樣，表單字段就以String數據的形式存在於每一行中，這比DOM樹在內存方面要輕得多。 您只需要在tr標記內查找第一個script[type=text/html]即可找到模板。 然后，問題就變成了如何使用更改后的值更新模板。 您可能必須采用JavaScript模板引擎的方法，並在HTML5 data- *屬性中將相關數據序列化為JSON：

<tr data-values='{ "foo": "bar", ... }'>
    <td>Field 1</td>
    ...