6

我有一个来自 Mysql 的 PHP 填充表，我正在使用 JQuery 来侦听是否单击了按钮，如果单击，它将获取有关他们单击的关联名称的注释。这一切都很好，只有一个问题。有时当您单击它并打开对话框（JQuery UI）窗口时，文本区域中没有任何内容。如果您再次单击它，它将弹出。所以有时似乎价值被抛弃了？我不确定，可以用手。

代码：

$(document).ready(function () {
    $(".NotesAccessor").click(function () {
        notes_name = $(this).parent().parent().find(".user_table");
      run();
    });

});
function run(){
    var url = '/pcg/popups/grabnotes.php';
    
    showUrlInDialog(url);
    sendUserfNotes();
    
    
}
    function showUrlInDialog(url)
    {
      var tag = $("#dialog-container");
      $.ajax({
        url: url,
        success: function(data) {
          tag.html(data).dialog
          ({
              width: '100%',
                modal: true
          }).dialog('open');
        }
      });
    }
    function sendUserfNotes()
    {
        
        $.ajax({
        type: "POST",
        dataType: "json",
        url: '/pcg/popups/getNotes.php',
        data:
        {
            'nameNotes': notes_name.text()
            
        },
        success: function(response) {
            $('#notes_msg').text(response.the_notes)
        }
    });
    
    }
    function getNewnotes(){
        new_notes = $('#notes_msg').val();
        update(new_notes);  
    }
    // if user updates notes
    function update(new_notes)
    {
    
            $.ajax({
        type: "POST",
        //dataType: "json",
        url: '/pcg/popups/updateNotes.php',
        data:
        {
            'nameNotes': notes_name.text(),
            'newNotes': new_notes   
        },
        success: function(response) {
            alert("Notes Updated.");
            var i;
             $("#dialog-container").effect( 'fade', 500 );
            
            i = setInterval(function(){
             $("#dialog-container").dialog( 'close' );
            clearInterval(i);
            }, 500);
            
            }
    });
        
    }
    /******is user closes notes ******/
    function closeNotes()
    {
        var i;
         $("#dialog-container").effect( 'fade', 500 );
        
        i = setInterval(function(){
         $("#dialog-container").dialog( 'close' );
        clearInterval(i);
        }, 500);

    }

需要帮助请叫我！

更新：

基本布局是

<div>
   <div>
     other stuff...

     the table
   </div>
</div>
4

3 回答 3

1

很难从中分辨出来，尤其是没有标记的情况下，但 showUrlInDialog 和 sendUserfNotes 都是异步操作。如果 showUrlInDialog 在 sendUserfNotes 之后完成，则 showUrlInDialog 用返回的数据覆盖对话框容器的内容。这可能会或可能不会覆盖 sendUserfNotes 放入 #notes_msg 的内容 - 取决于标记的布局方式。如果是这样，那么它就可以解释为什么这些音符有时不会出现，似乎是随机的。这是一个竞赛条件。

于 2013-02-12T21:22:04.520 回答
1

假设它#notes_msg位于 中#dialog-container，您必须确保操作以正确的顺序发生。

最好的方法是等待两个 ajax 调用完成然后继续。您可以使用 ajax 调用返回的 promises / jqXHR 对象来做到这一点，请参阅手册的这一部分。

你的代码看起来像（你必须测试它......）：

function run(){
    var url = '/pcg/popups/grabnotes.php';
    var tag = $("#dialog-container");

    var promise1 = showUrlInDialog(url);
    var promise2 = sendUserfNotes();

    $.when(promise1, promise2).done(function(data1, data2) {
      // do something with the data returned from both functions:
      // check to see what data1 and data2 contain, possibly the content is found
      // in data1[2].responseText and data2[2].responseText

      // stuff from first ajax call
      tag.html(data1).dialog({
          width: '100%',
          modal: true
        }).dialog('open');

      // stuff from second ajax call, will not fail because we just added the correct html
       $('#notes_msg').text(data2.the_notes)
    });
}

您正在调用的函数应该只返回 ajax 调用的结果，不要做任何其他事情：

function showUrlInDialog(url)
{
  return $.ajax({
    url: url
  });
}
function sendUserfNotes()
{
  return $.ajax({
    type: "POST",
    dataType: "json",
    url: '/pcg/popups/getNotes.php',
    data: {
        'nameNotes': notes_name.text()
    }
  });
}
于 2013-02-12T21:45:50.147 回答
1

有几种方法可以链接您的 ajax 调用，以防止 sendUserOfNotes() 在 ShowUrlInDialog() 之前完成。尝试使用 .ajaxComplete()

jQuery.ajax 完成

您可以使用的另一种 ajax 链接技术是将下一个调用放在第一个调用的返回中。以下代码段应该让您走上正轨：

function ShowUrlInDialog(url){
    $.get(url,function(data){
        tag.html(data).dialog({width: '100%',modal: true}).dialog('open');
        sendUserOfNotes();
    });
}

function sendUserOfNotes(){
    $.post('/pcg/popups/getNotes.php',{'nameNotes': notes_name.text()},function(response){
        $('#notes_msg').text(response.the_notes)
    },"json");
}

詹姆斯说得对。ShowUrlInDialog() 设置对话框的 html 并且 sendUserOfNotes() 更改对话框中元素的内容。每次 sendUserOfNotes() 首先返回 ShowUrlInDialog() 都会清除笔记。jeroen 的承诺示例也应该有效。

于 2013-02-12T22:44:36.127 回答