0

このユースケースを検討してください。

<table>特定の週に特定のプロジェクトに費やされた時間をユーザーが入力できるようにする 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に保存する際の問題は、ページとユーザーに表示されるものとの同期を維持することです。

より良いアプローチをお持ちの方がいらっしゃいましたら、私にお知らせください。また、それがどのように機能するのか、なぜそのアプローチが優れているのかを詳しく説明してください。

4

1 に答える 1

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>
}
于 2013-07-12T10:27:52.187 に答える