ASP.NET MVC 컨트롤러에 Jquery 정렬 가능한 인덱스 변경

Question

변경을 인식하도록 모델 바인더를 가져 오려고합니다. 내가 여기서 무엇을 놓치고 있는지 잘 모르겠습니다. 기본적으로 초기 페이지 채우기는 데이터베이스에서 페이지 번호를 가져옵니다. 그런 다음 정렬 가능한 작업을 수행하고 Firebug의 원시 HTML은 순서 변경을 보여줍니다. 하지만 모델에 처음 게시 할 때 게시 방법을 알아 내지 못하고 다른 문제는 설문 조사입니다. 페이지 순서가 변경되지 않은 것 같습니다.

보기

@for (var i = 0; i < Model.Pages.Count; i++) 
        { 
         var page = Model.Pages.ElementAt(i); 

         @Html.Hidden("Pages[" + i + "].PageId", page.PageId, new { @class = "page_index" }) 
         @Html.Hidden("Pages[" + i + "].PageNumber", page.PageNumber) 

         <li id="@page.PageId" class="sortable-item text-center ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"> 
         </span>@page.PageNumber</li> 
        } 

       </ul> 

자바 스크립트

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('.sortable').sortable({ 
      stop: function (event, ui) { 
       var formData = $('#editSurveryForm').serialize(); 
       $.ajax({ 
        url: "@Url.Action("Edit")", 
        data: formData, 
        type: 'POST', 
        traditional: true, 
        success: function() { 
         alert("success"); 
        }, 
        error: function() { 
         alert("fail"); 
        } 
       } 
       ); 
      } 
     }); 
    }); 
</script> 

컨트롤러

[HttpPost] 
    public ActionResult Edit(Survey survey) 
    { 
     if (!ModelState.IsValid) 
     { 
      return View("EditSurvey", survey); 
     } 

     surveyRepository.UpdateSurvey(survey); 

     return RedirectToAction("Index", "Administration"); 
    } 

Answer 1

좋아, 내가이 일을 알아낼. <li></li> 태그 외부에 숨겨진 필드가 있습니다. 일단 내가 그들을 옮기게되면, 내가했던 것처럼 내 모든 논리를 다했다. 아약스 포스트는 설문 조사 양식 데이터 Post 메소드에 게시되지 않는 이유

<div class="span9"> 
     <div class="span4"> 
      <ul class="sortable_page_list"> 
       @for (var i = 0; i < Model.Pages.Count; i++) 
       { 
        <li class="sortable-item text-center ui-state-default"> 
         @Html.HiddenFor(model => model.Pages[i].PageId) 
         @Html.HiddenFor(model => model.Pages[i].PageNumber) 
         <span class="ui-icon ui-icon-arrowthick-2-n-s"></span>@Model.Pages[i].PageNumber 
        </li> 
       } 

      </ul> 
      <div class="span1 pull-right internal-wrapper"> 
       @Html.ActionLink("Add", "AddPage", new { id = Model.SurveyId }, new { @class = "add_survey_icon common_icon_settings" }) 
      </div> 
     </div> 
    </div> 

<script type="text/javascript"> 
$(document).ready(function() { 
    $('.sortable_page_list').sortable({ 

     update: function (event, ui) { 
      var counter = 1; 
      $("[id*='PageNumber']").each(function() { 
       $(this).attr("value", counter); 
       counter++; 
      }); 

      //var surveyToUpdate = $('#editSurveyForm'); 
      $.ajax({ 
       url: '@Url.Action("Edit","Administration")', 
       contentType: "application/json; charset=utf-8", 
       data: $('#editSurveyForm').serialize(), 
       type: 'POST' 
      }); 
     } 
    }); 

}); 

알아낼

마지막 일이다