0

ZK MVVM Listbox Mold Paging - select first record on each page [closed]

asked 2013-06-12 04:39:35 +0800

Senthilchettyin gravatar image Senthilchettyin flag of India
2623 3 8
http://emrpms.blogspot.in...

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.

delete flag offensive retag edit

The question has been closed for the following reason "the question is answered, right answer was accepted" by Senthilchettyin
close date 2013-06-17 15:05:49

4 Answers

Sort by ยป oldest newest most voted
1

answered 2013-06-12 14:17:10 +0800

sjoshi gravatar image sjoshi flag of India
3493 1 8
http://zkframeworkhint.bl...

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.

link publish delete flag offensive edit

Comments

Thank you joshi. But it is pure MVVM. I am binding model to the collection

Senthilchettyin ( 2013-06-13 07:13:31 +0800 )edit

Can you please share your code i did not get your comment

sjoshi ( 2013-06-13 07:30:54 +0800 )edit
1

answered 2013-06-13 08:15:33 +0800

Senthilchettyin gravatar image Senthilchettyin flag of India
2623 3 8
http://emrpms.blogspot.in...
<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");

    }

}
link publish delete flag offensive edit

Comments

oK IT MEAN IN PAGINATION YOU ARE NOT DOING ANY ACTION YOU JUST SHOW NEXT PAGE?

sjoshi ( 2013-06-13 11:20:14 +0800 )edit

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 )edit

My Solution will be only work when you are doing Lazy loading from DB Side.

sjoshi ( 2013-06-13 13:58:40 +0800 )edit

Oh. 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 )edit

From my understanding then firstly we can check "pagination with hibernate" example in google it will give us more control over application ,We can easily do Pagination with the help of hibernate as i suppose you are using hibernate

sjoshi ( 2013-06-13 17:09:25 +0800 )edit
0

answered 2013-06-17 10:14:45 +0800

benbai gravatar image benbai
2228 6
http://www.zkoss.org

You 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));
}
link publish delete flag offensive edit

Comments

Thanks @Ben

sjoshi ( 2013-06-17 10:21:56 +0800 )edit

What and where _model comes from ?

Senthilchettyin ( 2013-06-17 14:50:30 +0800 )edit

_model is the model used by listbox

benbai ( 2013-06-17 23:52:27 +0800 )edit
0

answered 2013-06-17 15:02:53 +0800

Senthilchettyin gravatar image Senthilchettyin flag of India
2623 3 8
http://emrpms.blogspot.in...

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));
}
link publish delete flag offensive edit

Question tools

Follow
1 follower

RSS

Stats

Asked: 2013-06-12 04:39:35 +0800

Seen: 173 times

Last updated: Jun 17 '13

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More