두 번째 호출 jQuery 대화 상자가 ajax

Question

세이버로 작성된 후에 실행되지 않습니다. 너는 균열 같아. 수정이 필요할 때 나는 당신에게 간다 ... 사용자가 양식을 제출하기 전에 jQuery 대화 상자를 사용하여 내용을 확인하는 주석 처리 시스템을 제출해야한다.

첫 번째 문제는 없습니다. 대화 상자가 정상적으로 실행되고 양식이 제출됩니다. 다시 게시하려고하면 Ajax 호출이 실패하고 대화 상자가 표시되지 않으며 기본 양식이 제출됩니다.

대화 상자는 양식의 성공적인 아약스 생성에 바인딩되어 있으므로 바인딩이 있어야하지만 확실하게 누락되었습니다.

다음은 코드입니다.

첫 번째 아약스 호출은 의견을 게시하는 양식을 가져옵니다. 성공적으로로드되면 사용자가 양식을 제출하려고 할 때 호출 할 대화 상자를 시작합니다.

// Make the ajax call for the apppropriate content. 

$.ajax({ 
     type: 'Get', 
     url: 'a/url/to/process/form', 
     cache: false, 
     beforeSend: function() { 
     }, 
     success: function(data) { 
      $('#commentBox_' + id).html(data).fadeTo('fast', 100); 
      $('#' + oId).addClass('remove').removeClass('respond').html('Close'); 
      // Destroy the instance if it has already been called. 
      if(CKEDITOR.instances['comment']) 
      { 
       delete CKEDITOR.instances['comment']; 
      } 
      $('#discussionComment_' + id).submit(function() { 
      CKupdate()            
      }); 
      // Set the editor. 
      CKEDITOR.replace('comment', {toolbar : 'Basic', skin : 'Office2003', height : 250}) 
      // Set the submit option. 
      $('#postComment_' + id).live('click', function() { 
       // Warn the user about submitting. Let them review their comment. 
       CKupdate() // Update the field with user input content. 
       $('.ui-dialog-content').dialog("destroy"); // Get rid of any old dialogs lurking around. 
       // Get the content from the form for the confirmation dialog 
       var commentTitle = $('#commentSubject_' + id).val(); 
       var commentBody = CKEDITOR.instances['comment_' + id].getData(); 
       // Build the new dialog. 
       var NewDialog = $('<div>You are about to submit your comment. Verify before submitting.<hr /><h4>' + commentTitle + '</h4><div>' + commentBody + '</div></div>'); 
       $(NewDialog).dialog({ 
        modal: true, 
        title: 'Confirm Post', 
        width: 500, 
        buttons: { 
        'Submit': function() { 
         commentPost_ajax(id); // Post the form via ajax. 
         $(this).dialog('destroy'); 
         }, 
        'Edit': function() { 
         $(this).dialog('destroy'); 
         return false; // Don't submit the form. 
         } 
        } 
       }); 
       return false; 
      });// Click to submit form. 

     }, 
     error: function() { 
      window.location = "../../post_discussionComment.html?dId<%=dId%>&amp;id=" + id 
     } 
    }); 
// Stay here. We're just starting to have fun. 
    return false; 

다음은 아약스 게시물 기능입니다.

function commentPost_ajax(id) { 

// Just close and submit. 
$('#discussionComment_' + id).ajaxSubmit({ 
    beforeSend: function() { 
     $('#discussionComment_' + id + ' input:submit').html('Sending...'); 
     $('#newEntry').attr('id', ''); 
    }, 
    success: function(data) { 
     $('#commentBox_' + id).after(data); 
     $('#discussionComment_' + id).remove(); 
     $('#discussionComment_' + id).hide('puff', function() { $(this).remove() }, 'fast'); 
     $('#content_' + id + ' a.remove').removeClass('remove').addClass('respond').html('Respond'); 
     $('.expand').show(); 
     window.location + $('#newEntry'); 
     $('#newEntry').children().effect("highlight", {}, 3000); 
    }, 
    error: function() { 
     alert('There was a problem posting your comment. Please try again.'); 
    } 
}); // Form submit 
} 

아무 도움이됩니다. 나는 많은 다른 질문을 봤는데, 그들 중 누구도 직접이 말을하지 않습니다. 그들이 찾으면 나는 그들을 찾을 수 없었다.

Answer 1

내가 제대로하고 Ohgodwhy 언급 이중 제거 문제를 가정에서 해결 된 시나리오를 이해하면, 그것은 다른 JS 오류가 없다는 가정하에 "(...) 기본 양식이 제출"

되어 손에서 문제처럼 보인다 현재 코드에서 발생하는 경우, 나는 또한이 시나리오를 보았습니다.이 시나리오에서는 두 번째 대화 상자가 표시 될 때 기본 폼이 제출됩니다. 아래 코드 에서처럼 일단 대화 상자가 닫히면 DOM에서 대화 상자 div를 제거하여 문제를 해결했습니다.

$('#postComment').live('click', function() { 
     var NewDialog = $('<div></div>'); 
     $(NewDialog).dialog({ 
     modal: true, 
     title: 'Confirm Post', 
     width: 500, 
     buttons: { 
      'Submit': function() { 
       $(this).dialog('close'); 
      } 
     }, 
     close: function(event, ui) { 
      $(this).dialog('destroy'); 
      $(this).detach(); 
      $(this).remove(); 
     } 
     }).dialog('open'); 

Answer 2

내가 일하고 있어요 일부 코드와 함께 문제의 같은 종류를보고 있어요 :

아래의 코드는이 질문에 제출 원래 코드의 변형입니다.

아약스는 처음 사용할 때는 제대로 작동하지만 두 번째에는 사용하지 않습니다. 이 발사 될 때

function my_do_processing(myitem) { 
    // set up variables using myitem.data('...') or standard jquery 
    var my_response = $.post(ajaxurl, { variables }); 
    my_response.done(function(data) { 
    $('#container').html(data); 
    $('a.eventtrigger').bind('click', function() { 
     my_do_processing($(this)); 
     return false; 
    }); 
}); 
}; 


$('a.eventtrigger').click(function() { 
    my_do_processing($(this)); 
    return false; 
}); 

이 클래스 eventtrigger와 함께 앵커에 최초의 클릭 이벤트를 설정, 그것은 것입니다 다음 바인딩 :

내 해결 방법은 다음과 같이 함수로 처리 코드를 삽입하는 것이 었습니다 아약스를 통해 문서에 입력 된 코드와 동일한 이벤트입니다.

그것은 잘 작동하지만 ... 귀하의 마일리지는 다를 수 있습니다.