0

储户。你就像裂缝一样。当我需要修复时，我会来找你... 我有一个用户提交的评论系统，它使用 jQuery 对话框在用户提交表单之前确认内容。

第一次绕行没问题。对话框触发良好并且表单提交。当我再次尝试发布时，ajax 调用失败，对话框没有触发，并且提交了默认表单。

该对话框绑定在表单的成功 ajax 创建中，所以据我所知，它应该是绑定的，但我肯定遗漏了一些东西。

这是代码。

第一个 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;

这是 ajax 帖子的功能。

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 
}

任何帮助，将不胜感激。我仔细阅读了很多其他问题，但没有一个直接谈到这一点。如果他们这样做了，我找不到他们。

4

2 回答 2

0

如果我正确理解了场景并假设 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');
于 2012-08-25T22:30:19.880 回答
0

我正在处理的一些代码也遇到了同样的问题。

ajax 在第一次使用时可以正常工作，但在第二次使用时甚至不会触发。

我的解决方法是将处理代码放入如下函数中：

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 在锚点上设置初始单击事件，当它被触发时，它将相同的事件绑定到通过 ajax 输入到文档中的代码。

它对我很有效......但你的里程可能会有所不同。

于 2013-07-18T19:21:31.447 回答