Problem with jQuery Dialog

Hi, every body I am developing an MVC application and I want to use the jQuery dialog. I have the following scenario: I have a view of the Telerik tree, and when I click on any node, I want the dialog to open and display information about this node. First, I will add the following script to initialize the dialog box:

    $(document).ready(function () {
        $("#dialog").dialog("destroy");
        $("#dialog-form").dialog({
            autoOpen: false,
            height: 500,
            width: 500,
            modal: true,
            buttons: {
                Cancel: function () {
                    $(this).dialog('close');
                }
            }
        });
    });

then wrote the following code in OnSelect (Telerik client event)

        $('#dialog-form').dialog('open');
        $('#dialog-form').load('<%= Url.Action("SomeAction", "SomeController") %>');

on my main page, I added the script files needed to make the modal work like this:

<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.dialog.js") %>"></script>
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.core.js") %>"></script>
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.widget.js") %>"></script>
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.button.js") %>"></script>
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.draggable.js") %>"></script>
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.position.js") %>"></script>
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.resizable.js") %>"></script>

and when I click on the nodes of the tree nothing happens, the Chrome developer tools show the following error:

Uncaught TypeError: Object # does not have a method dialog

it seems like there is an error with the script registration or something like this

any help with this

+3
2

... Telerik , script :

<% Html.Telerik().ScriptRegistrar().DefaultGroup(group => group
   .Add("jquery-1.4.2.js")
   .Add("jquery.ui.core.js")
   .Add("jquery.ui.widget.js")
   .Add("jquery.ui.mouse.js")       
   .Add("jquery.ui.draggable.js")
   .Add("jquery.ui.button.js")       
   .Add("jquery.ui.resizable.js")
   .Add("jquery.ui.dialog.js")
   .Add("jquery.ui.position.js")

);
  % >

+4

, , :

<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.core.js") %>"></script>
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.widget.js") %>"></script>
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.mouse.js") %>"></script>
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.draggable.js") %>"></script>
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.button.js") %>"></script>
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.position.js") %>"></script>
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.resizable.js") %>"></script>
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.dialog.js") %>"></script>

ui.mouse.


... , jQuery UI , , , HTTP-, :

<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.js") %>"></script>

: jQuery UI .

CDN, , ( ) Google:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js"></script>

( jQuery CDN) . .

+6

Source: https://habr.com/ru/post/1767658/


All Articles