发表新帖
发表新帖

Object doesn't support property or method 'dialog'

后端 未结
关注
5 911
醉话见心
醉话见心 2021-01-12 03:25

Refering the AjaxControlToolkit, I created a UI dialog from MVC.

Layout.cshtml
相关标签:
5条回答
  • 野的像风
    2021-01-12 03:29

    3 things come to mind that might be worth checking:

    1. Never hardcode urls in an ASP.NET MVC application. Always use helpers (or bundles which are recommended):

      <head>
    <meta charset="utf-8" />
    <title>@ViewBag.Title - My ASP.NET MVC Application</title>
    <link href="~/Content/smoothness/jquery-ui-1.10.2.custom.css" rel="stylesheet"  type="text/css" />
    <script src="~/Scripts/jquery-1.9.1.js" type="text/javascript"></script>
    <script src="~/Scripts/jquery-ui-1.10.2.custom.min.js" type="text/javascript"></script>
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <meta name="viewport" content="width=device-width" />
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")
</head>

    2. Make sure that at the end of your _Layout.cshtml you don't have a @Scripts.Render("~/bundles/jquery") call because this would include jQuery twice.

    3. If at the end of your _Layout.cshtml you have a dedicated section for custom scripts like @RenderSection("scripts", required: false), make sure that you have placed your custom script in that section (notice that since this RenderSection is at the end of the DOM you don't need to be wrapping your script in a document.ready event because by the time it executes, the DOM will already be loaded):

      <h2>jQuery UI Hello World</h2>          
<button id="show-dialog">Click to see jQuery UI in Action</button>            
<div id="dialog" title="jQuery UI in ASP.NET MVC" >  
   <p>You now have the power of ASP.NET, the simplicity of client-side scripting with jQuery, and the looks of jQuery UI. Congrats, web slinger!</p>  
</div>    

@section scripts {
    <script type="text/javascript">
        $('#dialog').dialog({
            autoOpen: false,
            width: 600,
            buttons: {
                "Ok": function () { $(this).dialog("close"); },
                "Cancel": function () { $(this).dialog("close"); }
            }
        });
        $("#show-dialog").button().click(function () {
            $('#dialog').dialog('open');
            return false;
        });
    });  
    </script>
}
    0 讨论(0)
  • 闹比i
    2021-01-12 03:42

    This commonly happens when you forget to add jquery-ui.js. The order of including jquery-ui-{version}.js also matters!

    You should include jquery-{version}.js then jquery-ui-{version}.js. Then just before </body> tag, include your custom javascript file.

    It will solve Javascript runtime error: [Object doesn't support property or method 'dialog'],['$' is undefined]

    0 讨论(0)
  • 不思量自难忘°
    2021-01-12 03:42

    Your code seems OK to me. You could check that your jQuery UI custom contains dialog feature (or try downloading full jQuery UI for testing purposes) and check that the URI to the JS script is correct.

    0 讨论(0)
  • 终归单人心
    2021-01-12 03:48

    In my case, this error was because I had forgotten to add the jquery-ui file reference:

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js" type="text/javascript"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/jquery-ui.min.js" type="text/javascript"></script>
    0 讨论(0)
  • 栀梦
    2021-01-12 03:48

    Include these three lines of code:

    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css" />
<script src="//code.jquery.com/jquery-1.10.2.js" type="text/javascript"></script>
<script src="//code.jquery.com/ui/1.11.2/jquery-ui.js" type="text/javascript"></script>
    0 讨论(0)
 看不清?
提交回复
热议问题