0

I am trying to pop up a message if session times out and some error message comes back from my controller.

My include is as follows....

<link rel="stylesheet" type="text/css" href="<%= ResolveUrl("~/Content/jqueryui/redmond/jquery-ui-1.8.16.custom.css") %>"/>
<link rel="stylesheet" type="text/css" href="<%= ResolveUrl("~/css/slideshow.css") %>"/>   
<script type="text/javascript" src="<%= Url.Content("~/Scripts/ui/jquery-1.6.2.js") %>"></script>
<script type="text/javascript" src="<%= Url.Content("~/Scripts/ui/jquery-ui-1.8.16.custom.js") %>"></script>

Here is the code:

<% 
        string AlertMessage2 = TempData["PublicAlertMessage"] as string;
        string AlertMessage2Title = TempData["AlertMessageTitle"] == null ? String.Empty : TempData["AlertMessageTitle"] as string;

        if( AlertMessage2 != null )
        { %>
          <div id="AlertMessage" title="">

             </div>
         <script type="text/javascript">
             jQuery.noConflict();
                 $("#AlertMessage").html("<center><%= AlertMessage2 %></center>");
                 $("#AlertMessage").dialog({ height: 240, width: 350, modal: true, title: '<%= AlertMessage2Title %>', buttons: { "OK": function () { $(this).dialog("close"); } } });

             });
          </script>

      <% } %>

I am getting "Microsoft JScript runtime error: Unable to get value of the property 'html': object is null or undefined" when I implement the following Jquery dialog.

Am I missing any include file? I have no clue and where to look! any ideas?

Thanks!

Now I can see the modal window... but getting error "Microsoft JScript runtime error: Object doesn't support property or method 'dialog'" in ok button

This is in IE 9. When I try in Google chrome, I cannot close the modal window. 

$("#AlertMessage").dialog({
                     height: 200,
                     width: 250,
                     modal: true,
                     title: '<%= AlertMessage2Title %>',
                     buttons: { "OK": function () { 
                    // $(this).dialog('close'); --> comment this and try to run... no issues
                     } } });

what's wrong with the buttons?

Update on 29th: If I remove the close functionality of ok, there is no error. But how do I close the modal window? any other work around?

Update on Dec 2nd: This code does not work in IE 8 and IE 9. Also the pop up window does not close. But no problem in IE 7.

Bhuvana
  • 1
  • 1
  • 5

1 Answers1

0

I think you miss a dependency used by jQuery Ui dialog:

UI Core
**UI Position**
UI Widget
UI Mouse (Optional; only needed if using UI Draggable or UI Resizable)
UI Draggable (Optional)
UI Resizable (Optional)

http://jqueryui.com/demos/dialog/

If you want to include the entire jQuery UI suite you can make a unique file and include it.

Irvin Dominin
  • 30,819
  • 9
  • 77
  • 111
  • Yes, I read that the main dependencies are core, position and widget. I added and ran the code. Still I get the same error! – Bhuvana Nov 28 '11 at 18:09
  • What version of jQuery do you use, 1.6.2? Can you try with 1.7? And what del of jQuery UI? Here is a "fast" working fiddle http://jsfiddle.net/ – Irvin Dominin Nov 28 '11 at 18:30
  • Version 1.6.2. I googled about this error. Somebody commented that it required some kind of order to include js files. Now I see the model window, but still error is coming up on .dialog of the OK button! Jquery Ui 1.8.16.custom.js – Bhuvana Nov 28 '11 at 18:52
  • Can you try with a complete 1.8.6 custom? No splitted UI js files – Irvin Dominin Nov 28 '11 at 18:56
  • I prefer use chat, but you can't join. So try use jQuery 1.7 please? – Irvin Dominin Nov 28 '11 at 19:12
  • same... Microsoft JScript runtime error: Object doesn't support property or method 'dialog'. This .dialog on Button function. – Bhuvana Nov 28 '11 at 19:23
  • Is the url content correct? Can you post the resultant html page code? – Irvin Dominin Nov 28 '11 at 19:34
  • Url content is correct. As I am appending with '~' it recognizes and gets the right file. Sorry, I cannot post the entire html code here. :( – Bhuvana Nov 28 '11 at 19:57
  • To check the problem, have you tried to use: $('#AlertMessage').dialog.('close'); ? – Irvin Dominin Dec 01 '11 at 16:35
  • Hve you got Telerik controls? Can this help you http://stackoverflow.com/questions/3845552/jquery-dialog-problem ? – Irvin Dominin Dec 02 '11 at 16:36
  • I do have telerik controls in my app. but not on this view. It's the home page and I am trying to show my session time out message with ok button. That's it. Some images with login fields that's it. But anyway I tried to register as a group for my telerik. Still it's not working – Bhuvana Dec 02 '11 at 19:42
  • mmm, interesting...some test! Have you got prototype or other js framework called (es. prototype) or get a script can override $; can you try using jQuery(this).dialog('close') instead of $(this).dialog('close')? You can you check out this http://api.jquery.com/jQuery.noConflict/ too ? – Irvin Dominin Dec 04 '11 at 21:47
  • Yes.. .I tried ( jQuery(this).dialog("close");) still I get the error... :( – Bhuvana Dec 06 '11 at 15:16
  • mmm, can you try using jquery.noconflict() please? – Irvin Dominin Dec 06 '11 at 15:40