AJAX/HTML 복잡한 데이터를 저장하는 방법

Question

이 유스 케이스를 고려하십시오.

나는 주어진 주에 주어진 프로젝트에 소요 된 시간을 입력 할 수있는 테이블 (<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 또는 자바 스크립트에 저장하여 AJAX를 통해보다 쉽게 ​​게시 할 수 있습니다.

자바 스크립트로 저장하면 내 페이지와 동기화 된 상태로 유지됩니다.

당신이 더 나은 접근 방식을 가지고 있다면 알려 주시기 바랍니다. 그리고 어떻게 작동하는지, 왜 더 나은 접근 방식을 설명하는지에 대해 자세히 설명해주십시오.

Answer 1

안녕 당신은 당신이 유도 이것을 사용할 수 있습니다 원한다면 내가 MVC에서 간단한 트릭을 사용하여 http://knockoutjs.com/

시도 할 수 있습니다.

<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> 
}