Hi,
We're using igGrid populating with jQuery JSON on our web application, which is working fine with IE10 and Firefox. But we come across a problem with IE8 issue, when double clicking on the grid on an existing record (edit mode) the "Done" & "Cancel" command popup does not appear allowing the user to save the changes. Eventually by tabbing through the fields if you scroll down or across the screen beyond visible area the command buttons can be seen. Eventually a warning message is displaying that a script running will cause IE to run slowly and do you want to stop it (image attached).
Select yes and error message closes. Changes to record was saved. Please note, this issue relates to IE8, but works fine in IE9 and compatibility view.
Regards,
Jasdeep
Hello ecatenate,
Do not hesitate to contact me if you have any additional questions concerning this matter.
Thank you for your code snippets. I have been looking into them and everything seems fine. Would you try to upgrade to our latest available scripts(12.2.20122.2086) which may fixed this issues. You can download this service release from the following link:
https://ko.infragistics.com/my-account/keys-and-downloads/
just click over your product key and go to the tab “Service releases”.
If the issue still persist please let me know.
Now using latest Ingragistics.js and loader js files.
We are receiving a message to supply a primary key and then when this as been done we get message
'Microsoft JScript runtime error: The record with the specified id could not be found in the data view: 0'
The js version is 12.2.20122.2056 - the grid worked OK in IE9 with version 12.2.20122.1021
Could you advise - grid code below.
Thanks in Advance.
function getUnitSurchargesList(UnitRef) {
URL ="/WebServices/Units.svc/GetUnitSurchargesList?strUnitRef=" + UnitRef;
$.ig.loader(
function() {
$(
"#GridTable").igGrid({
columns: [
{ headerText:"SurchargeID", key: "SurchargeID", width: "200px", dataType: "number" , hidden: true},
{ headerText:"Material Ref", key: "MaterialRef", width: "200px", dataType: "string" },
{ headerText:"Current Price", key: "CurrentPrice", width: "200px", dataType: "string" },
{ headerText:"Future Price", key: "FuturePrice", width: "100px", dataType: "string" },
{ headerText:"Effective Date", key: "EffectiveDate", width: "100px", dataType: "string" },
{ headerText:"Inactive", key: "Inactive", width: "50px", dataType: "bool", format: "checkbox" }
],
width:"850px",
autoGenerateColumns:false,
dataSource: URL,
responseDataKey:"Records",
responseDataType:"json",
responseTotalRecCountKey:"servertotalcount",
renderCheckboxes:true,
rowsRendered:rowsRendered,
primaryKey:"SurchargeID",
features: [{
name:"Selection',
rowSelectionChanging: rowSelectionChanged_handler
},
{
name:'Paging',
type:'local',
pageSize: 5,
recordCountKey:"servertotalcount",
pageSizeUrlKey:"pageSize",
pageIndexUrlKey:"page",
pageSizeChanging:function(evt, ui) { page = 0;
filterExpr ="";
groupExpr ="";
sortColumn ="";
}
name:'Sorting',
firstSortDirection:'descending',
columnSorting: columnSorting_handler
name:"Filtering",
allowFiltering:true,
caseSensitive:false,
type:"local",
mode:"advanced",
dataFiltering: dataFiltering_handler
name:"Selection"
name:"Updating",
startEditTriggers:"dblclick",
editMode: editmode,
enableAddRow: editAccess,
editCellStarted:function(evt, ui) {
switch (ui.columnKey) {
case 'MaterialRef':
if (ui.rowAdding){
ui.editor.igEditor('option', 'readOnly', false);
ui.editor.igEditor('option', 'value', '');
ui.editor.show();
else{
ui.editor.hide();
ui.editor.igEditor('option', 'readOnly', true);
break;
default:
enableDeleteRow: editAccess,
enableDataDirtyException:false,
editRowEnding: editRowEndingSurcharge,
rowDeleting: deletingRowSurcharge,
columnSettings: [{
columnKey:"MaterialRef",
editorOptions:
maxLength: 10,
columnKey:"Inactive",
disabled:true
columnKey:"EffectiveDate",
editorType:"datepicker",
required:false,
validatorOptions:
required:false
columnKey:"CurrentPrice",
editorType:"numeric",
validation:true,
editorOptions: { maxLength: 10, decimalSeparator:"." }
columnKey:"FuturePrice",
editorType:"combo",
mode:"dropdown",
dropDownWidth:"300px",
dataSource: MaterialRefJSON,
dataSourceType:"json",
textKey:"Name",
valueKey:"Value",
readOnly:true,
required:true,
required:true
}]
]
});
Hi Elena,
Thanks for your reply.
We managed to fix the first problem by assigning igGrid width but the other problem still there. When trying to save, it shows attached image error message and which is Out of stack space error of igGrid when perform databind in IE8.
We're using 12.2.20122.1021 version and style and script references are already in advised order.
Hello Jasdeep,
I have been looking into your issue and I am not able to reproduce the issue that you mentioned in our samples browser:
http://ko.infragistics.com/products/jquery/sample/grid/editing
Would you provide me with more information about the version of jQuery, jQueryUI and our control that you use? Also would you please try to reference the Infragistics styles before the Infragistics scripts and confirm if the issue is still reproducible:
<link href="css/themes/infragistics/infragistics.theme.css" rel="stylesheet" type="text/css" />
<link href="css/structure/infragistics.css" rel="stylesheet" type="text/css" />
<script src=https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js type="text/javascript"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/jquery-ui.min.js" type="text/javascript"></script>
<script src="js/infragistics.js" type="text/javascript"></script>
If it is possible could you attach the code that you use when you reproduce the issue.
Thanks in advance.