Question

How can I add id to specific dialog?
I just want to apply separate style for each dialog and try doing 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 dialog created inside body tag without id and I cant apply style for it.

Answer 1

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

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