2014-04-23 1 views
1

jquery를 사용하여 html 입력 컨트롤로 테이블 행을 동적으로 생성했습니다.동적으로 생성 된 html 입력 컨트롤이있는 테이블 행이 포스트 백에서 사라짐

enter image description here

문제는 그들이 사라 다시 게시있을 때.

어떻게 그들을 머물게합니까?

HTML :

@Html.HiddenFor(x => x.Attribute_Count) 
         <table id="attribute" class="list"> 
          <thead> 
           <tr> 
            <td class="left">Name</td> 
            <td class="right">Sort Order</td> 
            <td></td> 
           </tr> 
          </thead> 

          <tbody id="attribute-row"> 
           <tr> 
            <td class="left"> 

             @Html.TextBoxFor(x => x.AttributeName) 
             <div class="validation-area"> 
              @Html.ValidationMessageFor(x => x.AttributeName) 
             </div> 
            </td> 
            <td class="right">@Html.TextBoxFor(x => x.Attribute_SortOrder)</td> 
            <td class="left"></td> 
           </tr> 
          </tbody> 


          <tfoot> 
           <tr> 
            <td colspan="2"></td> 
            <td class="left"><a onclick="addattribute();" class="button">+</a></td> 
           </tr> 
          </tfoot> 
         </table> 

JQuery와는 :

var attribute_row = 1; function addattribute(){html = '<tbody id="attribute-row' + attribute_row + '">';html += ' <tr>';html += ' <td class="left">@Html.TextBoxFor(x=>x.AttributeName)<div class="validation-area">@Html.ValidationMessageFor(x => x.AttributeName)</div></td>';html += ' <td class="right"><input type="text" name="Attribute_SortOrder" id="Attribute_SortOrder"></td>';html += ' <td class="left"><a onclick="$(\'#attribute-row' + attribute_row + '\').remove();" class="button">-</a></td>';html += ' </tr>';html += '</tbody>';$('#attribute tfoot').before(html);attribute_row++;$('#Attribute_Count').val(attribute_row);} 
+0

당신은 페이지가이 "새로운 행"저장되지 않습니다 때문이다 – Pete

+0

를 다시로드되지 않도록 아약스 포스트 백을해야 할 것이다. 따라서 포스트 백을 수행하면 행이 손실됩니다. 페이지를 다시로드 할 수 있도록 일부 정보를 저장해야합니다. 당신은 여러 가지 방법으로 이것을 할 수 있습니다. 예를 들어 jquery를 사용하여 새 행을 추가 할 때마다 서버에 "POST"를 수행하여 새 행에 대한 정보를 저장할 수 있습니다. – Mike

+0

아이디어가 필요합니다. 약간의 샘플이나 예제가 도움이 될 것입니다. – uikrosoft

답변

0

나는이 문제를 해결했다.

@for (var i = 0; i < Model.Attribute_Count; ++i) 
         { 
          <tbody id="attribute-row"> 
           <tr> 
            <td class="left"> 

             @Html.TextBoxFor(x => x.AttributeName[i]) 
             <div class="validation-area"> 
              @Html.ValidationMessageFor(x => x.AttributeName[i]) 
             </div> 
            </td> 
            <td class="right">@Html.TextBoxFor(x => x.Attribute_SortOrder[i])</td> 
            <td class="left"><a onclick="$('#attribute-row' + i).remove();" class="button">-</a></td> 
           </tr> 
          </tbody> 
} 

감사

관련 문제