Jquery dialog extentions

  • ScottG
  • Proficient
  • Proficient
  • ScottG
  • Posts: 463

Post 3+ Months Ago

I have run into many cases using the jQuery dialog box that I need to add,remove,rename or sometimes even change the function to be executed. I found an extend that someone did and expanded on there add and remove and now I have most if not all the functionality I need. I want to pass this on I'm sure someone will find it useful.

jquery.dialogExtend.js
JAVASCRIPT Code: [ Select ]
/**
*   jQuery dialogExtend
*   @authors    cjdell, William Gaines <sgscott87@gmail.com>
*
*   Notes: Two of the function were found at https://groups.google.com/forum/#!topic/jquery-ui/nl2pVA4-taQ with credit to cjdell.
*   Two of the functions are Derivatives of the add/remove functions
*
*/
 
 
/**
* Adds a button to the dialog box
*
* @param string buttonName This is the buttons name that is displayed this is case sensitive
* @param function func This is the function to execute on the button click.
* @usage $('#dialogBox').dialog('addButton', 'Run', function(){alert('Did you see spot?');});
*
* Notes: Credit to cjdell found at https://groups.google.com/forum/#!topic/jquery-ui/nl2pVA4-taQ
*/
 
$.extend($.ui.dialog.prototype, {
   'addButton': function(buttonName, func) {                
      var buttons = this.element.dialog('option', 'buttons');
      buttons[buttonName] = func;
      this.element.dialog('option', 'buttons', buttons);
   }
});
 
 
/**
* Remove a button from the dialog box
*
* @param string buttonName This is the buttons name that is displayed this is case sensitive
* @usage $('#dialogBox').dialog('removeButton', 'Run');
*
* Notes: Credit to cjdell found at https://groups.google.com/forum/#!topic/jquery-ui/nl2pVA4-taQ
*/
 
$.extend($.ui.dialog.prototype, {
   'removeButton': function(buttonName) {                
      var buttons = this.element.dialog('option', 'buttons');
      delete buttons[buttonName];
      this.element.dialog('option', 'buttons', buttons);
   }
});
 
 
/**
* Rename a button in the dialog box
*
* @param string buttonOldName This is the old button name that is displayed this is case sensitive
* @param string buttonNewName This is the new button name that is to displayed this is case sensitive
* @usage $('#dialogBox').dialog('renameButton', 'Run', 'Stop');
*
*/
 
$.extend($.ui.dialog.prototype, {
   'renameButton': function(buttonOldName, buttonNewName) {                
      var buttons = this.element.dialog('option', 'buttons');
      var func = buttons[buttonOldName];
      delete buttons[buttonOldName];
      buttons[buttonNewName] = func;
      this.element.dialog('option', 'buttons', buttons);
   }
});
 
 
/**
* Change the buttons function
*
* @param string buttonName This is the button name that is displayed this is case sensitive
* @param string func This is the new function to be used by the button
* @usage $('#dialogBox').dialog('changeFunction', 'Run', function(){ alert('The snail it so fast!') });
*
*/
 
$.extend($.ui.dialog.prototype, {
   'changeFunction': function(buttonName, func) {                
      var buttons = this.element.dialog('option', 'buttons');
      buttons[buttonName] = func;
      this.element.dialog('option', 'buttons', buttons);
   }
});
 
  1. /**
  2. *   jQuery dialogExtend
  3. *   @authors    cjdell, William Gaines <sgscott87@gmail.com>
  4. *
  5. *   Notes: Two of the function were found at https://groups.google.com/forum/#!topic/jquery-ui/nl2pVA4-taQ with credit to cjdell.
  6. *   Two of the functions are Derivatives of the add/remove functions
  7. *
  8. */
  9.  
  10.  
  11. /**
  12. * Adds a button to the dialog box
  13. *
  14. * @param string buttonName This is the buttons name that is displayed this is case sensitive
  15. * @param function func This is the function to execute on the button click.
  16. * @usage $('#dialogBox').dialog('addButton', 'Run', function(){alert('Did you see spot?');});
  17. *
  18. * Notes: Credit to cjdell found at https://groups.google.com/forum/#!topic/jquery-ui/nl2pVA4-taQ
  19. */
  20.  
  21. $.extend($.ui.dialog.prototype, {
  22.    'addButton': function(buttonName, func) {                
  23.       var buttons = this.element.dialog('option', 'buttons');
  24.       buttons[buttonName] = func;
  25.       this.element.dialog('option', 'buttons', buttons);
  26.    }
  27. });
  28.  
  29.  
  30. /**
  31. * Remove a button from the dialog box
  32. *
  33. * @param string buttonName This is the buttons name that is displayed this is case sensitive
  34. * @usage $('#dialogBox').dialog('removeButton', 'Run');
  35. *
  36. * Notes: Credit to cjdell found at https://groups.google.com/forum/#!topic/jquery-ui/nl2pVA4-taQ
  37. */
  38.  
  39. $.extend($.ui.dialog.prototype, {
  40.    'removeButton': function(buttonName) {                
  41.       var buttons = this.element.dialog('option', 'buttons');
  42.       delete buttons[buttonName];
  43.       this.element.dialog('option', 'buttons', buttons);
  44.    }
  45. });
  46.  
  47.  
  48. /**
  49. * Rename a button in the dialog box
  50. *
  51. * @param string buttonOldName This is the old button name that is displayed this is case sensitive
  52. * @param string buttonNewName This is the new button name that is to displayed this is case sensitive
  53. * @usage $('#dialogBox').dialog('renameButton', 'Run', 'Stop');
  54. *
  55. */
  56.  
  57. $.extend($.ui.dialog.prototype, {
  58.    'renameButton': function(buttonOldName, buttonNewName) {                
  59.       var buttons = this.element.dialog('option', 'buttons');
  60.       var func = buttons[buttonOldName];
  61.       delete buttons[buttonOldName];
  62.       buttons[buttonNewName] = func;
  63.       this.element.dialog('option', 'buttons', buttons);
  64.    }
  65. });
  66.  
  67.  
  68. /**
  69. * Change the buttons function
  70. *
  71. * @param string buttonName This is the button name that is displayed this is case sensitive
  72. * @param string func This is the new function to be used by the button
  73. * @usage $('#dialogBox').dialog('changeFunction', 'Run', function(){ alert('The snail it so fast!') });
  74. *
  75. */
  76.  
  77. $.extend($.ui.dialog.prototype, {
  78.    'changeFunction': function(buttonName, func) {                
  79.       var buttons = this.element.dialog('option', 'buttons');
  80.       buttons[buttonName] = func;
  81.       this.element.dialog('option', 'buttons', buttons);
  82.    }
  83. });
  84.  
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • Bigwebmaster
  • Site Admin
  • Site Admin
  • User avatar
  • Posts: 9089
  • Loc: Seattle, WA & Phoenix, AZ

Post 3+ Months Ago

Very cool, something like this would be great to place in the snippets section on the next version of Ozzu.

Post Information

  • Total Posts in this topic: 2 posts
  • Users browsing this forum: No registered users and 126 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.