jQWidgets Forums

jQuery UI Widgets Forums Getting Started Grid not getting populated in IE8

This topic contains 3 replies, has 2 voices, and was last updated by  Peter Stoev 11 years ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • Grid not getting populated in IE8 #55125

    Vardhman Jain
    Participant

    Hi,

    I am using jqxgrid for my application.The grid is working fine in chrome browser however in Internet Explorer 8 it is not.In IE8, the grid is getting populated in some pages while in some pages it is showing error “Object does not support this property or method-jqxrid.js”.However,it is supporting the same js file for other pages in IE8 only.I am using the same code for all the pages as well in same sequence order (for js imports).
    Also, I have observed that,this problem is coming in pages in which I havent used iframe while grid is coming fine in pages in which grid is used in iframe.Can anybody please suggest what might be the problem??

    Grid not getting populated in IE8 #55126

    Peter Stoev
    Keymaster

    Hi Vardhman Jain,

    Check your ode for syntax errors. The Grid works fine in IE8 on our website. Also “Object does not support this property or method-jqxrid.js” points you out that jqxrid.js is invalid syntax. At first, the file’s name is jqxgrid.js and there’s validation for invalid API so you can use the API as it is documented on this page: http://www.jqwidgets.com/jquery-widgets-documentation/documentation/jqxgrid/jquery-grid-api.htm.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com/

    Grid not getting populated in IE8 #55127

    Vardhman Jain
    Participant

    Hi Peter,

    Thanks for your reply.I checked my code refering to link you provided.But the problem is that the same code is working in few page however in few cases it is throwing this error.Can you please look into my code once and see what may be the issue-

    <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
    <meta http-equiv=”X-UA-Compatible” content=”IE=10; IE=9; IE=8; IE=EDGE” />

    <html>

    <head>
    <meta http-equiv=”Content-Type” content=”text/html; charset=ISO-8859-1″>
    <link href=”/BES/resources/css/login.css” rel=”stylesheet”>
    <link href=”/BES/resources/css/OpsSupportGroup.css” rel=”stylesheet”>
    <link href=”/BES/resources/css/BeaconStyle.css” rel=”stylesheet”>

    <link href=”/BES/resources/css/jqx.base.css” rel=”stylesheet”>
    <link href=”/BES/resources/css/OpsSupportGroup.css” rel=”stylesheet”>
    <script src=”/BES/resources/scripts/jquery-1.10.2.js” ></script>
    <script src=”/BES/resources/scripts/jquery-1.10.2.min.js” ></script>
    <script src=”/BES/resources/jqwidgets/jqxcore.js” ></script>
    <script src=”/BES/resources/jqwidgets/jqxcheckbox.js”></script>
    <script src=”/BES/resources/jqwidgets/jqxcore.js”></script>
    <script src=”/BES/resources/jqwidgets/jqxbuttons.js”></script>
    <script src=”/BES/resources/jqwidgets/jqxscrollbar.js” ></script>
    <script src=”/BES/resources/jqwidgets/jqxmenu.js”></script>
    <script src=”/BES/resources/jqwidgets/jqxgrid.js”></script>
    <script src=”/BES/resources/jqwidgets/jqxgrid.selection.js” ></script>
    <script src=”/BES/resources/jqwidgets/jqxgrid.columnsresize.js” ></script>
    <script src=”/BES/resources/jqwidgets/jqxdata.js” ></script>
    <script src=”/BES/resources/jqwidgets/jqxgrid.edit.js”></script>
    <script src=”/BES/resources/scripts/demos.js” ></script>
    <script src=”/BES/resources/generatedata.js”></script>
    <script src=”/BES/resources/jqwidgets/jqxnumberinput.js” ></script>
    <script src=”/BES/resources/jqwidgets/jqxwindow.js” ></script>
    <script src=”/BES/resources/jqwidgets/jqxlistbox.js” ></script>
    <script src=”/BES/resources/jqwidgets/jqxdropdownlist.js” ></script>
    <script src=”/BES/resources/jqwidgets/jqxgrid.sort.js”></script>
    <script src=”/BES/resources/jqwidgets/jqxgrid.filter.js”></script>
    <script src=”/BES/resources/jqwidgets/jqxgrid.pager.js” ></script>

    <script type=”text/javascript”>
    $(document).ready(function () {

    $(“#main-panel-bes”).css(“background-color”, “#D9EFF7”);

    $(“#noti”).css(“color”, “#FFFFFF”);
    $(“a”).removeClass(“a5”);
    $(“a”).addClass(“aC”);

    ;

    var temp=JSON.stringify(“done”);

    if(temp.length > 7)
    {
    alert(temp);
    window.close();
    jQuery.ajax({
    type : ‘GET’,
    data : jQuery(this).serialize(),
    url : ‘OpsSupportGroups?sessionValue=’+temp,
    success : function(data, textStatus) {

    },
    error : function(XMLHttpRequest, textStatus, errorThrown) {
    }
    });
    }

    var jsonString = JSON.stringify([{“securityGroupId”:”500092″,”groupName”:”Angola WellLink RT 01test”,”groupDesc”:”Ops Group for Angola WellLink RT”,”rowChangedBy”:”Shrey Chaturvedi”,”rowChangedDate”:”2014-05-26 11:51:39.0″},{“securityGroupId”:”500093″,”groupName”:”Group Qatar”,”groupDesc”:”Ops Group for Qatar WellLink RT”},{“securityGroupId”:”500094″,”groupName”:”Group Brazil”,”groupDesc”:”Ops Group for Brazil LiveWire”},{“securityGroupId”:”500098″,”groupName”:”Qatar WellLink Data Services”,”groupDesc”:”Ops Group for Qatar WellLink Data Services”},{“securityGroupId”:”25″,”groupName”:”Group United States 1test”,”groupDesc”:”testOps Group for United States WellLink RT”,”rowChangedBy”:”Richard Borremans”,”rowChangedDate”:”2014-05-05 12:12:45.0″},{“securityGroupId”:”16″,”groupName”:”Group Australia”,”groupDesc”:”Ops for Australia 2 edited”,”rowChangedBy”:”Enis Aliko”,”rowChangedDate”:”2014-04-09 17:55:23.0″},{“securityGroupId”:”23″,”groupName”:”Group Canada newly edited”,”groupDesc”:”Ops Group for Canada WellLink RT”,”rowChangedBy”:”Carmen Diluca”,”rowChangedDate”:”2014-04-19 18:43:23.0″},{“securityGroupId”:”20″,”groupName”:”Group Australia”,”groupDesc”:”Ops Group for Australia WellLink RT”},{“securityGroupId”:”28″,”groupName”:”Group Canada”,”groupDesc”:”Ops Group for Canada WellLink Data”},{“securityGroupId”:”500095″,”groupName”:”Angola LiveWire”,”groupDesc”:”Ops Group for Angola LiveWire”},{“securityGroupId”:”500096″,”groupName”:”Angola WellLink Data Services”,”groupDesc”:”Ops Group for Angola WellLink Data Services”},{“securityGroupId”:”500097″,”groupName”:”Qatar LiveWire”,”groupDesc”:”Ops Group for Qatar LiveWire”}]);

    document.getElementById(“CreateDeleteButton”).disabled=true;
    $(“#jqxgridtwo”).hide();
    $(“#gridtwo”).hide();
    $(“#text”).show();
    $(“#image2”).hide();
    $(“#image”).hide();

    var source =
    {
    localdata: jsonString,
    datatype: “json”,
    datafields:
    [
    { name: ‘securityGroupId’, type: ‘string’ },
    { name: ‘groupName’, type: ‘string’ },
    { name: ‘groupDesc’, type: ‘string’ },
    { name: ‘rowChangedBy’, type: ‘string’ },
    { name: ‘rowChangedDate’, type: ‘string’ },
    ],
    pagesize:5,

    };

    var dataAdapter = new $.jqx.dataAdapter(source);
    var editrow = -1;

    $(“#jqxgrid”).jqxGrid(
    {

    width: ‘97%’,
    source: dataAdapter,
    pageable: true,
    sortable : true,
    editable: true,
    selectionmode: ‘checkbox’,

    showfilterrow: true,
    filterable : true,
    autoheight: true,
    pagesize:5,

    columnsresize: true,

    columns: [

    { text: ‘ID’, datafield: ‘securityGroupId’, editable:false , filtertype : ‘number’, width: ‘10%’, cellsalign: ‘right’ },
    { text: ‘Name’, datafield: ‘groupName’, editable:false , filtertype : ‘textbox’, width: ‘25%’ },
    { text: ‘Description’, datafield: ‘groupDesc’, editable:false ,filtertype : ‘textbox’, width: ‘33%’ },
    { text: ‘Updated By’, datafield: ‘rowChangedBy’, editable:false , filtertype : ‘textbox’, width: ‘13%’},
    {text: ‘Updated Date’, datafield: ‘rowChangedDate’, editable:false , filtertype : ‘textbox’, width: ‘15%’ },

    ]
    });

    $(“#jqxgrid”).bind(‘cellendedit’, function (event) {
    if (event.args.value) {
    $(“#jqxgrid”).jqxGrid(‘selectrow’, event.args.rowindex);

    }
    else {
    $(“#jqxgrid”).jqxGrid(‘unselectrow’, event.args.rowindex);
    }
    });

    var datainformation=$(“#jqxgrid”).jqxGrid(‘getdatainformation’);
    var rowscount=datainformation.rowscount;

    $(“#jqxgrid”).bind(‘rowselect’, function (event) {
    document.getElementById(“CreateDeleteButton”).disabled=false;
    var securityGroupId= event.args.row.securityGroupId;
    $(“#securityGroupId”).val(securityGroupId);

    jQuery.ajax({
    type : ‘GET’,
    data : jQuery(this).serialize(),
    url : ‘AdmintoolsOps?securityGroupId=’+securityGroupId,
    success : function(data, textStatus) {

    document.getElementById(‘AdmintoolsOpsID’).contentDocument.location.reload(true);

    },
    error : function(XMLHttpRequest, textStatus, errorThrown) {
    }
    });

    jQuery.ajax({
    type : ‘GET’,
    data : jQuery(this).serialize(),
    url : ‘DetailsAndCriteria?securityGroupId=’+securityGroupId,
    success : function(data, textStatus) {

    document.getElementById(‘OpsDetailsAndCriteria’).contentDocument.location.reload(true);

    },
    error : function(XMLHttpRequest, textStatus, errorThrown) {
    }
    });

    $(“#jqxgridtwo”).show();
    $(“#gridtwo”).show();
    $(“#text”).hide();
    $(“#image”).hide();
    $(“#image2”).show();

    var rows = $(“#jqxgrid”).jqxGrid(‘selectedrowindexes’);
    var wanted=rows[rows.length – 1];
    for (var m = 0; m < rows.length; m++)
    {
    var row = $(“#jqxgrid”).jqxGrid(‘getrowdata’, rows[m]);

    var selectedrowindex = rows[rows.length – m – 1];
    if(selectedrowindex !=wanted ){

    $(“#jqxgrid”).jqxGrid(‘unselectrow’, selectedrowindex);

    $(“#jqxgrid”).jqxGrid(‘setcellvalue’, selectedrowindex, ‘available’, false);
    }

    }

    });

    $(“#image”).click(function(){
    $(“#gridtwo”).show();
    $(“#gridtwo”).slideDown();
    $(“#text”).hide();
    $(“#image”).hide();
    $(“#image2”).show();
    });

    $(“#image2”).click(function(){
    $(“#text”).hide();
    $(“#gridtwo”).show();

    $(“#gridtwo”).slideUp();

    $(“#image2”).hide();
    $(“#image”).show();
    });

    });
    </script>

    <script language=”JavaScript1.2″>
    function popitup(url) {
    newwindow=window.open(url,’name’,’height=590,width=790,left=170,top=70,resizable=0,titlebar=0,toolbar=0,location=0,status=0,menubar=0,scrollbars=no’);
    if (window.focus) {newwindow.focus()}
    return false;
    }
    function deleteGroup() {
    var check = $(“#jqxgridtwo”).jqxGrid(‘selectedrowindexes’);
    if(check==”)
    {
    alert(‘Please select group(s) to delete’);
    return false;
    }
    var r=confirm(“Are you sure you want to delete the Group(s)?”);
    if (r==false)
    {
    return false;
    }
    var securityGroupId=document.getElementById(“securityGroupId”).value;

    jQuery.ajax({
    type : ‘GET’,
    data : jQuery(this).serialize(),
    url : ‘OpsSupportGroups?securityGroupId=’+securityGroupId,
    success : function(data, textStatus) {
    alert(“Entry deleted”);
    parent.location.reload(true);

    },
    error : function(XMLHttpRequest, textStatus, errorThrown) {
    }
    })

    }
    </script>

    </head>
    <body class=’default’>
    <form method=”get” name=”myForm1″ >

    <input type=”hidden” name=”securityGroupId” id=”securityGroupId” />

    <html>
    <head>
    <title>
    BEACON Entitlement System
    </title>

    <link href=”/BES/resources/css/ChevronStyle.css” rel=”stylesheet”>

    <style type=”text/css”>

    </style>

    </head>

    <body class=’default’>
    <form method=”get” name=”myForm1″ >

    <input type=”hidden” name=”securityGroupId” id=”securityGroupId” />
    <%
    if(session.getValue(“chevronFlag”).equals(“true”)){
    %>

    <jsp:include page=”/ChevronHeader”/>

    <%
    }
    else{
    %>
    <jsp:include page=”/Header”></jsp:include>

    <%}%>

    <div id=”main-panel-bes”>
    <div id=”left-panel-bes”>

    • <p style=”float:left;font-family: Segoe UI Light ;color:#5F5F5F; font-size:20pt;text-decoration: none;”>A</p>
    • a
    • b
    • </br></br>

    • d
    • </br>

    • e
    • f
    • g
    • </br></br>

    • h
    • </br>

    • i
    • </br>

    </div>
    <div id=”right-panel-bes”>
    <div id=”page-heading”>
    Page Heading

    <div id=”bread-crumb-path”>
    BEACON Entitlements   >>  Admin Tools   >>  Ops Support Groups
    </div>
    </div>

    <div id=”button-ops” style=”float:left;margin-left:72%;height:10%;width:35%”> <button id=”CreateNewEditDeleteButton” type=”button” onclick=”return popitup(‘CreateNew’)”>Create New</button>

    <button id=”CreateDeleteButton” type=”button” onclick=”return deleteGroup()”>Delete</button>

    </div>

    <div id=”headingCurrentOpsSupportGroup”><b>Current Ops Support Groups</b></div>

    <div>

    <div id=’jqxWidget’ style=”margin-left: 2%;”>

    <div id=”jqxgrid”></div>
    <br>
    <div id= “stripNormal” > </div>
    </div>

    <div id=”image”>
    “/></img>
    </div>

    <div id=”image2”>
    “/></img>
    </div>

    <div id=”panel”>
    <div id= “gridtwo”>
    <iframe src=”DetailsAndCriteria” id=”OpsDetailsAndCriteria” name=”mainTable” frameborder=”0″ height=”230″ width=”100%” style=”position: relative”></iframe>

    <div id =”jqxgridtwo”> </div>
    <iframe src=”AdmintoolsOps” id=”AdmintoolsOpsID” name=”mainTable” frameborder=”0″ height=”300″ width=”100%” top=”400″ style=”position:relative;”></iframe>
    </div>
    </div>
    </div>
    </div> </div>
    </form>
    <%
    if(session.getValue(“chevronFlag”).equals(“true”)){
    %>

    <jsp:include page=”/ChevronFooter”/>

    <%
    }
    else{
    %>

    <jsp:include page=”/Footer”/>

    <%}%>

    </body>
    </html>

    Grid not getting populated in IE8 #55130

    Peter Stoev
    Keymaster

    Hi Vardhman Jain,

    IE8 is more strict about Syntax errors. One of which is pagesize:5, in your code. Remove the “,”. There may be other as well so I suggest you to check it all and turn on some debugger.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com/

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.