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
Post a Comment