Thank you joshi. But it is pure MVVM. I am binding model to the collection
Senthilchettyin ( 2013-06-13 07:13:31 +0800 )edit-
FEATURED COMPONENTS
First time here? Check out the FAQ!
Hi
I am using ZK MVVM Listbox with template to load display the records with auto pagination mold ="paging". I just want to make the select the first record when the user click next page.
I am not sure but you can check this code
private ListModelList dataList;
dataList.addToSelection(dataList.get(0));
Every pagination link you can call the above code and set the first item into the selection.
Thank you joshi. But it is pure MVVM. I am binding model to the collection
Senthilchettyin ( 2013-06-13 07:13:31 +0800 )edit<zk>
<window id="applicationloglist" border="none"
apply="org.zkoss.bind.BindComposer"
viewModel="@id('vm') @init('com.product.webapp.practice.ApplicationLogListVM')">
<separator />
<screenheader lcaption="Application Log"></screenheader>
<panel width="95%" sclass="sectionpadding">
<panelchildren>
<vgrid>
<columns>
<column width="25%"></column>
<column width="25%"></column>
<column width="30%"></column>
<column width="10%"></column>
<column width="10%"></column>
</columns>
<rows>
<row>
<vlayout>
<flabel value="Practice" />
<combobox model="@load(vm.allPractice)"
hflex="1" mold="rounded" cols="30" readonly="true"
name="allpractice" id="allpractice"
onSelect="@command('onSelectPractice')"
onChange="@command('onSelectPractice')"
selectedItem="@bind(vm.selectedPractice) @save(vm.selectedPractice, before='onSelectPractice')"
disabled="@load(vm.makeAsReadOnly)">
<template name="model" var="p">
<comboitem value="@bind(p.ID)"
label="@load(empty p.code ? 'All Practice' : p.code)"
sclass="@load(p.active eq 0 ?'inactiveRecord':'')"
description="@bind(p.name)" />
</template>
</combobox>
</vlayout>
<vlayout>
<hlayout>
<flabel value="User" />
</hlayout>
<combobox model="@load(vm.userList)"
hflex="1" mold="rounded" cols="30" readonly="true" name="users"
id="users" selectedItem="@bind(vm.selectedUser)">
<template name="model" var="p">
<comboitem value="@bind(p.ID)"
label="@load(empty p.userName ? 'All Users' : p.userName)"
sclass="@load(p.active eq 0 ?'inactiveRecord':'')" />
</template>
</combobox>
</vlayout>
<vlayout>
<hlayout>
<flabel value="Event Date Range" />
</hlayout>
<hbox hflex="1">
<datebox id="fromdate" hflex="1"
value="@bind(vm.startDate)" format="long" mold="rounded" />
<datebox id="todate" hflex="1"
value="@bind(vm.endDate)" format="long" mold="rounded" />
</hbox>
</vlayout>
<vlayout>
<hlayout>
<flabel value="Type" />
</hlayout>
<EnumDrpDown labelFormat="1"
showDesc="false" width="98%" dropDownType="2" id="txttype"
EnumType="LogType" value="@bind(vm.logType)" />
</vlayout>
<vlayout>
<hlayout>
<space></space>
</hlayout>
<fbutton label="Search" id="search"
onClick="@command('onSearch')">
</fbutton>
</vlayout>
</row>
</rows>
</vgrid>
<separator />
<separator />
<listbox id="applog" mold="paging" sclass="mylist"
emptyMessage="No log found in the result" pageSize="4"
selectedItem="@bind(vm.selectedItem)" model="@load(vm.appLogList)"
pagingPosition="top" onPaging="@command('onPaging')">
<listhead>
<listheader label="Created Date " width="120px"
sort="auto(createdDate)" />
<listheader label="Type" width="80px"
sort="auto(levelString)" />
<listheader label="Logger Name" width="300px"
sort="auto(loggerName)" />
<listheader label="File" width="260px"
sort="auto(callerFileName)" />
<listheader label="Class" width="310px"
sort="auto(callerClass)" />
<listheader label="Method" width="210px"
sort="auto(callerMethod)" />
</listhead>
<template name="model" var="p1">
<listitem>
<listcell label="@load(p1.createdDate)" />
<listcell label="@load(p1.levelString)" />
<listcell label="@load(p1.loggerName)" />
<listcell label="@load(p1.callerFileName)" />
<listcell label="@load(p1.callerClass)" />
<listcell label="@load(p1.callerMethod)" />
</listitem>
</template>
</listbox>
<separator />
<groupbox mold="3d" closable="false"
visible="@load(not empty vm.selectedItem)"
sclass="grpboxSectionBar">
<caption label="Detailed Message" />
<ftextbox id="message" name="message" rows="8"
mold="rounded" width="99.5%"
value="@bind(vm.selectedItem.message)" multiline="true"
readonly="true" />
</groupbox>
</panelchildren>
</panel>
</window>
</zk>
@Command
@NotifyChange({ "appLogList", "selectedItem" })
public void onSearch() {
String logType = null;
String startDate =null;
String endDate = null;
SimpleDateFormat sdf = new SimpleDateFormat("MM/dd/yyyy");
if (this.startDate == null)
startDate = null;
else
startDate= sdf.format(this.startDate);
if (this.endDate == null)
endDate = null;
else
endDate= sdf.format(this.endDate);
if (StringUtils.isNotEmpty(getLogType())
&& getLogType().equalsIgnoreCase("All"))
logType = null;
else
logType = StringUtils.upperCase(getLogType());
try {
appLogList = AuthService.getApplicationLog(logType,startDate,endDate);
if (appLogList.size() > 0)
setSelectedItem(appLogList.get(0));
else
setSelectedItem(null);
} catch (Exception e) {
ExceptionHandler.handleException(e, "Application Log ", null,
this.moreErrorInfo + ": onSearch");
}
}
Yes. when click on the search button, on the first page, i am able to select the first record. But when the user click on next page button, now i want to select the first record
Senthilchettyin ( 2013-06-13 11:37:14 +0800 )editOh. i am not loading page by page. It fetches all the result and just ZK handling with mold ="paging". Actually i want to implement to fetch from the DB by each page. But i do not find any example. http://forum.zkoss.org/question/87362/mvvm-listbox-load-huge-amount-of-data-page-by-page/
Senthilchettyin ( 2013-06-13 16:02:18 +0800 )editYou can calculate the index of first item then add it into selection,
e.g.,
@Command
public void onPaging (@ContextParam(ContextType.TRIGGER_EVENT) PagingEvent event) {
int activePage = event.getActivePage();
int first = activePage * _pageSize;
((Selectable)_model).addToSelection(_model.get(first));
}
Thanks benbai and joshi. As per my example, the below code works to achieve the result
@Command
@NotifyChange("selectedItem")
public void onPaging(@ContextParam(ContextType.TRIGGER_EVENT) PagingEvent event)
{
int activePage = event.getActivePage();
int first = activePage * 4;
setSelectedItem(appLogList.get(first));
}
Asked: 2013-06-12 04:39:35 +0800
Seen: 173 times
Last updated: Jun 17 '13