Question

我正在使用jquery ui对话框在我的Web应用程序中创建多个注释。所以有一个添加注释按钮，点击打开一个音符（中间的对话框）。

用户可以一起打开多个笔记（对话框），并在每个笔记上填写内容保存，删除等。

打开多个音符时出现问题，我开始随机删除一些音符。因此，在删除时，打开的对话框的定位会受到影响。删除任何开始在屏幕上向上移动后打开的对话框。

我一直试图解决这个问题。 Plz帮助。

我的 JS ：

function createNote(note, noteContent, newNote){

        var noteDiv = $('<div> <textarea class="note-textarea" style="width:100%;background-color:#D3D3D3;"></textarea> </div>');

        noteDiv.clone(true).attr("id", noteId)
        .dialog({
            modal : false,
            draggable : false,
            resizable : false,
            open: function(){
                $("#"+ noteId).find('textarea').val(noteContent);
                $("#"+ noteId).find('textarea').css({
                    'height': $("#" + noteId).parent().height()
                });

            }, create: function(){

                // Create Title Textfield inside note top bar
                $("<input type = 'text' placeholder='Title' class='note-title'></input>").appendTo($("#"+ noteId).prev(".ui-dialog-titlebar").find('span'));
                $("#"+ noteId).prev(".ui-dialog-titlebar").find('input').val(noteTitle);

                if(!jQuery.isEmptyObject(note)){

                    createLastModifiedSpan($("#"+ noteId), lastModified);               
                }
            },
            buttons : [ {
                text : "Save",
                disabled: true,
                click : function() {

                ......AJAX CALL to SAVE
            }],
            beforeClose: function(event, ui) {

                if(confirm('Are you sure you want to delete this note?')){
                    $.ajax({
                        type: 'POST',
                        url: "/common/deleteNote.action",
                        data:
                        {                   
                            'note.id.operatorId':$('#operatorId').val(),
                            'note.id.noteId':noteId

                        },
                        success: function(data, textStatus, jqXHR){

                            if(data.result == 'success'){
                                alert('Deleted Successfully');
                                numberOfNotesCreated--;
                            }else
                                alert('Error in Deleting. Contact Admin');
                        },
                        error: function(data){
                            alert("Error in DB!");
                        }   
                    });

                }else
                    return false;

            },
            resize: function(event, ui) {alert('dskjfsf')},
            position:[10,100]
        }); 

        $("#"+ noteId).dialog('open');

        $("#" + noteId).parent().draggable()
        .resizable();/*.position({
               my: "center",
               at: "center",
               of: window
            });*/

        //Fire event on Either textarea or note title
        $("#"+ noteId).find('.note-textarea')
        .add($("#"+ noteId).prev('.ui-dialog-titlebar').find('.note-title')).keydown(function(event) {

            if($(this).val() != '') {
                toggleSaveButton($( "#" + noteId ), "enable");
            }
        });

        if(newNote){
            elementCount++;
            numberOfNotesCreated++;
        }
        prevNoteId = noteId;

    }

编辑：如果我按顺序添加注释说1,2,3,4并从最近添加的类似4,3,2开始删除.. positiong没有问题，但是当我开始随意删除2,1 ..然后其他注释的位置会受到干扰。

Answer 1

在jquery表单上找到了这个解决了我的问题：

https://forum.jquery.com/topic/bug-when-closing-one-dialog-within-multiple-stacked-dialogs

将其置于对话框的近距离功能中：

var widget = $(this).dialog("widget"), height = widget.height();
widget
    .nextAll(".ui-dialog").not(widget.get(0))
    .each(function() { var t = $(this); t.css("top", (parseInt(t.css("top")) + height) + "px"); });

删除后Jquery ui多个对话框定位？

1 个答案: