添加一个新的对话框

必须有一个更清洁的方式做什么，我想在这里做一个编辑按钮可以一个jQuery UI对话框，并加载...添加一个新的对话框

我有一个jQuery用户界面对话框当我点击FullCalendar插件中的eventClick处理程序时打开。

对话框包含事件的详细信息。在窗体的底部应该有一个编辑按钮，它将关闭对话框，并打开一个新窗体，并在窗体中添加一个可编辑窗体。

对于大多数情况下，我已经成功了，从编辑按钮的确可以在对话框中调出编辑窗体的意义上说。但它不是一个新的对话框，它与第一次点击时的对话框相同，并带有OK和编辑按钮。

我如何得到一个新的对话框打开编辑窗体？

下面是eventClick功能

eventClick: function(event) {     
       if (event.url) {       
        $('#details') 
         .load(event.url) 
         .dialog({        
          title: 'Event Details', 
          buttons: { "Ok": function() { $(this).dialog("close"); }, 
             "Edit": function() { 
             $(this).dialog("close"); 
             $('#details').load('/Events/Edit/' + event.id) 
                .dialog({ 
                 title: 'Edit' 
                  });             
                 } }         
          });         
         return false; 
        } 
       },

来源

2010-08-31 MrBliz

我看到两个问题，可能会造成您的问题：

dialog('close')仅仅关闭对话，但不会清空它内容。如果要清空对话框并将其恢复为干净的状态，则要使用 dialog('destroy')。
你有几个load()函数调用串在一起，但没有任何回调。所以你的加载，试图从/Events/Edit/eventID加载的内容是发射，但然后你立即再次显示对话框。 load()功能有一个回调参数，将获得执行时，内容从 URL返回load() 功能。这样，一旦从服务器接收到内容，就会显示对话框。

，我认为你可以组织你的代码，以便它是一个小更易于维护的（但它也涉及到打破了你的一些匿名函数为命名的函数）的方法是如下：

eventClick: function(event) { 
    if(event.url) { 
     $("#details").load(event.url, loadDialog(event.id)); //call loadDialog once you get content back from your URL 
    } 
} 

function loadDialog(eventId) { 
    $("#details").dialog({ 
     title: "Event Details", 
     buttons: { 
      "OK" : function() { $(this).dialog("close"); }, //this just closes it - doesn't clean it up!! 
      "Edit" : function() { 
       $(this).dialog("destroy"); //this completely empties the dialog 
              //and returns it to its initial state 
       $("#details").load("/Events/Edit/" + eventId, loadEditDialog($(this))); 
      } 
     } 
    }); 
} 

function loadEditDialog(theDialogContainer) { //this is a simple dialog display function -- could be inlined 
    $(theDialogContainer).dialog({ 
     title: "Edit" 
    }); 
}

我希望这可以帮助！以上所有代码都未经过测试，因此可能会出现拼写错误 - 主要是伪代码来解释我的推理。如果有问题，请告诉我，我会相应更新我的问题。

来源

2010-08-31 17:30:27

干杯队友，我会测试它，当我回来的明天而努力，看看我的身体情况如何。 – MrBliz 2010-08-31 19:22:16

，你也可以尝试这样的事：

$("#details").dialog({ 
     title: "Event Details", 
     buttons: { 
      ... 
      "Edit" : function() { 
       $(this).dialog("option", "buttons", { "OK":...}); 
       $("#details").load("/Events/Edit/" + eventId); 
       $(this).dialog("option", "title", "Edit"); 
      } 
     } 
    });

来源

2010-09-01 12:09:45 katrin

添加一个新的对话框

回答

相关问题