jquery-ui-dialog

I've implemented the following code for uploading photos inside a jQuery dialog (using an iframe). Here's the Iframe <div style="display: none"> <iframe id="upload-form" frameborder="0" marginheight="0" marginwidth="0" src="Upload.aspx"></iframe> </div> And here's the jQuery code on the parent page which takes care of opening the dialog. $("#upload-image").click(function (e) { e.preventDefault(); $('#upload-form').dialog({ modal: true, width: 300, title: "Upload Image", autoOpen: true, close: function(event, ui) { $(this).dialog('close') } }); }); I'm then injecting a script (on the iframe

I love jQueryUI's dialog boxes. However, there doesn't seem to be a way to dynamically load content built-in. I guess I have to use some other approach to achieve this? Will iframes load content only when they're made visible? Is that the right way to do this? I'm open to other dialog box mechanisms if they're more suited for loading the content only when they're first opened. This isn't hard to do -- I wouldn't start messing with iframes for this alone. How about something like this? $( ".selector" ).dialog({ open: function(event, ui) { $('#divInDialog').load('test.html', function() { alert(

Is it possible to add icons to the buttons on a jQuery UI Dialog? I've tried doing it this way: $("#DeleteDialog").dialog({ resizable: false, height:150, modal: true, buttons: { 'Delete': function() { /* Do stuff */ $(this).dialog('close'); }, Cancel: function() { $(this).dialog('close'); } }, open: function() { $('.ui-dialog-buttonpane').find('button:contains("Cancel")').addClass('ui-icon-cancel'); $('.ui-dialog-buttonpane').find('button:contains("Delete")').addClass('ui-icon-trash'); } }); The selectors in the open function seem to be working fine. If I add the following to "open": $('.ui

I have a problem with the jquery-ui dialog box . The problem is that when I close the dialog box and then I click on the link that triggers it, it does not pop-up again unless I refresh the page. How can I call the dialog box back without refreshing the actual page. Below is my code: $(document).ready(function() { $('#showTerms').click(function() { $('#terms').css('display','inline'); $('#terms').dialog({ resizable: false, modal: true, width: 400, height: 450, overlay: { backgroundColor: "#000", opacity: 0.5 }, buttons:{ "Close": function() { $(this).dialog("close"); } }, close: function(ev,

I'm using a custom jQuery 1.10.3 theme. I downloaded every straight from the theme roller and I have intentionally not changed anything. I create a dialog box and I get an empty gray square where the close icon should be: I compared the code that is generated on my page: <div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix"> <spanid="ui-id-2" class="ui-dialog-title">Title</span> <button class="ui-dialog-titlebar-close"></button> </div> to the code generated on the Dialog Demo page : <div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix">

I am having an issue getting a dialog to work as basic functionality. Here is my jQuery source imports: <script type="text/javascript" src="scripts/jquery-1.9.1.js"></script> <script type="text/javascript" src="scripts/jquery-ui-1.11.1.js"></script> <script type="text/javascript" src="scripts/json.debug.js"></script> Html: <button id="opener">open the dialog</button> <div id="dialog1" title="Dialog Title" hidden="hidden">I'm a dialog</div> <script type="text/javascript"> $("#opener").click(function() { $("#dialog1").dialog('open'); }); </script> From the posts around seems like as a library

I have a dialog, and I have a datepicker field on the dialog. When I open the dialog and click in the datepicker field, the datepicker panel show behind dialog. I try more properties: zindex, stack, bgiframe, but not success. Someone can help me? Tks. Craig Stuntz Old Answer z-index (note the hyphen!) is the property that matters. Make sure you set it greater than the dialogue, and make sure you set it on the correct element. Here's how we do it: #ui-datepicker-div { z-index: 1000; /* must be > than popup editor (950) */ } API Change - April 17, 2010 In the CSS file for the date picker, find

The web application that I am upgrading uses jQuery and jQuery UI. I have replaced most instances of window.open and <a target=_blank> with jQuery UI dialog. For example, the terms and conditions used to open in a new window; now I use jQuery UI dialog with AJAX. For consistency I plan to use it wherever possible. One such place is a page where I'll have external links to videos. Something like: <a href="http://website.com/videos/1.html" target="_blank"><img src="http://website.com/videos/1.png"></a> <a href="http://website.com/videos/2.html" target="_blank"><img src="http://website.com/videos