2010-10-27 6 views
15

Je ne peux pas ajouter de bouton à cette boîte de dialogue jquery ui. si possible s'il vous plaît donnez-moi un exemple. merci.Bouton Ajouter à la boîte de dialogue jquery ui

<script type="text/javascript"> 
    $(document).ready(function() { 
     //setup new person dialog 
     $('#dialog2').dialog({ 
      autoResize: true, 
      show: "clip", 
      hide: "clip", 
      height: 'auto', 
      width: '1000', 
      autoOpen: false, 
      modal: true, 
      position: 'top', 
      draggable: false, 
      title: "انتخاب درخواست", 
      open: function (type, data) { 
       $(this).parent().appendTo("form"); 
      } 
     }); 

     $('#viewfaktor').dialog({ 
      autoResize: true, 
      show: "clip", 
      hide: "clip", 
      height: 'auto', 
      width: '1000', 
      autoOpen: false, 
      modal: true, 
      position: 'top', 
      draggable: true, 
      title: "مشاهده صورت ریز", 
      open: function (type, data) { 
       $(this).parent().appendTo("form"); 
      } 
     }); 


     $('#msgBox').dialog({ 


      autoResize: true, 
      show: "clip", 
      hide: "clip", 
      height: 'auto', 
      width: 'auto', 
      autoOpen: false, 
      modal: true, 
      position: 'center', 
      draggable: false, 



      open: function (type, data) { 
       $(this).parent().appendTo("form"); 
      } 


     }); 



    }); 

    function showDialog(id) { 
     $('#' + id).dialog("open"); 
    } 

    function closeDialog(id) { 
     $('#' + id).dialog("destroy"); 
    } 



</script> 

Répondre

23
$('#msgBox').dialog({ 
    autoResize: true, 
    show: "clip", 
    hide: "clip", 
    height: 'auto', 
    width: 'auto', 
    autoOpen: false, 
    modal: true, 
    position: 'center', 
    draggable: false, 

    open: function (type, data) { 
     $(this).parent().appendTo("form"); 
    }, 

    buttons: { "OK": function() { $(this).dialog("close"); } } 
}); 
+0

S'il vous plaît voir ma question. J'ai encore une erreur – Shahin

+0

J'ai ajouté votre code, mais j'ai une erreur de syntaxe! – Shahin

+2

Ah. J'ai omis une virgule. J'ai mis à jour l'exemple. –

6

Here is an example

ajouter à votre fonction:

buttons: { 
       OK: function() { //submit 
        $(this).dialog("close"); 
       }, 
       Cancel: function() { //cancel 
        $(this).dialog("close"); 
       } 
      } 

Ainsi, vous obtenez

$('#msgBox').dialog({ 


       autoResize: true, 
       show: "clip", 
       hide: "clip", 
       height: 'auto', 
       width: 'auto', 
       autoOpen: false, 
       modal: true, 
       position: 'center', 
       draggable: false, 
       buttons: { 
       OK: function() { //ok 
        $(this).dialog("close"); 
       }, 
       Cancel: function() { //cancel 
        $(this).dialog("close"); 
       } 
      } 
       open: function (type, data) { 
        $(this).parent().appendTo("form"); 
       } 


      }); 
24

Parfois, vous voulez ajouter les boutons dynamiquement après la boîte de dialogue est créer d aussi. Voir mon answer à la question Add a button to a dialog box dynamically

var mydialog = ... result of jqueryui .dialog() 
var buttons = mydialog.dialog("option", "buttons"); // getter 
$.extend(buttons, { foo: function() { alert('foo'); } }); 
mydialog.dialog("option", "buttons", buttons); // setter 
+0

Comment ajouter un bouton avec un identifiant spécifique? –

+0

Pourquoi auriez-vous besoin d'un identifiant sur le bouton? – JJS

+0

ou voulez-vous dire ajouter un bouton existant identifié par un ID? – JJS

10

Si vous souhaitez ajouter un bouton à une boîte de dialogue qui est déjà ouvert, vous pouvez faire quelque chose comme:

var buttonSet = $('#dialog').parent().find('.ui-dialog-buttonset'); 
var newButton = $('<button>My New Button</button>'); 
newButton.button().click(function() { 
    alert('My new button clicked'); 
}); 
buttonSet.append(newButton);