jQuery UI的按鈕顯示在對話框中

隱藏我已追加到我的對話框3個按鈕和我的對話框裏面我有3個標籤，我想顯示和隱藏在點擊選項卡的功能按鈕jQuery UI的按鈕顯示在對話框中

對於對話的代碼看起來它遵循

 $('a.open_dialog_edit').click(function(e) { 
     //e.preventDefault(); 
     var tabsDiv=$('<div />').appendTo('body').load($(this).attr('href'),function(){ 
     //$('#tabs').tabs(); 


     var editor = $('.textarea').wysihtml5().data("wysihtml5").editor.setValue(getCustomText($('select#state').val(), $('input#contactname.required').val())); 

     var dialog = $('#tabs').tabs(
       { 
        select: function(ev, ui) { 
         //Setup Buttons to each Tab 
         switch(ui.index) { 
         case 0: 
          $('.ui-dialog-buttonpane').find("button:contains('Email Senden')").hide(); 

         break; 

         case 1: 
          $('.ui-dialog-buttonpane').find("button:contains('Speichern')").hide(); 

         break; 

        } 

        }   
      }).dialog({ 

      title: $(this).attr('title'), 
      modal: true, 
      draggable: false, 
      width: 800, 
      position: 'top', 
      buttons: 
       [{ 
       text: "Speichern", 
       "class": "btn btn-primary", 
       click: function() { 
        $.ajax({ 
          type: "POST", 
          url: 'action.php', 
          data: $("#edit_form").serialize(), // serializes the form's elements. 
          success: function(data) 
          { 
           alert('Der Datensatz wurde gespeichert!'); // show response from the php script. 
          }, 
          error:function(){ 

           alert('Es gibt ein Fehler bei Daten übetragung!'); 

          } 
         }); 
       }, 

      }, { 
       text: "Email Senden", 
       "class": "btn btn-primary", 
       click: function() { 
        $.ajax({ 
          type: "POST", 
          url: 'mailer.php', 
          data: $("#contactform").serialize(), // serializes the form's elements. 
          success: function(data) 
          { 
           alert('Das Email wurde geschickt!'); // show response from the php script. 
          }, 
          error:function(){ 

           alert('Es gibt ein Fehler bei Daten übetragung!'); 

          } 
         }); 
       }, 
       text: "Rechnung herunterladen", 
       "class": "btn btn-primary", 
       click: function() { 

        $.ajax({ 
          type: "POST", 
          url: 'docsx.php', 
          data: $("#edit_form").serialize(), // serializes the form's elements. 
          success: function(data) 
          { 

           window.location.href ='rechnung.docx'; // show response from the php script. 
          }, 
          error:function(){ 

           alert('Es gibt ein Fehler bei Daten übetragung!'); 

          } 
         }); 

        } 
      }], 

      close: function() { 
       tabsDiv.remove() // so I can reload again 
       location.reload(true); 
//    allFields.val("").removeClass("ui-state-error"); 


      }, 
     }); 

     $('select#state').on('change',function() { 
      $('ul.wysihtml5-toolbar').remove(); 
      alert($('select#state').val()); 
     $('.textarea').wysihtml5().data("wysihtml5").editor.setValue(getCustomText($('select#state').val(), $('input#contactname.required').val())); 

    }); 

}); 

     return false; 

});

一個例子是：如果第一個選項卡被點擊超過森電子郵件按鈕應該牆根

來源

2012-09-18 kakuki

一種方式來做到這一點是首先存儲對話框元素

var dialog = $('<div />').appendTo('body').load($(this).attr('href')).dialog({

然後檢查標籤指數，選項卡被選中並找到並隱藏該按鈕。

$("#tabs").tabs(select:function(ev, ui){ 
    switch(ui.index) { 
     case 1: 
      dialog.find("button").show().filter(":contains('Send Email')").hide(); 
     break; 

    } 
    //alternatively can do this if the tabs and buttons are in the same order 
    //lots of ways to do this... 
    dialog.find("button").show().eq(ui.index).hide(); 
});

更新：你需要show()所有其他按鈕隱藏首先你要隱藏的問題之前。

來源

2012-09-18 20:23:55 Nal

您好感謝您的意見我還是不知道如何處理這個問題，如果我把一個變量比它打破一切 – kakuki

@ user1659575的對話框中，我沒有看到你的代碼的任何錯誤。但是你沒有設置選項'select'選項。所以我不確定你破了什麼？ – Nal

幾乎是每次點擊的工作只是按鍵不好渲染它們消失後3次點擊我做了我的代碼的更新也許你可以幫我 – kakuki

可以綁定一個tabselect事件，然後通過訪問該選項卡的索引如下所示

$('#tabs').bind('tabsselect',function(event, ui) { 
      if(ui.index==2){

把你發送郵件功能上你喜歡與操作，一個例子顯示here

來源

2012-09-18 20:18:59 sayannayas

隱藏和顯示按鈕可以使用CSS和jQuery來實現。

「類」：因此，例如，創建對話框時指定唯一的類每個按鈕「myButton1」

，然後使用jQuery來顯示或隱藏：

$（」 .myButton1' ）。顯示（）; $（'.myButton1'）.hide（）;

來源

2014-07-27 10:16:53 user3781087

jQuery UI的按鈕顯示在對話框中

回答

相關問題