jquery-ui-dialog

I am, trying to replicate the 'confirm' box of javascript using jquery dialog. This is my code, function customConfirm(customMessage) { $("#popUp").html(customMessage); $("#popUp").dialog({ resizable: false, height: 240, modal: true, buttons: { "OK": function () { $(this).dialog("close"); alert(true); return true; }, Cancel: function () { $(this).dialog("close"); alert(false); return false; } } }); } But when I tried to alert this method, it shows 'undefined'. It is not waiting for the popup to display. How can i make this customConfirm function to wait for the users input(ok/cancel)?. My need

How do I set the default values for the jQuery UI dialog? For example, this is how I set the defaults in the jQuery UI datepicker: $.datepicker.setDefaults({ dateFormat: 'dd/mm/yy' }); I couldn't find the same functionality in the dialog documentation I found a solution $.extend($.ui.dialog.prototype.options, { modal: true, width: 650 }); Groovetrain There's no built-in functionality for that AFAIK, but what I usually do is set them myself in a separate hash like this: var dialog_defaults = { autoopen: false, buttons: { close: function() { $(this).dialog('close'); } } }; Then when I create the

I'm having trouble in validating a jQuery UI dialog using Jquery Validate upon clicking Save. Here's my code to create Jquery dialog. It loads the dialog from a target a href URL: $(document).ready(dialogForms); function dialogForms() { $('a.dialog-form').click(function() { var a = $(this); $.get(a.attr('href'),function(resp){ var dialog = $('<div>').attr('id','formDialog').html($(resp).find('form:first').parent('div').html()); $('body').append(dialog); dialog.find(':submit').hide(); dialog.find('#return').hide(); dialog.dialog({ title: a.attr('title') ? a.attr('title') : '', modal: true,

After extensive searching on this topic, I haven't been able to find an answer, so hopefully someone can help me with this issue. I have a relatively basic dialog box: $("#dialog-search").dialog({ resizable: false, height:dimensionData.height, width: dimensionData.width, modal: true, title: dimensionData.title, position: [x,y], open: function() { $("#dialog-search .dateField").blur(); }, close: function(event, ui){ callBack(event,ui); } }); What I want to do is replace the X icon (ui-icon-close) with a different icon provided by the ui (ui-icon-minus), so that clicking the minus icon closes

I create modal dialog with form inside it (with some text input). And I just can't enter the text inside the textbox. Dialog blocks keyboard input. Here is my simplified example: <div id="modal-dialog"> <label for="my-text">TRY to input text...</label> <textarea id="my-text" style="position:relative; z-index:1"></textarea> </div> <script type="text/javascript"> var dialog = $('#modal-dialog').dialog({ modal: true }); </script> Note : You may ask - why did I mentioned about "position:relative; z-index:1" ? Because it works fine without it. But I can't remove it because of design. Note : not

I'd like to use jQuery UI's dialog to implement a confirm dialog which is shown when the user clicks a delete-link (implemented using an asp:LinkButton ). I'm using code as shown below (copied from the jquery ui documentation): <!-- the delete link --> <asp:LinkButton ID="btnDelete" runat="server" Text="Delete" OnClick="btnDelete_Click" CssClass="btnDelete"></asp:LinkButton> <!-- the confirm-dialog --> <div id="dialog-confirm-delete" title="Delete?" style="display:none;"> <p>Are you sure you want to permanently deleted the selected items?</p> </div> <script> $(document).ready(function () { //