인라인 편집

Question

나는 다음과 같은 HTML이 :

이

$('.editEnable').click(function (e) { 
      e.stopPropagation(); 
      $('.editTable tr').each(function() { 
       var ele = $(this).find("span"); 
       var value = ele.text(); 
       updateVal(ele, value); 
      }); 
      $('.editFields').show(); 
     }); 

     $('.centering').click(function (e) { 
      $(".thVal").replaceWith(function() { 
       return this.value; 
      }); 
      $('.editFields').hide(); 
     }); 

     function updateVal(currentEle, value) { 
      $(currentEle).html('<input class="thVal" maxlength="4" type="text" width="2" value="' + value + '" />'); 
      $(".thVal", currentEle).focus().keyup(function (event) { 
       if (event.keyCode == 13) { 
        $(currentEle).html($(".thVal").val().trim()); 
       } 
      }).click(function (e) { 
       e.stopPropagation(); 
      }); 
     } 
    }); 

내가 여기에 원하는 것은인가요 : 자바 스크립트 코드이 함께

@using (Ajax.BeginForm("Edit", "LicenseHolder", null, new AjaxOptions() 
{ 
    HttpMethod = "Post", 
    InsertionMode = InsertionMode.Replace, 
    OnSuccess = "createonsuccess" 
})) 
{ 
<table class="table table-striped editTable" style="border-top: 1px solid #000;"> 
<tr> 
    <td class="tdstyle"><span>@Model.LicenseHolder.LegalPerson.Name</span></td> 
</tr> 
<tr> 
    <td class="bigtd"></td> 
</tr> 
<tr> 
    <td class="tdstyle"> 
     <i class="fa fa-map-marker iconPos" aria-hidden="true"></i> 
     <span>@Model.LicenseHolder.LegalPerson.PrimaryAddress.StreetAddress</span> 
    </td> 
</tr> 
<tr> 
    <td class="tdstyle"><span>@Model.LicenseHolder.LegalPerson.PrimaryAddress.ZipCode</span></td> 
</tr> 
<tr> 
    <td class="tdstyle"><span>@Model.LicenseHolder.LegalPerson.PrimaryAddress.HomeTown @Model.LicenseHolder.LegalPerson.PrimaryAddress.Country</span></td> 
</tr> 
</table> 
} 

내가 행이 인라인 편집하기를 내가 저장을 클릭하면, 나는 편집 - 방법 후 전화를 할 :

이

public async Task<ActionResult> Edit(LicenseHolderDetailViewModel model) 
     { 
      return View(); 
     } 

여기 것은 내가 쳤을 때 그 모델이 null입니다 저장하십시오. 그 이유는 입력 필드가 LicenseHolderDetailView에 바인드되어 있지 않기 때문입니다. 인라인 편집을 할 때 어떻게이 바인딩을 수행 할 수 있습니까?

Answer 1

스팬스는 양식에 다시 게시하지 않습니다. 따라서 현재 설계된대로 할 수 없습니다.

아마도 가장 쉬운 방법은 숨겨진 입력 값을 범위로 유지하고 값을 동기화 상태로 유지하는 것입니다. hiddenFields에 모델의 필드에 해당하는 이름 속성이 있는지 확인합니다.

<tr> 
    <td class="tdstyle"> 
     <span>@Model.LicenseHolder.LegalPerson.Name</span> 
     @Html.HiddenFor(m => m.LicenseHolder.LegalPerson.Name) 
    </td> 
</tr> 

예를

를 들어

숨겨진 필드를 업데이트 할 수 있는지 확인하거나 원래 값을 유지합니다.

양식에 제출하려는 모든 요소를 ​​래핑해야합니다. 이제 모든 숨겨진 인풋을 제출하기 위해 전체 테이블을 둘러 쌀 필요가 있습니다.