Author Topic: Jquery error when resizing a column  (Read 2725 times)

[email protected]

  • Newbie
  • *
  • Posts: 1
    • View Profile
Jquery error when resizing a column
« on: September 15, 2016, 09:42:30 pm »
I'm getting the following error when trying to resize a column:

"Unhandled exception at line 5, column 17736 in http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js

0x800a01b6 - JavaScript runtime error: Object doesn't support property or method 'andSelf'"


It seems the "andSelf" method was deprecated after version 1.8 of the jquery UI.  Can anyone please shed some insight to why this is happening or how to resolve?  Thanks in advance.

Here is my aspx page:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ParamQueryGrid.aspx.cs" Inherits="TestPages_ParamQueryGrid" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>ParamQueryGrid</title>
    <link rel="stylesheet" href="../Theme/redmond/jquery-ui-1.10.3.custom.min.css" />


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


    <link rel="stylesheet" href="../javascripts/PQGrid/pqgrid.min.css" />
    <script type="text/javascript" src="../javascripts/PQGrid/pqgrid.min.js"></script>

    <script type="text/javascript">


        //Return data to a grid by calling a web method that calls a SP that returns a dataset and eventually a JSON string to the grid
        $(document).ready(function () {

            $.ajax({
                url: '/TestPages/Test.aspx/GetEmployeeByIdGet',
                method: 'post',
                contentType: "application/json; charset=utf-8",
                data: {},
                dataType: "json",
                success: function (data) {

                    var objdata = $.parseJSON(data.d);

                    var obj = {
                        dataModel: { data: objdata },
                        width: 700,
                        height: 400,
                        title: "Grid From JSON",
                        //flexHeight: true,
                        //flexWidth: true,
                        resizable: true
                    };

                    obj.colModel = [
                        //{ title: "ID", width: 100, dataType: "integer", dataIndx: "ID" },
                        { title: "Name", width: 200, dataType: "string", dataIndx: "Name" },
                        { title: "Gender", width: 150, dataType: "string", align: "right", dataIndx: "Gender" },
                        { title: "Salary", width: 150, dataType: "int", align: "right", dataIndx: "Salary" }
                    ];

                    $("#grid_json").pqGrid(obj);

                },
                error: function (err) {

                    alert('Error' + err.responseText);
                }
            });

        });

        //Return data to a grid by calling and passing a parameter to a web method that calls a SP that returns a dataset and eventually a JSON string to the grid
        $(document).ready(function () {

            var empID = 1;

            $.ajax({
                url: '/TestPages/Test.aspx/GetEmployeeByIdGetWithParameter',
                method: 'post',
                contentType: "application/json; charset=utf-8",
                data: '{employeeId:' + empID + '}',
                dataType: "json",
                success: function (data) {

                    var objdata = $.parseJSON(data.d);

                    var obj = {
                        dataModel: { data: objdata },

                        title: "Grid From JSON",
                        flexHeight: false,
                        flexWidth: false,
                        resizable: true
                    };

                    obj.colModel = [
                        //{ title: "ID", width: 100, dataType: "integer", dataIndx: "ID" },
                        { title: "Name", width: 200, dataType: "string", dataIndx: "Name" },
                        { title: "Gender", width: 150, dataType: "string", align: "right", dataIndx: "Gender" },
                        { title: "Salary", width: 150, dataType: "int", align: "right", dataIndx: "Salary" }
                    ];

                    $("#grid_array").pqGrid(obj);

                },
                error: function (err) {

                    alert('Error' + err.responseText);
                }
            });

        });

    </script>
</head>
<body>
    <form id="form1" runat="server">
        <br />
        <br />
        <div id="grid_array"></div>

        <br />
        <br />
        <div id="grid_json"></div>
    </form>
</body>
</html>