jquery - JQueryUI Dialog Size -
i'm new jqueryui, , though have dialog working, doesn't open @ size think i'm specifying. why setting width , height when dialog defined not affect initial size of dialog? how make 600px 500 px?
here div defines dialog:
<div id="dialog-form" title="create appointment"> <form> . . . </form> </div> here javascript makes dialog of it:
$(function() { $("#dialog-form").dialog({ autoopen: false, maxwidth:600, maxheight: 500, width: 600, height: 500, modal: true, buttons: { "create": function() { $(this).dialog("close"); }, cancel: function() { $(this).dialog("close"); } }, close: function() { } }); and javascript defines button open it:
$("#create-appt") .button() .click(function() { $("#dialog-form").dialog("open"); }); }); edit:
i see problem now: have worked fine, except running in google chrome using --app=... command-line option, not reloading whole application.
question: why setting width , height when dialog defined not affect initial size of dialog?
answer: does... browser using , version of jquery.
i cut/pasted code above small sample , worked perfectly... pasted full sample below can try on end.
<html> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <title>jquery ui example page</title> <link type="text/css" href="css/ui-lightness/jquery-ui-1.8.11.custom.css" rel="stylesheet" /> <script type="text/javascript" src="js/jquery-1.5.1.min.js"></script> <script type="text/javascript" src="js/jquery-ui-1.8.11.custom.min.js"> </script> <script type="text/javascript"> $(document).ready(function () { $(function() { $("#dialog-form").dialog({ autoopen: false, maxwidth:600, maxheight: 500, width: 600, height: 500, modal: true, buttons: { "create": function() { $(this).dialog("close"); }, cancel: function() { $(this).dialog("close"); } }, close: function() { } }); }); $("#create-appt") .button() .click(function() { $("#dialog-form").dialog("open"); }); }); </script> </head> <body> <h1>test</h1> <div id="dialog-form" title="create appointment"> <p> test </p> </div> <input type="button" id="create-appt" value="test"/> </body> </html>
Comments
Post a Comment