On Fri, May 8, 2009 at 10:40 AM, DualFlex <frank.fourn...@gmail.com> wrote:
>
> Hi all,
>
> Just starting with jQuery...
>
> Q1) What is the most elegant way to embed another web page into a
> dialog? Use an IFrame?
Most elegent would be to call .dialog() on the iframe itself:
$("iframe").dialog()
or
$("#theidoftheiframe").dialog();
>
> Q2) Can't get a width of 600px ...
see below
>
> Q3) With Ie 6.x, my embedded web page appears first on the top-left
> and then fades out into the UI-dialog breaking it !?!
Put style="visibility:hidden" on the iframe (or its container) initially.
>
> Q4) No modal working...
see below
>
>
> Some code:
>
> **********************
> <head>
> <link type="text/css" href="http://jqueryui.com/latest/themes/base/
> ui.all.css" rel="stylesheet" />
> <script type="text/javascript" src="http://jqueryui.com/latest/
> jquery-1.3.2.js <http://jqueryui.com/latest/%0Ajquery-1.3.2.js>"></script>
> <script type="text/javascript" src="http://jqueryui.com/latest/ui/
> ui.core.js"></script>
> <script type="text/javascript" src="http://jqueryui.com/latest/ui/
> ui.draggable.js"></script>
> <script type="text/javascript" src="http://jqueryui.com/latest/ui/
> ui.resizable.js"></script>
> <script type="text/javascript" src="http://jqueryui.com/latest/ui/
> ui.dialog.js"></script>
> <script type="text/javascript">
>
> $(document).ready(function(){
> $("#dialog").dialog();
The first call to .dialog() is an init. The options are optional. So you can
call
$("#dialog").dialog()
to initialized a dialog with the default options, or
$("#dialog").dialog({ width: 600, modal: true })
to initialize a dialog overriding two of the default options
>
> $('.selector').dialog({ width: 600 });
> $('.selector').dialog({ modal: true });
The '.selector' is a placeholder in the documentation. It's mean to be
replaced by whatever selector you're using to get to the element. In this
case '#dialog'. As I said above, the first .dialog() call on an element is
an init. Any subsequent calls in which you pass an options hash will be
ignored. In order to get or set options after init, you call the dialog
option method:
$("#dialog").dialog(); // init with default options
$("#dialog").dialog("option", "width", 600); // set dialog option width to
600
$("#dialog").dailog("option", "modal", true); // set dialog option modal to
true
There are full code examples of getting and setting each option in the
documentation:
http://docs.jquery.com/UI/Dialog#option-width
http://docs.jquery.com/UI/Dialog#option-modal
Note: there's a dedicated mailing list for jQuery UI questions:
http://groups.google.com/group/jquery-ui
If you need any further help, see you there.
- Richard
