2009-06-20 3 views
4

JQuery 용 JEditable 플러그인을 사용하고 있으며 이전 값으로 되돌리고 사용자에게 오류를 표시하도록 플러그인에 오류를 반환하고 싶습니다. 나는이 작업을 동기식 아약스 호출을 사용하고 있지만 비동기 콜백을 대신 사용하는 것을 선호한다. 제가 가지고있는 코드는 아래에 있습니다.Jeditable 비동기 복귀 오류

$("#editbox").editable(submitEdit, { 
    indicator : "Saving...", 
    tooltip : "Click to edit...", 
    name : "Editable.EmailAddress", 
    id : "elementid", 
    type : "text", 
    submit : "<span class=\"mini_button\">Ok</span>", 
    cssclass : "edit_text" 
}); 
function submitEdit(value, settings) 
{ 
    var edits = new Object(); 
    var origvalue = this.revert; 
    var textbox = this; 
    edits[settings.name] = [value]; 
    var returned = $.ajax({ 
         url: "http://someurl.com/edit/", 
         type: "POST", 
         /*async: false,*/ 
         data : edits, 
         dataType : "json", 
         complete : function (XMLHttpRequest, textStatus) 
            { 
             alert("Setting back to original value " +origvalue); 
             $(textbox).html(origvalue); 
            } 
        }); 

     /*var response = $.secureEvalJSON(returned.responseText); 
     if (response.errorMsg != '') 
     {  
      $("#ajaxNotify").addClass("ajax_error").html(response.errorMsg); 
      return(this.revert);      
     }*/ 
     return(value); 
} 

나는 또한 잘 작동하는 주석에 동기 구현을 포함 시켰습니다. 높은 서버로드 시나리오에서는 편집이 백 엔드에서 완료 될 때까지 브라우저를 잠급니다. 이드는 오히려 값을 반환하고 편집이 실패하면 나중에 다시 되돌립니다.

감사합니다, 불안감 제안을 시도하고 IE8에서 작업을 점점 후

편집

, 나는 내가 버튼 를 클릭 할 때 문제가 FF와 크롬 깨달았다. 필드를 클릭하고 편집 한 다음 Enter 키를 누르면 모든 것이 정상입니다. 콜백이 발생하고 값이 재설정됩니다.

필드를 클릭 한 다음 편집을 클릭 한 다음 확인 버튼을 클릭해도 유효성 검사 오류가 나타나지 않으면 양식이 활성 상태로 유지되고 바로 옆에 있습니다. 해당 부분이 실행되면 오류가 수신되면 텍스트 값이 원본으로 되돌아갑니다. 그러나 필드를 다시 클릭 할 수 없으며 jeditable이 언 바운드 된 것처럼 보입니다.

아약스가 발사 할 수 있도록 게시물과 응답이 방화범에 걸려 있는지 확인할 수 있습니다.

{ "에서 errormsg": ""}

왜이 작품이 완벽하게 모든 브라우저에서 내가 입력 키를 누르면하지만 확인 버튼을 클릭하지 않으면 무엇입니까? 동일한 코드가 어느쪽으로 든 실행되고 버튼이 양식을 정확하게 제출합니다.

바인딩 해제 된 것은 단추 누르기에서도 발생합니다.

jeditable을 사용하고 서버 측 유효성 검사 문제를 처리하는 예제가 있습니까?

답변

5

단순히 작동하지 않습니까?

... 
complete : function (xhr, textStatus) { 
    $.secureEvalJSON(xhr.responseText); 
    if (response.errorMsg != '') { 
    $("#ajaxNotify").addClass("ajax_error").html(response.errorMsg); 
    alert("Setting back to original value " +origvalue); 
    $(textbox).html(origvalue); 
    } 
} 
... 
+1

나는 그 해결책을 5 번 시도했지만 작동하지 않았지만 지금은 그렇지 않습니다! 파이어 버그의 콜백 마지막 줄에 중단 점을 배치하면 FireBug에 가득 찼습니다. 디버깅을 시도 할 때 나는 그것을 깨었다! 무슨 일이 일어나고 있는지 나는 풀 수가 없었다. 아 글쎄, 내 어리 석음을 지적 주셔서 감사합니다 :). – madcapnmckay

+0

@madcapnmckay는 당신이 "heisenbug"라고 부르는 것입니까? 그건 그렇고, 좋은 정보 ;-) –

0

jeditable onerror 기능을 고려해 볼 수 있습니다.

... 
onerror: function(settings, original, xhr) { 
    $.secureEvalJSON(xhr.responseText); 
    if (response.errorMsg != '') { 
    var origvalue = ...; 
    $("#ajaxNotify").addClass("ajax_error").html(response.errorMsg); 
    console.log("Setting back to original value " + origvalue); 
    $(original).html(origvalue); 
    } 
} 
...