Задача заголовка диалогового окна jQuery

Question

Как бы вы переопределили функциональность по умолчанию jQuery UI, чтобы каждый раз, когда я устанавливал новый заголовок для диалога, он добавляет перед ним xxx? Таким образом, $("#any_dialog_id").dialog("option", "title", "yyy") установил бы название xxxyyy.

$().ready(function(){ 

    $("#dialog").dialog(); 

    $(".ui-dialog-title").before("xxx"); 

    // I add the line // 
    $("#any_dialog_id").dialog("option", "title", "yyy"); 

}); 

Но он показывает yyyxxx не xxxyyy

Что я должен сделать, чтобы заставить его работать ??

Спасибо ...

Answer 1

Есть много способов, которыми вы могли бы это сделать. Самое простое - запустить свою линию $(".ui-dialog-title").before("xxx");ПОСЛЕ каждый звонок для открытия диалога. Вы не можете просто запустить его один раз и ожидать повторного запуска при последующих диалоговых вызовах.

Другой способ сделать это - изменить код jquery. Но я ВЫСОКО не рекомендую это делать.

Если бы я действительно хотел систематически применять префикс, я бы сделал вспомогательную функцию или оболочку, которые сделают это для меня, и вызовите ее вместо прямого диалога jquery.

Вот пример того, что вы могли бы сделать, и я включил jsfiddle ссылку, а также (http://jsfiddle.net/stdw6j5q/1/):

HTML:

<div id="idDiv_MyDialog">Hi 1!</div> 
<div id="idDiv_MyDialog2">Hi 2!</div> 
<div id="idDiv_MyDialog3">Hi 3!</div> 
<div id="idDiv_MyDialog4">Hi 4!</div> 

JAVASCRIPT:

jDialog = function(options) { 
    // THE WRAPPER TAKES TWO EXTRA OPTIONS TO IDENTIFY THE DIALOG AND THE TITLE PREFIX TO USE 
    // I SET A DEFAULT SELECTOR IF NOTHING IS PASSED IN 
    var _dialog = options && options.dialog ? options.dialog : '#idDiv_MyDialog'; 
    // HERE YOU CAN SET A DEFAULT PREFIX 
    var _titlePrefix = options && options.titlePrefix ? options.titlePrefix : 'XYZ: '; 
    // UPDATE THE TITLE OPTION 
    options.title = _titlePrefix + options.title; 
    // PASS THROUGH ALL YOUR NORMAL OPTIONS TO THE DIALOG 
    $(_dialog).dialog(options); 
    // THIS RETURNS A HANDLE/REFERENCE TO THE DIALOG CREATED 
    return $(_dialog); 
} 

$(function() { 

    // CALL YOUR WRAPPER WHEN YOU NEED TO CREATE/MOD THE DIALOG 
    $myDialog1 = jDialog({ 
     title: 'Hey Jude', 
     close: function(event, ui) { $myDialog2.dialog('open'); } 
    }); 
    $myDialog2 = jDialog({ 
     dialog: '#idDiv_MyDialog2', 
     title: 'Don\'t let me down', 
     autoOpen: false, 
     close: function(event, ui) { $myDialog3.dialog('open'); } 
    }); 
    $myDialog3 = jDialog({ 
     dialog: '#idDiv_MyDialog3', 
     title: 'Take a sad song', 
     autoOpen: false, 
     close: function(event, ui) { $myDialog4dialog('open'); } 
    }); 
    $myDialog4 = jDialog({ 
     dialog: '#idDiv_MyDialog4', 
     title: 'And make it better', 
     autoOpen: false 
    }); 
}); 

Answer 2

Вы можете задайте событие для запуска всякий раз, когда создается диалог, который добавляет заголовок.

$(document).on('dialogcreate', function(){ // let it bubble up 
    $(".ui-dialog-title", this).before("xxx"); // add "xxx" before the title of this dialog 
});