Geek asks and answers

Jquery ui dialog ui-widget-overlay height problem

I am developing a facebook application.

In this application, I use the jquery ui dialog to show the contents of the div (which comes from the ajax answer).

An excellent display of the content returned from the ajax call opens in a dialog box. But there is a strange behavior. the page (it seems that my application is being called in fb iframe) is constantly updated , as if it was sending some data for an unlimited period. Moreover, the height of the "div-u-widget-overlay" div , which is dynamically generated using the ui dialog, is constantly increasing and never becoming stable. Perhaps these two strange behaviors are connected in some way. I can not understand.

In this regard, even if I use the modal: true " property for my dialog, I can access the entire page after the dialog.

Snippet of my code:

$.ajax({

            type : "POST",
            data : "id=1",
            url : site_url + "lists/add_new",
            success : function(response) {
                $('#new_box').html(response);

                $('#new_box').dialog({                  
                    modal: true,
                    position: 'top'
                });
                $('#new_box').dialog( "open" );
                return false;               
            },
            error   : function(XMLHttpRequest, textStatus, errorThrown) {               
                alert(textStatus);
            }

        });

Please guide.

thank

UPDATE:

, :

"" "" ( div ) , , js Chrome, , . , , : |

, "" "false", , "", , , - "" .

, "" ""?

+3
3

ajax, Jquery . :

onload .

$(function(){
$('#new_box').dialog({                  
                    modal: true,
                    position: 'top'
                });
});

ajax , open.

$.ajax({

            type : "POST",
            data : "id=1",
            url : site_url + "lists/add_new",
            success : function(response) {
                $('#new_box').html(response);

                $('#new_box').dialog( "open" );
                return false;               
            },
            error   : function(XMLHttpRequest, textStatus, errorThrown) {               
                alert(textStatus);
            }

        });

0

, iframe, div iFrame. , , ( FB) , .

, iFrame, - .

0

, , , , jquery , :

$('.ui-widget-overlay').attr('style', 'height: 1001px !important; z-index: 1001;');

I found that it is important that this works. Thanks to this insertion method, a line of code replaces the built-in jquery ui-widget-overlay style that was sent to the browser. I found this the hard way because I did not enter the original z index, so it made an inscription over the top of the dialog box, which made the dialog invisible. In short, you might have to play around with the z-index value.

0
source

More articles:


All Articles