JQuery dialogs' modal and position attributes

I would like to have a form field by users on my web application to be a jquery popup window. I have the following code:

$(".form").dialog({
    modal: true;    
})

I'm not getting the desired result; the rest of the document(webpage) hidden or rather deactivated by the form. I want to have the user's focus to be on the form until the user clicks a button on the dialog.

I would also like to position the form in the centre of the page. I will appreciate any help with resolving the problems.

Answers


Remove ";" from your expression.

This may be correct:

$(function() {
    $(".form" ).dialog({
        modal: true
    });    
  });

This examle you can see here: http://jsfiddle.net/JN7pL/

P.S. Sorry for my English


In general this code should work, I've tested it here: http://jsfiddle.net/6YKmh/

Few things to check:

1) make you have necessary jQuery libs loaded, so in your "head" you have something like:

<script type='text/javascript' src='http//code.jquery.com/jquery-1.9.1.js'></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css">

2) make sure your match $(".form") actually matches something in your html i.e. you have an element with class="form" attribute like this:

<form class="form">
  <fieldset>
    <label for="name">Name</label>
    <input type="text" name="name" id="name" class="text ui-widget-content ui-corner-all">
  </fieldset>
</form>

3) make sure your js call

$(".form").dialog({
modal: true    
})

in html is either declared below the element you match with $(".form") , or wrap it in $(document).ready(function(){..}) :

$(document).ready(function(){
  $(".form").dialog({
    modal: true    
  })    
});

Need Your Help

UI Elements aren't visible by x:Name, they are visible only by Name. How to fix?

c# xaml windows-phone-8

I can't get access to UI elements from code using x:Name. They are only available if I use simple Name. I need to restore the access by x:Name because it is necessary to use FindName method. The pr...

Django 1.9 ImportError: No module named 'appname' on shell

python django django-apps

I have a project say MyProject with the given directory structure, where the apps are installed in the applications directory.