Jquery dialog is undefined

Question

I am trying to open asp.net mvc view in jquery dialog.

Here is my view from where i am trying to open dialog:

<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.0/jquery-ui.min.js"></script>

<script type="text/javascript">
    $(function () {
        $('#my-dialog').dialog({
            autoOpen: false,
            width: 400,
            resizable: false,
            modal: true
        });

        $('.modal').click(function () {
            $('#my-dialog').load(this.href, function () {
                $(this).dialog('open');
            });
            return false;
        });
    });
</script>
<div id="my-dialog"></div>

@Html.ActionLink("Add Question", "AddQuestionInPage", new { pageID = @ViewBag.PageID },new { @class = "modal" })

But it shows this error in console:

Uncaught TypeError: undefined is not a function

It show the error on this line:

$(this).dialog('open');

What is going wrong? why dialog is undefined as i have added jquery-ui file. Plz guide me, Thanx

@ZippyV I tried to replace 'this' with '#my-dialog' but still it shows the same error — user2517610, Jul 13 '14 at 09:59

score 0 · Answer 1 · edited May 23 '17 at 12:20

0

This is one of the things you will experience when you got somekind of a mismatch between the path to the jQuery library or the order of ordering the references to the libraries you got.

Take a look at this, im sure it might be helpful: Uncaught TypeError: undefined is not a function on loading jquery-min.js

edited May 23 '17 at 12:20

Community

1
1

answered Jul 12 '14 at 19:13

Karsten

83
2
13

scripts are loading in this order: – user2517610 Jul 12 '14 at 19:26

score 0 · Accepted Answer · answered Jul 13 '14 at 10:30

Finally I managed to open view in dialog by doing following things:

In Layout file I ordered the scripts in this way:

<script src="@Url.Content("~/Scripts/jquery-1.5.1.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-ui-1.8.11.js")"></script>

as Karsten suggested, thanx Karsten your answer really helped!

And i replaced the following line:

$(this).dialog('open');

with this:

$('#my-dialog').dialog();

as ZippyV suggested in comment. Thanx ZippyV it helped! Thanx. .

Jquery dialog is undefined

2 Answers2