Reputation: 65

Jquery Dialog - Object doesn't support this property or Method

My this code was working fine until I upgraded to Jquery newer version. Now I get above error.

 <link rel="stylesheet" type="text/css" href="site.css" />
    <link type="text/css" href="css/smoothness/jquery-ui-1.8.10.custom.css" rel="stylesheet" />
    <link rel="stylesheet" type="text/css" href="css/ddsmoothmenu.css" />   
     <script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>
    <script type="text/javascript" src="js/jquery-ui-1.8.10.custom.min.js"></script>    
    <script type="text/javascript" src="js/ddsmoothmenu.js"></script>

    <script type="text/javascript">    
         $(document).ready(function(){     
                $('#dialog').dialog({
                    modal: true,
                    autoOpen: false,
                    width: 760,
                    height: 'auto',             
                    close: function(event, data) {
                        $('#mainFrame')[0].src = "LoadingPage.aspx";
                    }
                });
                $('a[name="dia"]').click(function(){
                    $('#mainFrame')[0].src = this.file;
                    $('#dialog').data('title.dialog', this.innerText); 
//                    $('#dialog').data('width.dialog', this.diaWidth); 
//                    $('#dialog').data('height.dialog', this.diaHeight); 
                    $('#dialog').dialog('open');
                    return false;
                });             

                if (document.getElementById('hidIsAdmin').value == "1"){
                    document.getElementById('liAdmin').style.display = 'block';
                    document.getElementById('liReports').style.display = 'block';
                }else {
                    $('#liAdmin').remove();
                    $('#liReports').remove();

                }
                if (document.getElementById('hidCreate').value == "1"){
                    document.getElementById('liCreate').style.display = 'block';
                }else {
                    $('#liCreate').remove();
                    $('.edit_icon_link').hide(0);                   
                }
            });
            function hideEditIcon(){
                $('.edit_icon_link').hide(0);                   
            }            
    </script>

Upvotes: 3

Answers (5)

TheHolyTerrah

Reputation: 2879

I'm now using MVC4. So I had to add jquery-ui-1.8.20.js to the BundleConfig.RegisterBundles() under App_Start to get it to work:

bundles.Add( new ScriptBundle( "~/bundles/jquery" ).Include(
  "~/Scripts/jquery-{version}.js",
  "~/Scripts/jquery-ui-1.8.20.js" ) );

Upvotes: 0

James in Indy

Reputation: 31

I had something similar happen (converting MVC3 ASP to Razor), and in my case, moving my jquery-1.4.4.min.js reference to my master page helped.

I say "helped" because now the open works, but the $(this).dialog("close"); doesn't.

function ShowPopUp(strDivName)
{
    $("div[id$='" + strDivName + "']").dialog(
        {
            title: "blah blah blah",
            width: 600,
            modal: true,
            resizable: true,
            closeOnEscape: false,
            buttons:
            {
                "Save": function () { SaveThis(); $(this).dialog("close"); },
                "Cancel": function () { $(this).dialog("close"); }
            }
        }
    );
    $("div[id$='" + strDivName + "']").dialog("open");
}

Upvotes: 3