Откройте диалоговое окно пользовательского интерфейса при нажатии кнопки в JQuery

Мой предыдущий qstn в этом форуме о динамическом назначении текста динамикам в jquery, и я нашел решение для этого здесь. Теперь, на мой вопрос, при нажатии этой кнопки мне нужно открыть другой диалог пользовательского интерфейса с 2 кнопками. Я написал следующий код. Я могу открыть интерфейс диалогового окна, но кнопки не отображаются. Pls поможет мне изменить свой код.Откройте диалоговое окно пользовательского интерфейса при нажатии кнопки в JQuery

<html> 
    <head> 
     <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" /> 
     <script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
     <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script> 
    </head> 
    <body> 
     <div id="selector" title="Pop Up" class = "selector"> <p><span class="ui-icon ui-icon-alert" style="float: left; margin: 0 7px 20px 0;"></span> Do u want to save the score?</p> </div> 
     <script> 
     var monthNames = ["January", "February", "March", "April", "May", "June",     "July", "August", "September", "October", "November", "December"]; 
     var today = new Date(); 
     var month = monthNames[today.getMonth()]; 
     var nextMonth = monthNames[today.getMonth() + 1]; 

     $(".selector").dialog({buttons: [ 
       { 
        text: month, 
        click: function() { 
        $("#opener").dialog({modal: true, height: 590, width: 1005 }); 
         $(this).dialog("close"); 
        } 
       }, 
       { 
        text: nextMonth, 
        click: function() { 
         $(this).dialog('close'); 
        } 
       } 
      ]}); 

     </script> 
     <script> 

      $(".opener").dialog({buttons: [ 
       { 
        text: "ok", 
        click: function() { 
         $(this).dialog("open"); 
        } 
       }, 
       { 
        text: "cancel", 
        click: function() { 
         $(this).dialog('open'); 
        } 
       } 
      ]}); 

    </script> 

    <div id="opener" title="Pop Up" class = "opener" width ="100px"> 
    <p><span class="ui-icon ui-icon-alert" style="float: left; margin: 0 7px 20px 0;"></span> 
    Score will be updated</p> </div> 


</body>

источник

2013-08-13 Sanjay Malhotra

make a fiddle/ –

Произошла ли ошибка в вашей консоли? – Kiel

@ Tushar -> Поскольку я новичок в этом ИТ-поле, я не знаю, что такое скрипка. Что это? –

Ну, вы не указали ни одной кнопки, чтобы показать в этой строке кода:

$("#opener").dialog({modal: true, height: 590, width: 1005 });

Может быть, вы хотели intiliazie это так, без открытия:

// did you mean to select #opener or .opener?? 
    $("#opener").dialog({buttons: [ 
     { 
      text: "ok", 
      click: function() { 
       $(this).dialog("open"); 
      } 
     }, 
     { 
      text: "cancel", 
      click: function() { 
       $(this).dialog('open'); 
      } 
     }, 
     autoOpen: false 
    ]});

А затем просто откройте его в другой строке из другого диалогового окна следующим образом:

$("#opener").dialog('open');

источник

2013-08-13 06:09:35

Привет, я попытался использовать приведенный выше код. Изменен .opener для #opener и поместите диалог $ ("# openener"). ('Open'); , Но не работает –

хорошо, я попробовал с вашим полным кодом в вопросе. По моему предложению, вы должны обернуть второй оператор сценария в оператор '$ (function() {....});', поэтому диалоговое окно 'openener 'будет инициализировано в DOM ready. Затем вы можете открыть его в обработчике кликов вашего первого диалога с помощью '$ ('# opener'). Dialog ('open');' –

Я попробовал обернуть скрипт в функции. Но все равно не работает. :-( –

Откройте диалоговое окно пользовательского интерфейса при нажатии кнопки в JQuery

ответ

Смежные вопросы