JQuery: заголовок диалогового окна не обновляется

Question

Мне нужно обновить заголовок диалогового окна при выборе изображения. Я отлаживать в Хрома Inspect Element и мое наблюдение о значении дается в комментарии ниже:

function setDialogTitle(item){ // item is input#searchclassimg.imagewrapper 
    var id = item.id; // gives id of selected element 
    switch(id){ 
    // dialog is a div, whose default title is "Some picker" 

    case "searchclassimg": 
     $('#dialog').attr('title', 'Class Picker'); //after this i expect dialog's title to be updated as "Class Picker" 
     break; 
    case "searchsectionimg": 
     $('#dialog').attr('title', 'Section Picker'); 
     break; 
    case "searchrollnoimg": 
     $('#dialog').attr('title', 'Roll No Picker'); 
     break; 
    case "searchnameimg": 
     $('#dialog').attr('title', 'Name Picker'); 
     break; 
    } 
} 
$(document).ready(function() { 
        if (!window.jQuery) { 
         document 
           .write('<link rel="stylesheet" href="/WEB-INF/lib/jquery-ui-themes-1.10.3/themes/smoothness/jquery-ui.css"><\/link>'); 
         document 
           .write('<script src="/WEB-INF/lib/jquery-1.10.1.js"><\/script>'); 
         document 
           .write('<script src="/WEB-INF/lib/jquery-ui.js"> <\/script>'); 

        } 
        var counter = 0; 
        $(".imagewrapper").click(function() { 
             $("#dialog").dialog(); 
             setDialogTitle(this); 
             if (counter < 1) { 
              $("#searchboxdiv").after('<hr id="separator1">'); 
              $("#separator1").after('<div id="contents" class="container"> </div>'); 
              setDialogItems(); 
              counter++; 
             } 
            }); 
        $(document).on('click', "#searchbutton", function() { 
         var data1 = $("#searchbox").val(); 
         $.ajax({ 
          url : "FormHandler", 
          data : { 
           data1 : data1 
          }, 
          success : function(result) { 
           var result = null; 
          } 
         }); 
        }); 

ImageWrapper является <div>, при которых определены несколько элементов. То, что я получаю после выполнения, это только «Some Picker». Где я делаю ошибку, пожалуйста, укажите это.

Answer 1

Я предполагаю, что с тех пор, как вы отметили этот jQuery и Dialog, вы используете виджет jQuery UI Dialog. Если да, то вы можете использовать функцию option в диалоговом окне, чтобы установить новое название:

$('#dialog').dialog('option', 'title', 'New Title'); 

Так что ваш код станет:

function setDialogTitle(item){ // item is input#searchclassimg.imagewrapper 
    var id = item.id; // gives id of selected element 
    switch(id){ 
    // dialog is a div, whose default title is "Some picker" 

    case "searchclassimg": 
     $('#dialog').dialog('option', 'title', 'Class Picker'); //after this i expect dialog's title to be updated as "Class Picker" 
     break; 
    case "searchsectionimg": 
     $('#dialog').dialog('option', 'title', 'Section Picker'); 
     break; 
    case "searchrollnoimg": 
     $('#dialog').dialog('option', 'title', 'Roll No Picker'); 
     break; 
    case "searchnameimg": 
     $('#dialog').dialog('option', 'title', 'Name Picker'); 
     break; 
    } 
} 

http://api.jqueryui.com/dialog/#method-option

http://api.jqueryui.com/dialog/#option-title