6

I am using jQuery-1.9.1 and jQuery-ui-1.10.2 to popup a dialog, my code is below:

<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.10.2.min.js"></script>
<link rel="stylesheet" type="text/css" href="css/jqueryUI/theme/redmond/jquery-ui-   1.10.2.custom.min.css" />
<script type="text/javascript">
$(function(){
    $("#dialog").dialog();
});
</script>
 </head>
  <body>
<div id="dialog">
     hello, this is a dialog
</div>
</body>

the dialog has only close button, no minimize and maximize buttons, but I want to show them. I find in this page, its dialog has minimize and maximize buttons, I don't find any special settings about dialog in author's javascript code, and the jQuery-ui version s/he used is 1.8.16, does jQuery-ui of my version has removed this functionality?

PS: my jQuery-1.9.1.min.js and jQuery-ui-1.10.2.min,js are downloaded from official website, no any customization change.

marc_s
  • 732,580
  • 175
  • 1,330
  • 1,459
hiway
  • 3,906
  • 10
  • 34
  • 57

4 Answers4

9

Looking at the source of jQuery UI in that example it looks like the guy that runs that blog site added customization for minimize and maximize support. You can find the following comment in the code.

/*
 * jQuery UI Dialog 1.8.16
 * w/ Minimize & Maximize Support
 * by Elijah Horton (fieryprophet@yahoo.com)
*/

You will need to add customization's for the dialog to support this or include a library that extends the jQuery UI dialog. It looks like this site has a plugin called jquery-dialogextend that will do what you are asking for.

DSlagle
  • 1,563
  • 12
  • 19
1

If you look towards the middle of the jquery-ui.js file linked in that page there is a section of unminified code from line 366 up to around line 1429 where he has added custom code to handle the minimize/maximize functionality.

Just note that there is no guarantee that section of code will work correctly (or at all) in any version of jQuery UI other than 1.8.16.

Ken Herbert
  • 5,205
  • 5
  • 28
  • 37
0

Also Check out jQuery Dialogr. I think this can help.

theCodeMachine
  • 1,681
  • 14
  • 11
0

I made a little plugin with the widget factory that extends the jquery ui dialog.

I use the jquery widget factory to add new functionnalities

$.widget('fq-ui.extendeddialog', $.ui.dialog, {
...
})(jQuery);

In the Jquery UI dialog code, there is a _createTitlebar method. I override it and add a maximize and minimize button

_createTitlebar: function () {
    this._super();
    // Add the new buttons
    ...        
    },
Thomas
  • 24,234
  • 6
  • 81
  • 125
  • While this link may answer the question, it is better to include the essential parts of the answer here and provide the link for reference. Link-only answers can become invalid if the linked page changes. – Heretic Monkey Oct 21 '14 at 19:37
  • Sorry, this is my first post ^^ – Thomas Oct 21 '14 at 21:43
  • No problem. Welcome to Stack Overflow! Thank you for expanding the answer to include the parts relevant to the answer. Please do take a look at the [help] section to familiarize yourself with the site's rules. – Heretic Monkey Oct 21 '14 at 22:11