jQWidgets Forums
This topic contains 9 replies, has 2 voices, and was last updated by Peter Stoev 12 years, 7 months ago.
Viewing 10 posts - 1 through 10 (of 10 total)
-
Hi Frogomat,
I am still unable to reproduce the reported issue. Below is an image from my test with Internet Explorer and expecially Internet Explorer 8.
Below is my code which is based on your code, but uses sample data because there wasn’t any in your posting.
<!DOCTYPE html><html lang="en"><head> <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" /> <script type="text/javascript" src="../../scripts/gettheme.js"></script> <script type="text/javascript" src="../../scripts/jquery-1.8.2.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="../../qwidgets/jqxmenu.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxgrid.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxgrid.selection.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxtabs.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxgrid.pager.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/jqxgrid.sort.js"></script> <script type="text/javascript"> $(document).ready(function () { var initSendungsTab = function (id) { var data = new Array(); for (var i = 0; i < 200; i++) { var row = {}; row["gewicht"] = "Item 1"; row["amUm"] = "Item 1"; row["nr"] = "Item 1"; row["statusBezeichung"] = "Item 1"; data[i] = row; } var source = { localdata: data, datatype: "array" }; var dataAdapter = new $.jqx.dataAdapter(source); // Wenn ein bestimmter Status var crlieferscheinLink = function (row, columnfield, value, defaulthtml, columnproperties) { if (value != ' ' ) { return '<span style="margin: 4px; float: ' + columnproperties.cellsalign + '; color: #0000ff;">' + value + '</span>'; } else { return '<span style="margin: 4px; float: ' + columnproperties.cellsalign + '; color: #008000;">' + value + '</span>'; } } $("#sendung_"+id).jqxGrid( { width: 600, height: 560, pagesizeoptions: ['5', '10', '20'], autoheight: true, sortable: true, source: dataAdapter, columns: [ { text: 'SendungsId', datafield: 'nr', width: 100, cellsrenderer: crlieferscheinLink }, { text: 'Gewicht[kg]', datafield: 'gewicht', width: 100 }, { text: 'Datum/Uhrzeit', datafield: 'amUm', width: 160 }, { text: 'Status', datafield: 'statusBezeichung', width: 100 } ] }); } var initStatusHistorieTab = function (id) { var dataAdapter = getDataAdapterStatus(id); $(("#statusHistorie_"+id)).jqxGrid( { width: 600, height: 560, source: dataAdapter, theme: theme, // pageable: true, pagesizeoptions: ['5', '10', '20'], autoheight: true, sortable: true, columns: [ { text: 'Code', datafield: 'statusCode', width: 100 }, { text: 'Bezeichung', datafield: 'statusText', width: 100 }, { text: 'Datum/Uhrzeit', datafield: 'statusGueltigAbAmUm', width: 160 } ] }); } var initAuftragsRowDetails = function (index, parentElement, gridElement, record) { var id = "";//record.uid.toString(); var grid = $($(parentElement).children()[0]); tmpRecord = record; grid.append($("<div id='sendung_"+record['id']+"' ></div>")); grid.append($("<div id='statusHistorie_"+record['id']+"' ></div>")); grid.jqxTabs({autoHeight: true }); grid.jqxTabs({initTabContent: function (tab) { switch (tab) { case 0: initSendungsTab(record['id']); break; case 1: initStatusHistorieTab(record['id']); break; } }}); } var data = new Array(); for (var i = 0; i < 200; i++) { var row = {}; row["ldref"] = "Item 1"; row["empfaengerNr"] = "Item 1"; row["empfaengerRef"] = "Item 1"; row["kundenRef"] = "Item 1"; row["tdl"] = "Item 1"; row["strasse"] = "Item 1"; row["plz"] = "Item 1"; row["ort"] = "Item 1"; row["landCode"] = "Item 1"; row["gewicht"] = "Item 1"; row["anzahlSendungen"] = "Item 1"; data[i] = row; } var source = { localdata: data, datatype: "array" }; var dataAdapterAuftraege = new $.jqx.dataAdapter(source); $("#jqxgrid").jqxGrid( { width: 1180, height: 200, source: dataAdapterAuftraege, pageable: true, pagesizeoptions: ['10', '25', '50', '100'], pagesize: 25, autoheight: true, sortable: true, rowdetails: true, rowdetailstemplate: { rowdetails: "<div style='margin: 10px;'><ul style='margin-left: 30px;'><li>Sendungen</li><li>Statushistorie</li></ul></div>" ,autoheight: true}, initrowdetails: initAuftragsRowDetails, columns: [ { text: 'LD-Ref.', datafield: 'ldref', width: 100 }, { text: 'BT-KD.NR.', datafield: 'empfaengerNr', width: 100 }, { text: 'BT-Ref.', datafield: 'empfaengerRef', width: 100 }, { text: 'BT-Kd.-Ref', datafield: 'kundenRef', width: 200 }, { text: 'TDL', datafield: 'tdl', width: 100 }, { text: 'Strasse', datafield: 'strasse', width: 150 }, { text: 'PLZ', datafield: 'plz', width: 50 }, { text: 'Ort', datafield: 'ort', width: 100 }, { text: 'LandCode', datafield: 'landCode', width: 100 }, { text: 'Gewicht[kg]', datafield: 'gewicht', width: 50 }, { text: 'Sendungen', datafield: 'anzahlSendungen', width: 100 }] }); }); </script></head> <body> <div id='jqxWidget' style="font-size: 13px; font-family: Verdana; float: left;"> <div id="jqxgrid"> </div> </div> </body></html>
Best Regards,
Peter SToevjQWidgets Team
http://www.jqwidgets.com
Viewing 10 posts - 1 through 10 (of 10 total)
You must be logged in to reply to this topic.