How to pass item position in jquery user interface dialog

I have a list of items, and when I click on each of them, I would like my jQueryUI dialog box to display the list item that was clicked next to it .

$( "#selector" ).dialog({ draggable: false,
              width: 250,
              autoOpen: false,
              position: [e.pageX,e.pageY] });

$(".openDialog").click(function(e){
        console.log('I need the cooridnates x:'+e.pageX+' and y:'+e.pageY+'to be passed to the dialog box');
        $( "#selector" ).dialog("open");
});

I can get the coordinates I need, but I can’t pass them to the init dialog.

It would be interesting to know about this.

Thanks in advance!

+3
source share
2 answers

Since you want to show the dialog box next to the click, you must postpone setting the position of the dialog until this information is available, that is, in your event handler:

$("#selector").dialog({
    draggable: false,
    width: 250,
    autoOpen: false
});

$(".openDialog").click(function(e) {
    $("#selector").dialog("option", "position", [e.pageX, e.pageY])
                  .dialog("open");
});
+5
source

Before displaying the dialog again, try:

$("#selector").dialog("option", "position", [e.pageX, e.pageY]);
+2
source

All Articles