c# - Trying JQuery-UI to create modal in MVC project -


i'm using mvc 5/c#. i'm trying follow example found here: jquery-ui in mvc5
has me add jquery-ui nuget, did.

here have in index.cshtml:

<div>     <input type="button" value="get form" onclick="getform()" /> </div>  <script type="text/javascript">     function getform() {         $('#dialog').dialog({             autoopen: true,             width: 400,             resizable: false,             title: 'register',             modal: true,             open: function (event, ui) {                  $(this).load('@url.action("register", "registration")');             },             buttons: {                 "close": function () {                     $(this).dialog("close");                 }             }         });     }</script>  <div id="dialog"></div> 

here in _layout.cshmtl file:

    @styles.render("~/bundles/css")     @scripts.render("~/bundles/scripts")     @styles.render("~/content/themes/base/css") 

here in bundleconfig.cs (paths correct):

    public static void registerbundles(bundlecollection bundles)     {         bundles.add         (             // ensure "bootstrap.3.3.4.min.css" exists in directory it's used minification, or else minification fail.             new stylebundle("~/bundles/css")                 .include                 (                     "~/content/css/bootstrap.3.3.4.css",                      "~/content/css/sticky-footer.css",                     "~/content/css/style.css"                 )         );          bundles.add         (             new scriptbundle("~/bundles/scripts")                 .include                 (                     "~/content/js/jquery.1.11.2.js",                     "~/content/js/bootstrap.3.3.4.js",                     "~/content/js/ie10-viewport-bug-workaround.js",                     "~/scripts/jquery-ui-1.11.4.js"                 )         );          bundles.add         (             new stylebundle("~/content/themes/base/css")             .include             (                 "~/content/themes/base/core.css",                 "~/content/themes/base/resizable.css",                 "~/content/themes/base/selectable.css",                 "~/content/themes/base/accordion.css",                 "~/content/themes/base/autocomplete.css",                 "~/content/themes/base/button.css",                 "~/content/themes/base/dialog.css",                 "~/content/themes/base/slider.css",                 "~/content/themes/base/tabs.css",                 "~/content/themes/base/datepicker.css",                 "~/content/themes/base/progressbar.css",                 "~/content/themes/base/theme.css"             )         );     } 

i javascript errors:

uncaught referenceerror: jquery not defined
$.ui @ jquery-ui-1.11.4.js:14
(anonymous function) @ jquery-ui-1.11.4.js:16
uncaught typeerror: $(...).dialog not function

i'm guessing '.dialog not function' error because jquery-ui-1.11.4 not loading correctly. have version mis-match or something?

it looks jquery ui isn't loaded on page or loaded before jquery. check view source of page check order correctness of included libraries.


Comments

Popular posts from this blog

How has firefox/gecko HTML+CSS rendering changed in version 38? -

javascript - Complex json ng-repeat -

jquery - Cloning of rows and columns from the old table into the new with colSpan and rowSpan -