How to reload data in ZK PivotTable with new values when combobox onchange event trigger

Question

I need to reload data in ZK pivot table when ombobox onchange event trigger.

If user change the value from the comobox { as shown in below code } data should change based on user selection.

index.zul

<window apply="org.zkoss.pivot.demo.PivotDemoBaseController"  >
    <hlayout>
        <panel id="main" hflex="1" border="normal">
            <caption label="2012 Data">
                <toolbarbutton id="exportCsvBtn" label="Export CSV"  />
                <toolbarbutton id="exportXlsBtn" label="Export XLS" />
                <toolbarbutton id="exportXlsxBtn" label="Export XLSX" />
            </caption>
            <panelchildren>
                <vlayout spacing="0">
                    <pivottable id="pivot" hflex="1" pageSize="15"  >





                        <combobox model="${lm}"  id="selectGeo"/>
                        <div>All People</div>
                    </pivottable>
                    <div id="descDiv" />
                </vlayout>
            </panelchildren>
        </panel>
        <panel id="field" title="Control" width="300px" border="normal"  >
            <panelchildren>
                <vlayout style="padding: 10px">
                    <!-- Predefined scenario: -->
                    <hlayout id="preDef" spacing="0"  />
                    <div class="footnote" style="padding: 5px 0">(Drag fields among the areas below)</div>
                    <pivot-field-control id="pfc" height="300px" />
                    <hlayout hflex="1">
                        <checkbox id="autoUpdate" label="Auto Update" checked="true" />
                        <div hflex="1" />
                        <!-- <button id="updateBtn" label="Update" disabled="true" autodisable="+self" /> -->
                    </hlayout>
                    <separator />
                    <checkbox id="colGrandTotal" label="Enable grand total for columns" />
                    <checkbox id="rowGrandTotal" label="Enable grand total for rows" />
                    <div>
                        <radiogroup id="dataOrient">
                            Data field orientation:
                            <radio id="colOrient" label="column" />
                            <radio id="rowOrient" label="row" />
                        </radiogroup>
                    </div>
                </vlayout>
            </panelchildren>
        </panel>
    </hlayout>
</window>

Below is the code of my Controller

public class PivotDemoBaseController extends SelectorComposer {

private static final long serialVersionUID = -7531153593366258488L;

private static final String[] TITLES = new String[] { "(Data Title)", "(Column Title)", "(Row Title)" };


@Wire
private Pivottable pivot;

@Wire
private PivotFieldControl pfc;

@Wire
private Button updateBtn;

@Wire
private Checkbox colGrandTotal, rowGrandTotal;

@Wire
private Radio colOrient, rowOrient;

@Wire
private Hlayout preDef;

@Wire
private Div descDiv;

private TabularPivotModel _model;

@Wire
private Combobox selectGeo;




private CellStyleConfigurator styleConfigurator;

public void onCheck$autoUpdate(CheckEvent event) {
    boolean deferred = !event.isChecked();
    pfc.setDeferredUpdate(deferred);
    if (!deferred)
        updateBtn.setDisabled(true);
}


@Listen("onChange = #selectGeo")
public void onChangeSelectGeo(Event event) {        
     String geography = selectGeo.getValue();
   System.out.println("Value---"+geography);

}

public void onClick$updateBtn() {
    pfc.update();
}

public void onPivotFieldControlChange$pfc() {
    if (!pfc.isUpdated())
        updateBtn.setDisabled(false);
}

public void onCheck$colGrandTotal(CheckEvent event) {
    System.out.println("PivotDemoBaseController.onCheck$colGrandTotal()");
    pivot.setGrandTotalForColumns(event.isChecked());
}

public void onCheck$rowGrandTotal(CheckEvent event) {
    pivot.setGrandTotalForRows(event.isChecked());
}

public void onCheck$dataOrient(CheckEvent event) {
    pivot.setDataFieldOrient(((Radio)event.getTarget()).getLabel());
}

public void onClick$exportCsvBtn() throws IOException {
    ByteArrayOutputStream out = new ByteArrayOutputStream();
    PivotExportContext context = Exports.getExportContext(pivot, true, TITLES);
    Exports.exportCSV(out, context);
    Filedownload.save(out.toByteArray(), "text/csv", "pivot.csv");
    try {
        out.close();
    } catch (IOException e) {}
}

public void onClick$exportXlsBtn() throws IOException {
    ByteArrayOutputStream out = new ByteArrayOutputStream();
    PivotExportContext context = Exports.getExportContext(pivot, true, TITLES);
    Exports.exportExcel(out, "xls", context, styleConfigurator);
    Filedownload.save(out.toByteArray(), "application/vnd.ms-excel", "pivot.xls");
    try {
        out.close();
    } catch (IOException e) {}
}

public void onClick$exportXlsxBtn() throws IOException {
    ByteArrayOutputStream out = new ByteArrayOutputStream();
    PivotExportContext context = Exports.getExportContext(pivot, true, TITLES);
    Exports.exportExcel(out, "xlsx", context, styleConfigurator);
    Filedownload.save(out.toByteArray(), "application/vnd.ms-excel", "pivot.xlsx");
    try {
        out.close();
    } catch (IOException e) {}
}

@NotifyChange("*")
@Override
public void doAfterCompose(Component comp) throws Exception {
    System.out.println("PivotDemoBaseController.doAfterCompose()");
    super.doAfterCompose(comp);
    StaticPivotModelFactory pmf = StaticPivotModelFactory.INSTANCE;

    //PivotModelFactory pmf= (PivotModelFactory) arg.get("factory");
    _model = pmf.build();
    pivot.setModel(_model);
    pfc.setModel(_model);
    Executions.createComponents(pmf.getDescriptionURI(), descDiv, null);

    loadConfiguration(pmf.getDefaultConfigurator());

    // load predefined scenario
    for(PivotConfigurator conf : pmf.getConfigurators())
        preDef.appendChild(getPreDefDiv(conf));
}

private void initControls() {
    System.out.println("PivotDemoBaseController.initControls()");
    // grand totals
    colGrandTotal.setChecked(pivot.isGrandTotalForColumns());
    rowGrandTotal.setChecked(pivot.isGrandTotalForRows());

    // data orientation
    ("column".equals(pivot.getDataFieldOrient()) ? 
            colOrient : rowOrient).setChecked(true);

    pfc.syncModel(); // field control
}

private Component getPreDefDiv(final PivotConfigurator conf) {
    Div div = new Div();
    div.setHflex("1");
    div.setSclass("predef");
    div.appendChild(new Label(conf.getTitle()));
    div.addEventListener("onClick", new EventListener(){
        public void onEvent(Event event) throws Exception {
            loadConfiguration(conf);
        }
    });
    return div;
}

private void loadConfiguration(PivotConfigurator conf) {
    System.out.println("PivotDemoBaseController.loadConfiguration()");
    _model.clearAllFields(true);
    conf.configure(_model);
    conf.configure(pivot);
    pivot.setPivotRenderer(conf.getRenderer());
    styleConfigurator = conf.getCellStyleConfigurator();
    initControls();
}

}

Any Help would be much appreciated.

Answer 1

I think you mean the @NotifyChange annotation, but it is for MVVM data-binding, which you did not use.
You can switch to the MVVM data binding or you schould update it like this:

@Listen("onChange = #selectGeo")
public void onChangeSelectGeo(CheckEvent event) {
    // Manipulate pivot element here.
}

For more info, see CheckEvent and MVVM vs MVC.