Изменение заголовка диалогового окна jQuery ui после обратного вызова загрузки


112

Мне нравится изменять заголовок в диалоговом окне пользовательского интерфейса после того, как я отправил форму в этом диалоговом окне пользовательского интерфейса. Итак, в callback-функции после того, как loadя должен предложить, но я пробовал и искал в Google без результата.

Есть у кого-нибудь идея?

Ответы:


259

Используя методы диалога:

$('.selectorUsedToCreateTheDialog').dialog('option', 'title', 'My New title');

Или прямо, хакерский:

$("span.ui-dialog-title").text('My New Title'); 

На будущее вы можете пропустить Google с помощью jQuery. В большинстве случаев jQuery API ответит на ваши вопросы. В этом случае страница API диалога . Для основной библиотеки: http://api.jquery.com


9
Помните, что "взломанная" версия выше изменит заголовок ВСЕХ диалогов на странице (в случае, если вы создали более одного).
camainc 02

1
я могу передать несколько вариантов?
themhz

3
@themis в текущей версии есть .option()метод, который также принимает объект, см. options(options)здесь: api.jqueryui.com/dialog/#method-option
Nick Craver

$ ("# dialog"). dialog ({autoOpen: false, show: {effect: "blind", duration: 1000}, hide: {effect: "explode", duration: 1000}, close: function () {; }, title: "test"}). dialog ("open");
WhiteWolfza

Поскольку мой ответ по-прежнему привлекает много внимания, я также опубликую его здесь .. stackoverflow.com/a/17745795/1315125
Игорь Л.

14

Я нашел более простое решение:

$('#clickToCreate').live('click', function() {
     $('#yourDialogId')
         .dialog({
              title: "Set the title to Create"
         })
         .dialog('open'); 
});


$('#clickToEdit').live('click', function() {
     $('#yourDialogId')
         .dialog({
              title: "Set the title To Edit"
         })
         .dialog('open'); 
});

Надеюсь, это поможет!


3

Усовершенствование хакерской идеи Ника Кравера, чтобы поместить собственный HTML в заголовок диалогового окна jquery:

var newtitle= '<b>HTML TITLE</b>';
$(".selectorUsedToCreateTheDialog").parent().find("span.ui-dialog-title").html(newtitle);

Я предпочитаю не быть хакером, когда мне это не нужно, и уже существует поддерживаемый jquery способ установки заголовков HTML: переопределение метода _title. Это уже
описано

2

Я попытался реализовать результат Ника:

$('.selectorUsedToCreateTheDialog').dialog('option', 'title', 'My New title');

Но это не сработало для меня, потому что у меня было несколько диалогов на одной странице. В такой ситуации заголовок будет установлен правильно только в первый раз. Не удалось сшить команды:

    $("#modal_popup").html(data);
    $("#modal_popup").dialog('option', 'title', 'My New Title');
    $("#modal_popup").dialog({ width: 950, height: 550);

Я исправил это, добавив заголовок к аргументам функции javascript каждого диалога на странице:

function show_popup1() {
    $("#modal_popup").html(data);
    $("#modal_popup").dialog({ width: 950, height: 550, title: 'Popup Title of my First Dialog'});
}

function show_popup2() {
    $("#modal_popup").html(data);
    $("#modal_popup").dialog({ width: 950, height: 550, title: 'Popup Title of my Other Dialog'});
}

0

Даже лучше!

    jQuery( "#dialog" ).attr('title', 'Error');
    jQuery( "#dialog" ).text('You forgot to enter your first name');

Первая строка не меняет заголовок диалога. В диалоговом окне jQuery UI такого атрибута нет. Второй изменит содержание самого диалога, но это не то, о чем спрашивал пользователь. Предположим, что idу вас есть диалог #dialog.
Пере
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.