AJAX / HTML如何存储复杂数据

时间:2013-07-12 10:13:26

标签: javascript jquery html ajax

考虑这个用例。

我有一个表(<table>),它允许用户在给定的一周内输入在给定项目上花费的时间。

例如

--------------------------------------
|Project ID: | Monday | Tuesday | ...|
|   123      | 7:15   |   3:45  | ...|
|   124      | 1:15   |   0:45  | ...|
|   125      | 0:00   |   0:00  | ...|

然后我需要在用户输入后回发所有这些行。 我以前做过类似的事情,在这里我有单独的表单描述每一行,然后用jQuery迭代它们,构建一个JSON对象,它包含它们作为一个数组。

每一行的结构:

<tr>
   <form name="RowData">
       <input type="hidden" Name="ProjectID" value="123" />
       <input type="hidden" Name="Monday" value="..." />
       <input type="hidden" Name="Tuesday" value="..." />
   </form>
   <td></td> <!-- Containing the text input and so forth -->
   <td></td>
   <td></td>
</tr>

回发结构:

json:{
     rows:[
          {
          ProjectID: 123, 
          Monday: '7:15',
          Tuesday:'3:45', // etc...
          },
          {
          ProjectID: 124, 
          Monday: '1:15',
          Tuesday:'0:45'
          }, // etc...
     ]

}

*请注意,这不是我如何发送数据的实际表示,而只是一种让您了解我的思维方式的结构*

但我觉得必须有一种更直观的方法来做到这一点。 在HTML或Javascript中存储复杂结构,以便更轻松地通过AJAX回发。

将其存储在Javascript中的问题是让它与页面同步以及用户看到的内容。

如果你们中的一些人有更好的方法,请告诉我,并详细解释它是如何运作的,以及为什么它是一种更好的方法。

1 个答案:

答案 0 :(得分:1)

您好,您可以尝试http://knockoutjs.com/

我在MVC中使用了一个简单的技巧,如果你想要你也可以使用它。

<script>
    var dataMap = {};
</script>
@foreach(var item in Model.Urmodel) {
 <tr data-id="@item.Id"> ... etc </tr>
 <script>
dataMap['@item.Id'] = @Json(item); // you'd have to make a Html helper to do this
</script>
}