Home/ Questions/Q 7550425
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-30T10:12:35+00:00

So in all my failed attempts to get jQueryUI working, I have tried this

  • 0

So in all my failed attempts to get jQueryUI working, I have tried this example here after downloading a theme from the jQueryUI site.

and here is my code looking at that example in the link above in my asp.net mvc page. 

<link type="text/css" href="<%= Url.Content("~/Scripts/jquery-ui/css/smoothness/jquery-ui-1.8.17.custom.css")%>" rel="stylesheet" />    
<script type="text/javascript" src="<%= Url.Content("~/Scripts/jquery-ui/js/jquery-1.7.1.min.js")%>"></script>
<script type="text/javascript" src="<%= Url.Content("~/Scripts/jquery-ui/js/jquery-ui-1.8.17.custom.min.js")%>"></script>



<script>

$('#dialog_link').click(function(){
    $('#Dialog').dialog('open');  
    return false;
});


</script>

<p id="dialog_link">Open Dialog</p> 


<div id="Dialog" title="Dialog title!">
This content shown within dialog...

</div>

After hitting F5 I would have expected to see a clickable text which when clicked would bring up a modal dialog with a [x] button to close it and get back to the main window. However what I get to see is this on page load,

screenshot of mvc application

where the text ‘open dialog’ does not respond to click events and the supposed “modal dialog” is already visible in the form of a plain string and without any formatting. So where did all the magic of jQueryUI go? Something wrong in my linking correct scripts?
Totally lost. Please help..

Edit
This exact same code works in pure html mode in a different file. when I copy this code into my asp.net mvc page within the content tags I get a javascript error at a non-descript line!!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Just take the ‘open’ out of your $(‘#Dialog’).dialog(‘open’); and you are good to go.

    Edit: Added this jsFiddle with your code as an example:

    http://jsfiddle.net/DoomHamster/LhJsL/1/

    Also, you don’t need ‘return false’ when clicking an element with no default click event.

    EDIT: From your comment below I suspect that you are having issues with loading jQuery and jQueryUI in the first place. Try replacing your script and css links with the following as a test to eliminate path issues:

    <link type="text/css" rel="Stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/themes/ui-lightness/jquery-ui.css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/jquery-ui.min.js"></script>
    • 0