Tags
People
Badges
Help-
CORE FRAMEWORK
FEATURED COMPONENTS
-
RESOURCES
-
LEARN ZK
RESOURCES
Hi,
i am facing problem with loading the grid component with large data. i am rendering the grid with data using a controller class wherein I am calling a service to populate the bean objects. these bean objects are then used in the zul page grid component to push the data to the grid. I am trying to load a grid with 30 rows of data with 25 columns and each column containing a vbox component. as the page is loaded the first 20 rows gets rendered correctly but when I scroll down to get the next 10 rows IE throws an error saying "A script on this page is causing Internet explorer to slow down...." and prompts me to stop the script. This happens even when script debugging is disabled on the browser.
This is my zul code
.zul file
<borderlayout id="centerLayout" visible="false" style="background-color: #ECF4FF;">
<west border="none" flex="false" autoscroll="true" style="background-color: #ECF4FF;">
<div id="gridDiv" style="background-color: #ECF4FF;">
<grid model="@{dataCtrl.model}" id="grid" height="400px" style="text-align:left;">
<auxhead>
<auxheader label="Date" align="center" />
<auxheader label="am" align="center" colspan="12" />
<auxheader label="pm" align="center" colspan="12" />
<auxheader label="Total" align="center" colspan="1" />
</auxhead>
<columns>
<column width="140px"/>
<column label="12" align="center" />
<column label="1" align="center" />
<column label="2" align="center" />
<column label="3" align="center" />
<column label="4" align="center" />
<column label="5" align="center" />
<column label="6" align="center" />
<column label="7" align="center" />
<column label="8" align="center" />
<column label="9" align="center" />
<column label="10" align="center" />
<column label="11" align="center" />
<column label="12" align="center" />
<column label="1" align="center" />
<column label="2" align="center" />
<column label="3" align="center" />
<column label="4" align="center" />
<column label="5" align="center" />
<column label="6" align="center" />
<column label="7" align="center" />
<column label="8" align="center" />
<column label="9" align="center" />
<column label="10" align="center" />
<column label="11" align="center" />
<column width="50px"/>
</columns>
<rows>
<row self="@{each='dataobj'}" style="text-align:left; font-size:10px">
<custom-attributes row_data="@{dataobj}" />
<hbox>
<label value="@{dataobj.date}" id="lblDate" style="@{dataobj.styleforCount}" />
<label value="," style="@{dataobj.styleforCount}" />
<label value="@{dataobj.day}" id="lblDay" style="@{dataobj.styleforCount}" />
</hbox>
<vbox>
<label value="@{dataobj.order1}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.SecOrder1}" style="@{dataobj.styleforValue}" />
</vbox>
<vbox>
<label value="@{dataobj.order2}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.SecOrder2}" style="@{dataobj.styleforValue}" />
</vbox>
<vbox>
<label value="@{dataobj.order3}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.SecOrder3}" style="@{dataobj.styleforValue}" />
</vbox>
<vbox>
<label value="@{dataobj.order4}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.SecOrder4}" style="@{dataobj.styleforValue}" />
</vbox>
<vbox>
<label value="@{dataobj.order5}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.SecOrder5}" style="@{dataobj.styleforValue}" />
</vbox>
<vbox>
<label value="@{dataobj.order6}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.SecOrder6}" style="@{dataobj.styleforValue}" />
</vbox>
<vbox>
<label value="@{dataobj.order7}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.SecOrder7}" style="@{dataobj.styleforValue}" />
</vbox>
<vbox>
<label value="@{dataobj.order8}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.SecOrder8}" style="@{dataobj.styleforValue}" />
</vbox>
<vbox>
<label value="@{dataobj.order9}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.SecOrder9}" style="@{dataobj.styleforValue}" />
</vbox>
<vbox>
<label value="@{dataobj.order10}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.SecOrder10}" style="@{dataobj.styleforValue}" />
</vbox>
<vbox>
<label value="@{dataobj.order11}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.SecOrder11}" style="@{dataobj.styleforValue}" />
</vbox>
<vbox>
<label value="@{dataobj.order12}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.SecOrder12}" style="@{dataobj.styleforValue}" />
</vbox>
<vbox>
<label value="@{dataobj.order13}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.SecOrder13}" style="@{dataobj.styleforValue}" />
</vbox>
<vbox>
<label value="@{dataobj.order14}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.SecOrder14}" style="@{dataobj.styleforValue}" />
</vbox>
<vbox>
<label value="@{dataobj.order15}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.SecOrder15}" style="@{dataobj.styleforValue}" />
</vbox>
<vbox>
<label value="@{dataobj.order16}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.SecOrder16}" style="@{dataobj.styleforValue}" />
</vbox>
<vbox>
<label value="@{dataobj.order17}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.SecOrder17}" style="@{dataobj.styleforValue}" />
</vbox>
<vbox>
<label value="@{dataobj.order18}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.SecOrder18}" style="@{dataobj.styleforValue}" />
</vbox>
<vbox>
<label value="@{dataobj.order19}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.SecOrder19}" style="@{dataobj.styleforValue}" />
</vbox>
<vbox>
<label value="@{dataobj.order20}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.SecOrder20}" style="@{dataobj.styleforValue}" />
</vbox>
<vbox>
<label value="@{dataobj.order21}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.SecOrder21}" style="@{dataobj.styleforValue}" />
</vbox>
<vbox>
<label value="@{dataobj.order22}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.SecOrder22}" style="@{dataobj.styleforValue}" />
</vbox>
<vbox>
<label value="@{dataobj.order23}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.SecOrder23}" style="@{dataobj.styleforValue}" />
</vbox>
<vbox>
<label value="@{dataobj.order24}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.SecOrder24}" style="@{dataobj.styleforValue}" />
</vbox>
<vbox>
<label value="@{dataobj.OrderCounttotal}" style="@{dataobj.styleforCount}" />
<label value="@{dataobj.OrderValueTotal}" style="@{dataobj.styleforValue}" />
</vbox>
</row>
</rows>
</grid>
<separator spacing="25px" />
<style>.fixalign{ width:200px; }</style>
<toolbarbutton style="float: right; font-weight: bold; font-size:12px;"
label="Export to CSV" id="exportBtn" sclass="fixalign" />
</div>
</west>
</borderlayout>
inputMap = (HashMap) dto_submit.getMap().get(Constants.OUTPUT);
try {
for (int i = 0; i < intCount; i++) {
dataobj = new OrderValueBean();
if (inputMap.containsKey(model.get(i).getDate())) {
arlst = (ArrayList) inputMap
.get(model.get(i).getDate());
for (int j = 0; j < arlst.size(); j = j + 2) {
Integer k = Integer.parseInt((String) arlst.get(j));
switch (k) {
case 0:
model.get(i).setOrder1(
(String) arlst.get(j + 1));
break;
case 1:
model.get(i).setOrder2(
(String) arlst.get(j + 1));
break;
case 2:
model.get(i).setOrder3(
(String) arlst.get(j + 1));
break;
case 3:
model.get(i).setOrder4(
(String) arlst.get(j + 1));
break;
case 4:
model.get(i).setOrder5(
(String) arlst.get(j + 1));
break;
case 5:
model.get(i).setOrder6(
(String) arlst.get(j + 1));
break;
case 6:
model.get(i).setOrder7(
(String) arlst.get(j + 1));
break;
case 7:
model.get(i).setOrder8(
(String) arlst.get(j + 1));
break;
case 8:
model.get(i).setOrder9(
(String) arlst.get(j + 1));
break;
case 9:
model.get(i).setOrder10(
(String) arlst.get(j + 1));
break;
case 10:
model.get(i).setOrder11(
(String) arlst.get(j + 1));
break;
case 11:
model.get(i).setOrder12(
(String) arlst.get(j + 1));
break;
case 12:
model.get(i).setOrder13(
(String) arlst.get(j + 1));
break;
case 13:
model.get(i).setOrder14(
(String) arlst.get(j + 1));
break;
case 14:
model.get(i).setOrder15(
(String) arlst.get(j + 1));
break;
case 15:
model.get(i).setOrder16(
(String) arlst.get(j + 1));
break;
case 16:
model.get(i).setOrder17(
(String) arlst.get(j + 1));
break;
case 17:
model.get(i).setOrder18(
(String) arlst.get(j + 1));
break;
case 18:
model.get(i).setOrder19(
(String) arlst.get(j + 1));
break;
case 19:
model.get(i).setOrder20(
(String) arlst.get(j + 1));
break;
case 20:
model.get(i).setOrder21(
(String) arlst.get(j + 1));
break;
case 21:
model.get(i).setOrder22(
(String) arlst.get(j + 1));
break;
case 22:
model.get(i).setOrder23(
(String) arlst.get(j + 1));
break;
case 23:
model.get(i).setOrder24(
(String) arlst.get(j + 1));
break;
}
}
}
int total= 0;
if (model.get(i).getOrder1().contains("--") | model.get(i).getOrder2().contains("--") | model.get(i).getOrder3().contains("--")
| model.get(i).getOrder4().contains("--") | model.get(i).getOrder5().contains("--")
| model.get(i).getOrder6().contains("--") | model.get(i).getOrder7().contains("--")
| model.get(i).getOrder8().contains("--") | model.get(i).getOrder9().contains("--")
| model.get(i).getOrder10().contains("--" )| model.get(i).getOrder11().contains("--")
| model.get(i).getOrder12().contains( "--") | model.get(i).getOrder13().contains("--")
| model.get(i).getOrder14().contains("--" )| model.get(i).getOrder15().contains("--")
| model.get(i).getOrder16().contains("--" )| model.get(i).getOrder17().contains("--")
| model.get(i).getOrder18().contains("--") | model.get(i).getOrder19().contains("--")
| model.get(i).getOrder20().contains("--") | model.get(i).getOrder21().contains("--")
| model.get(i).getOrder22().contains("--") | model.get(i).getOrder23().contains("--")
| model.get(i).getOrder24().contains("--")) {
String order1 = model.get(i).getOrder1().replace("--", "0");
String order2 = model.get(i).getOrder2().replace("--", "0");
String order3 = model.get(i).getOrder3().replace("--", "0");
String order4 = model.get(i).getOrder4().replace("--", "0");
String order5 = model.get(i).getOrder5().replace("--", "0");
String order6 = model.get(i).getOrder6().replace("--", "0");
String order7 = model.get(i).getOrder7().replace("--", "0");
String order8 = model.get(i).getOrder8().replace("--", "0");
String order9 = model.get(i).getOrder9().replace("--", "0");
String order10 = model.get(i).getOrder10().replace("--", "0");
String order11 = model.get(i).getOrder11().replace("--", "0");
String order12 = model.get(i).getOrder12().replace("--", "0");
String order13 = model.get(i).getOrder13().replace("--", "0");
String order14 = model.get(i).getOrder14().replace("--", "0");
String order15 = model.get(i).getOrder15().replace("--", "0");
String order16 = model.get(i).getOrder16().replace("--", "0");
String order17 = model.get(i).getOrder17().replace("--", "0");
String order18 = model.get(i).getOrder18().replace("--", "0");
String order19 = model.get(i).getOrder19().replace("--", "0");
String order20 = model.get(i).getOrder20().replace("--", "0");
String order21 = model.get(i).getOrder21().replace("--", "0");
String order22 = model.get(i).getOrder22().replace("--", "0");
String order23 = model.get(i).getOrder23().replace("--", "0");
String order24 = model.get(i).getOrder24().replace("--", "0");
total = new Integer(order1) + new Integer(order2)
+ new Integer(order3) + new Integer(order4)
+ new Integer(order5) + new Integer(order6)
+ new Integer(order7) + new Integer(order8)
+ new Integer(order9) + new Integer(order10)
+ new Integer(order11) + new Integer(order12)
+ new Integer(order13) + new Integer(order14)
+ new Integer(order15) + new Integer(order16)
+ new Integer(order17) + new Integer(order18)
+ new Integer(order19) + new Integer(order20)
+ new Integer(order21) + new Integer(order22)
+ new Integer(order23) + new Integer(order24);
System.out.println("do after compose SHR 9a");
}
else
{
total = new Integer(model.get(i).getOrder1())
+ new Integer(model.get(i).getOrder2())
+ new Integer(model.get(i).getOrder3())
+ new Integer(model.get(i).getOrder4())
+ new Integer(model.get(i).getOrder5())
+ new Integer(model.get(i).getOrder6())
+ new Integer(model.get(i).getOrder7())
+ new Integer(model.get(i).getOrder8())
+ new Integer(model.get(i).getOrder9())
+ new Integer(model.get(i).getOrder10())
+ new Integer(model.get(i).getOrder11())
+ new Integer(model.get(i).getOrder12())
+ new Integer(model.get(i).getOrder13())
+ new Integer(model.get(i).getOrder14())
+ new Integer(model.get(i).getOrder15())
+ new Integer(model.get(i).getOrder16())
+ new Integer(model.get(i).getOrder17())
+ new Integer(model.get(i).getOrder18())
+ new Integer(model.get(i).getOrder19())
+ new Integer(model.get(i).getOrder20())
+ new Integer(model.get(i).getOrder21())
+ new Integer(model.get(i).getOrder22())
+ new Integer(model.get(i).getOrder23())
+ new Integer(model.get(i).getOrder24());
System.out.println("do after compose SHR 9b");
}
model.get(i).setOrderCounttotal(Integer.toString(total));
}
}
catch (Exception e) {
System.out.println("do after compose SHR 11"+e.getMessage());
log.error(e);
}
GetOrderValue();
centerLayout.setVisible(true);
Asked: 2011-05-06 06:30:37 +0800
Seen: 190 times
Last updated: May 10 '11
