在fullCalendar中无法多次使用对话框

Question

我的html编码如下：

主要对话框

<div id="dialog" class="dialog" title ="Choose" style="display:none">
<form>
    <fieldset align="center">
        <label for="button1"></label>
        <input type="button" name="dialogedit" class="text ui-widget-content ui-corner-all" value="Edit"></button>
        <label for="button2"></label>
        <input type="button" name="dialogdelete" class="text ui-widget-content ui-corner-all" value="Delete"></button>
    </fieldset>
</form>

编辑对话框

<div id="dialogedit" class="dialogedit" title ="Edit Your Event" style="display:none" align="center">
<form>
    <fieldset align="center">
        <label for="previousEventName">Previous Event:</label>
        <input type="text" name="previousEvent" id="previousEvent" class="text ui-widget-content ui-corner-all" readonly>
        <label for="titleEventName">Event Name:</label>
        <input type="text" name="titleEvent" id="titleEvent" class="text ui-widget-content ui-corner-all" placeholder="Enter your new event">
        <label for="button2"></label>
        <input type="button" name="changeEvent" id="changeEvent" class="text ui-widget-content ui-corner-all" value="Change"></button>
    </fieldset>
</form>

删除对话框

<div id="dialogdelete" class="dialogdelete" title ="Delete Your Event" style="display:none" align="center">
<form>
    <fieldset align="center">
        <label for="deleteEventName">Are You Sure?</label><br>
        <input type="button" name="deleteEventYes" id="deleteEventYes" class="text ui-widget-content ui-corner-all" value="Yes!! I Am Sure!"></button>
        <label for="button2"></label><br>
        <input type="button" name="deleteEventNo" id="deleteEventNo" class="text ui-widget-content ui-corner-all" value="No!! Cancel It!"></button>
    </fieldset>
</form>

我的fullcalendar js编码是这样的：

eventClick: function (calEvent, jsEvent, view) {

                var opt = {
                    autoOpen: false
                };


                $(document).ready(function() {
                        $('[name="dialogedit"]').click(buttonOne);
                        $('[name="dialogdelete"]').click(buttonTwo); 
                    }); 

                        var theDialog = $(".dialog").dialog(opt);
                        var theDialog2 = $(".dialogedit").dialog(opt);
                        var theDialog3 = $(".dialogdelete").dialog(opt);
                        theDialog.dialog("open");

                        function buttonOne(){
                            var cCheck = calEvent.start.toJSON().slice(0,10);
                            var cToday = new Date().toJSON().slice(0,10);
                            if(cCheck < cToday){
                                alert("You are FORBIDED to update an event on past dates");
                            }
                            else{

                                if(theDialog2.dialog("open")){
                                    theDialog.dialog("close");
                                }

                                var previousEvent1 = $("#previousEvent");
                                var newTitleEvent1 = $("#titleEvent");
                                previousEvent1.val(calEvent.title)
                                $("#changeEvent").click(function(){
                                    var newTitleEvent2 = document.getElementById("titleEvent").value;
                                    var oldTitleId = calEvent.id;
                                    console.log(calEvent.title);

                                    var cTitle = JSON.parse(localStorage["events"]);
                                    for (var i = 0; i < cTitle.length; i++) {
                                        if(cTitle[i].id == oldTitleId){
                                            //alert(JSON.stringify(cTitle[i])+"<<<>>>"+oldTitleId);
                                            cTitle[i].title = newTitleEvent2;
                                            break;
                                        }
                                    }   
                                    localStorage.setItem('events', JSON.stringify(cTitle));
                                    calEvent.title = newTitleEvent2;
                                    self.$el.fullCalendar('updateEvent', calEvent);


                                    theDialog2.dialog("close");
                                    theDialog2.dialog("destroy");
                                    //alert("Successful");

                                });
                            }   
                        }

                        function buttonTwo(){


                            if(theDialog3.dialog("open")){
                                    theDialog.dialog("close");
                                }
                            $("#deleteEventYes").click(function(e){
                                var deleteId = calEvent.id;

                                e.preventDefault();

                                var items = JSON.parse(localStorage["events"]);
                                for (var i = 0; i < items.length; i++) {
                                    if(items[i].id == deleteId){
                                        //alert(JSON.stringify(items[i])+"<<<>>>"+deleteId);
                                        items.splice(i,1);
                                        break;
                                    }
                                }

                                localStorage.setItem('events', JSON.stringify(items));
                                self.$el.fullCalendar('removeEvents',calEvent.id);
                                alert("Successful");

                                $(".ui-dialog-content").dialog().dialog("close");


                            });

                            $("#deleteEventNo").click(function(){
                                theDialog3.dialog("close");
                                theDialog3.dialog("destroy");

                            });

                        }

                    },

对于我的主要问题，似乎我不能多次删除，与编辑相同。此外，我不能同时使用删除然后编辑，因为所有这些都会给我一些错误。

我的对话框的流程是，如果用户点击某个活动，则会显示包含Edit和Delete按钮的主对话框。用户可以选择使用哪一个。我尝试先删除一个事件，然后编辑其他事件。但是它会返回错误。我确实试图找到我在某个地方犯的错误，但没有运气。

此外，我尝试在用户点击Edit或Delete按钮后关闭主对话框。我认为这部分有问题。我的假设是对话框可能误读了我的打开和关闭请求。

我得到的错误如Uncaught Error: cannot call methods on dialog prior to initialization; attempted to call method 'close'

请帮忙。