표시된 값을 편집 할 때 JQuery Datatables의 행 스타일 변경

Question

데이터베이스에서 가져온 객체를 표시하는 JQuery 플러그인의 데이터 테이블이 있습니다. 각 행의 끝에 편집 버튼이 있습니다.이 버튼을 클릭하면 사용자가 객체를 변경할 수있는 필드가있는 팝업 창이 열립니다.

아래 코드는 팝업을 여는 "편집"버튼입니다.

<td>@Ajax.ActionLink("Edit", 
           "controllerMethodReturningEditView", 
           new 
           { 
            Id = @m.Id 
           }, 
           new AjaxOptions 
           { 
            HttpMethod = "GET", 
            UpdateTargetId = "popupBox", 
            InsertionMode = InsertionMode.Replace, 
            OnSuccess = "openPopup('myPopup')" 
           })</td> 

편집 버튼을 누를 때 호출 제어기 방법

단지 popupbox

return PartialView("editObjectView", objectModel); 

이 "editObjectView"로 표시된 부분은 단지 입력 수강 필드 형태를 포함하는 뷰를 연다.

@using(Html.BeginForm(... 
      <label>...</label><input ... /> 
      .... and so on 

그런 다음이 팝업에서 사용자는 표시된 개체의 값을 편집 할 수 있습니다. 사용자가 팝업에서 "저장"버튼을 누르면 새 값이 데이터베이스에 값을 저장하는 컨트롤러 메서드로 전송됩니다. 값이 저장되면 컨트롤러 메서드는 첫 번째 뷰 (데이터 테이블을 표시하는 뷰)를로드 한 컨트롤러 메서드를 호출하고 해당 메서드는 새 개체 또는 개체에 대한 변경 내용을 표시하기 위해 데이터베이스에서 모든 개체를 요청합니다.

내 질문은 다음과 같습니다. 개체를 편집 한 후 페이지를 다시로드하면 편집 된 행의 스타일을 어떻게 변경합니까? 최근에 수정 된 행 주위에 빨간색 테두리를 설정하면됩니다. 내가 페이지를 다시로드하는 데 사용되는 모든 컨트롤러 메서드를 통해 개체를 보낼 필요가 없다면 내가 선호 할 것이다.

감사합니다. 고맙습니다!

Answer 1

페이지로 돌아 오는 내용을 알지 못하고 업데이트하려는 스타일을 알지 못합니다.

각 행 css 클래스를 번갈아 가면서 사용한다고 가정 해 보겠습니다. ,

$("tr:nth-child(odd)", "#YOUR_TABLE_ID").addClass("odd-row"); 

또는 각 행 HTML은 그것에게 고유 ID 태그를 포맷하는 것이 "..."확인 후 일부 jQuery를이 설정합니까 수행합니다 당신은 내용이 페이지에 추가됩니다 다음 아래처럼 뭔가를 할 수 클래스에 추가됩니다.

요청은 Ajax 요청은, 당신은 JSON 사용하여 다시 뭔가를 반환하는 경우 - 등이 :

function OnSaveSuccess(data) { 
    if (data.status) { 
     $("#" + data.Id).addClass("highlight-row"); 
    } else { 
    console.warn("save was not successful!"); 
    } 
}