Dialog jQuery ui mengubah judul setelah memuat-panggilan balik

111

Saya ingin mengubah judul dari Dialog UI setelah saya mengirimkan formulir di Dialog UI ini. Jadi dalam fungsi panggilan balik setelah loadsaya harus menyarankan, tetapi saya sudah mencoba dan googled tanpa hasil.

Adakah yang punya ide?

javascript jquery jquery-ui jquery-dialog Guido Lemmens 2
sumber

Jawaban:

258

Menggunakan metode dialog:

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

Atau secara langsung, hacky:

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

Untuk referensi di masa mendatang, Anda dapat melewati google dengan jQuery. API jQuery akan menjawab pertanyaan Anda hampir sepanjang waktu. Dalam hal ini, halaman Dialog API . Untuk perpustakaan utama: http://api.jquery.com

Nick Craver
sumber
8
Berhati-hatilah karena versi "hacky" di atas akan mengubah judul SEMUA dialog pada halaman (jika Anda telah membuat lebih dari satu).
camainc
1
bisakah saya memberikan beberapa opsi?
themhz
3
@themis dalam versi saat ini ada .option()metode yang mengambil objek juga, lihat di options(options)sini: api.jqueryui.com/dialog/#method-option
Nick Craver
$ ("# dialog"). dialog ({autoOpen: false, tampilkan: {efek: "buta", durasi: 1000}, sembunyikan: {efek: "meledak", durasi: 1000}, tutup: function () {; }, judul: "test"}). dialog ("open");
WhiteWolfza
Karena jawaban saya masih mendapat banyak perhatian, saya juga akan mempostingnya di sini .. stackoverflow.com/a/17745795/1315125
Igor L.
14

Saya telah menemukan solusi yang lebih sederhana:

$('#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'); 
});

Semoga membantu!

pekerja keras
sumber
3

Peningkatan dari ide hacky oleh Nick Craver untuk meletakkan HTML khusus dalam judul dialog jquery:

var newtitle= '<b>HTML TITLE</b>';
$(".selectorUsedToCreateTheDialog").parent().find("span.ui-dialog-title").html(newtitle);
penyimpanan
sumber
Saya lebih memilih untuk tidak meretas ketika saya tidak perlu melakukannya, dan sudah ada cara yang didukung jquery untuk menyetel judul HTML: mengganti metode _title. Ini sudah tercakup dalam jawaban SO ini: stackoverflow.com/questions/14488774/…
cincodenada
2

Saya mencoba mengimplementasikan hasil Nick yaitu:

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

Tetapi itu tidak berhasil untuk saya karena saya memiliki banyak dialog di 1 halaman. Dalam situasi seperti itu, ini hanya akan mengatur judul dengan benar pada kali pertama. Mencoba menjepit perintah tidak berhasil:

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

Saya memperbaikinya dengan menambahkan judul ke argumen fungsi javascript dari setiap dialog di halaman:

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'});
}
Tim B.
sumber
0

Bahkan lebih baik!

    jQuery( "#dialog" ).attr('title', 'Error');
    jQuery( "#dialog" ).text('You forgot to enter your first name');
pengguna4629979
sumber
Baris pertama tidak akan mengubah judul dialog. Tidak ada atribut seperti itu dalam dialog jQuery UI. Yang kedua akan mengubah konten dialog itu sendiri, tetapi bukan itu yang diminta pengguna. Dan itu seandainya iddialog yoru adalah #dialog.
Pere