This topic contains 18 replies, has 2 voices, and was last updated by nico86 9 years, 6 months ago.
-
Hi
I think there is a compatibilty probleme with jqxgrid (dropdownlist ?) and internet explorer 8 .
This problem also exists in your demos. For exemple cell cellediting.htmThanks
Hi,
Sometimes, when i navigate into my large grid, I have a new problem with IE 8 (with IE8 borwser mode and IE document mode)
Some columns are not displayed and i have a javascript problem (see screen below)Does parentNode use into jqxgrid is compatible with IE8 ?
thanks
Nicolas.
Hi,
I need to make one example.I have used your demo file cellediting.html, and i just add four columns (a,b,c,d,e)
when I scroll to the right, missing columns (availaible , quantity , price , date)
then when i scroll to left the colums a, b, c, d, e have become blank.
Thanks.
<!DOCTYPE html> <html lang="en"> <head> <title id='Description'>In order to enter in edit mode, select a grid cell and start typing, "Click" or press the "F2" key. You can also navigate through the cells using the keyboard arrows or with the "Tab" and "Shift + Tab" key combinations. To cancel the cell editing, press the "Esc" key. To save the changes press the "Enter" key or select another Grid cell. Pressing the 'Space' key when a checkbox cell is selected will toggle the check state.</title> <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" /> <script type="text/javascript" src="../../scripts/jquery-1.11.1.min.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxdata.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxscrollbar.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxmenu.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxgrid.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxgrid.edit.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxgrid.selection.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxlistbox.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxdropdownlist.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxcheckbox.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxcalendar.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxnumberinput.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxdatetimeinput.js"></script> <script type="text/javascript" src="../../jqwidgets/globalization/globalize.js"></script> <script type="text/javascript" src="../../scripts/demos.js"></script> <script type="text/javascript" src="generatedata.js"></script> <script type="text/javascript"> $(document).ready(function () { // prepare the data var data = generatedata(200); var source = { localdata: data, datatype: "array", updaterow: function (rowid, rowdata, commit) { // synchronize with the server - send update command // call commit with parameter true if the synchronization with the server is successful // and with parameter false if the synchronization failder. commit(true); }, datafields: [ { name: 'a', type: 'string' }, { name: 'b', type: 'string' }, { name: 'c', type: 'string' }, { name: 'd', type: 'string' }, { name: 'e', type: 'string' }, { name: 'firstname', type: 'string' }, { name: 'lastname', type: 'string' }, { name: 'productname', type: 'string' }, { name: 'available', type: 'bool' }, { name: 'quantity', type: 'number' }, { name: 'price', type: 'number' }, { name: 'date', type: 'date' } ] }; var dataAdapter = new $.jqx.dataAdapter(source); // initialize jqxGrid $("#jqxgrid").jqxGrid( { width: 850, source: dataAdapter, editable: true, enabletooltips: true, selectionmode: 'multiplecellsadvanced', columns: [ { text: 'a', columntype: 'textbox', datafield: 'a', width: 120 }, { text: 'b', columntype: 'textbox', datafield: 'b', width: 120 }, { text: 'c', columntype: 'textbox', datafield: 'c', width: 120 }, { text: 'd', columntype: 'textbox', datafield: 'd', width: 120 }, { text: 'e', columntype: 'textbox', datafield: 'e', width: 120 }, { text: 'First Name', columntype: 'textbox', datafield: 'firstname', width: 120 }, { text: 'Last Name', datafield: 'lastname', columntype: 'textbox', width: 120 }, { text: 'Product', columntype: 'dropdownlist', datafield: 'productname', width: 195 }, { text: 'Available', datafield: 'available', columntype: 'checkbox', width: 67 }, { text: 'Ship Date', datafield: 'date', columntype: 'datetimeinput', width: 110, align: 'right', cellsalign: 'right', cellsformat: 'd', validation: function (cell, value) { if (value == "") return true; var year = value.getFullYear(); if (year >= 2015) { return { result: false, message: "Ship Date should be before 1/1/2015" }; } return true; } }, { text: 'Quantity', datafield: 'quantity', width: 70, align: 'right', cellsalign: 'right', columntype: 'numberinput', validation: function (cell, value) { if (value < 0 || value > 150) { return { result: false, message: "Quantity should be in the 0-150 interval" }; } return true; }, createeditor: function (row, cellvalue, editor) { editor.jqxNumberInput({ decimalDigits: 0, digits: 3 }); } }, { text: 'Price', datafield: 'price', align: 'right', cellsalign: 'right', cellsformat: 'c2', columntype: 'numberinput', validation: function (cell, value) { if (value < 0 || value > 15) { return { result: false, message: "Price should be in the 0-15 interval" }; } return true; }, createeditor: function (row, cellvalue, editor) { editor.jqxNumberInput({ digits: 3 }); } } ] }); // events $("#jqxgrid").on('cellbeginedit', function (event) { var args = event.args; $("#cellbegineditevent").text("Event Type: cellbeginedit, Column: " + args.datafield + ", Row: " + (1 + args.rowindex) + ", Value: " + args.value); }); $("#jqxgrid").on('cellendedit', function (event) { var args = event.args; $("#cellendeditevent").text("Event Type: cellendedit, Column: " + args.datafield + ", Row: " + (1 + args.rowindex) + ", Value: " + args.value); }); }); </script> </head> <body class='default'> <div id='jqxWidget'> <div id="jqxgrid"></div> <div style="font-size: 12px; font-family: Verdana, Geneva, 'DejaVu Sans', sans-serif; margin-top: 30px;"> <div id="cellbegineditevent"></div> <div style="margin-top: 10px;" id="cellendeditevent"></div> </div> </div> </body> </html>
You must be logged in to reply to this topic.