Geek asks and answers

JQuery UI add id to dialog

How to add an identifier to a specific dialog? I just want to apply a separate style for each dialog and try to do it like this:

var $order_dialog = $("<%= escape_javascript(render('order_mini_site_form', :layout => false)) %>");

var current_dialog = $order_dialog.dialog({
  width: 515,
  height: 575,
  modal: true,
  resizable: false,
  draggable: false,
  title: false,
  autoOpen: true,
  closeOnEscape: false,
  buttons: [
    { text: " " , click: function() { $(this).find('form').submit();    $(this).dialog('close'); } },
    { text: "", click: function() { $(this).dialog('close'); } }
  ]
}).parent().find('.ui-dialog-titlebar').remove();


$current_dialog.attr('id', 'awesome_dialog');

but the dialog created inside the body tag without id, and I cannot apply style to it.

+5
source share
4 answers

If your goal is to use this id in css, you can achieve this with the css class.

The dialogClass parameter allows you to specify the class that will be applied to the dialog box. You can then use this class in your selectors to apply a different style for a specific dialog.

+7
source

A little late, but here's how to do it:

$('#placeholderId').dialog('widget').attr('id', 'dialogId');

$('# placeholderId'). dialog ('widget') <div> , , , , .

+9

, id .find('.ui-dialog-titlebar').remove() . .

var $order_dialog = $("<%= escape_javascript(render('order_mini_site_form', :layout => false)) %>");

var current_dialog = $order_dialog.dialog({
  width: 515,
  height: 575,
  modal: true,
  resizable: false,
  draggable: false,
  id: "ololo",
  title: false,
  autoOpen: true,
  closeOnEscape: false,
  buttons: [
    { text: " " , click: function() { $(this).find('form').submit();                $(this).dialog('close'); } },
    { text: "", click: function() { $(this).dialog('close'); } }
  ]
})

$current_dialog.parent().find('.ui-dialog-titlebar').remove();
$current_dialog.attr('id', 'awesome_dialog');
+1

( " " ). , jQuery Dialog Box ID, , , . JS, , .

// Here I declare dynamically inserted content [for example, what I create] to have the tempstep identifier, this will be used with the call below to add the identifier to the jQuery dialog

The code: jQuery ('<div id="tempstep"></div>').dialog({

The code: jQuery('#tempstep').parent().attr("id","dialogBox");

0
source

More articles:


All Articles