ZEN tablePane always selects the bottom row. Why?
I have a tablePane that always displays with the bottom row selected. The SQL is executed when the submit/search button is clicked. See attached.
Does anyone know how to enable row selection but prevent the bottom row being selected after the button onClick event?
<tablePane id="workBioTable" maxRows="1000" pageSize="6" width="1000px" showRowNumbers="false" showZebra="true" useSnapshot="true" extraColumnWidth="5%" initialExecute="false" sql="SELECT workbio.RequestDate, workbio.SpecId, workbio.Worksheet, %SQLUPPER(wsfbio.ProfileDescription) As ProfileDescription, workbio.NhsNo, workbio.HospNo, workbio.AENUM, workbio.Surname, workbio.Forename, workbio.Sex, workbio.Dob, workbio.BloodGroup, workbio.Site from LabsApp_Data.WorkBio As workbio, LabsApp_Data.WsfBio As wsfbio where workbio.RequestDate >= ? and workbio.RequestDate <= ? and workbio.Worksheet = wsfbio.Profile order by workbio.RequestDate ASC" onselectrow="zenPage.onSelectRow(which);" valueColumn="ID"> <parameter id="p1"/> <parameter id="p2"/> <column colName="ID" hidden="true" width="5%"/> <column header="Request Date" width="20%" colName="RequestDate"/> <column header="Lab Number" width="20%" colName="SpecId"/> <column header="Profile" width="9%" colName="Worksheet" hidden="true"/> <column header="Profile Description" width="30%" colName="ProfileDescription" /> <column header="Site" width="9%" colName="Site"/> <column header="Record Type" width="20%" linkCaption="Current"/> </tablePane>
Related JavaScript
ClientMethod onSubmit() [ Language = javascript ] { var auditForm=zenPage.getComponentById('auditForm'); var valid = this.IsSearchFormValid(); if (valid==true) { var resultsPane=zenPage.getComponentById('resultsPaneId'); this.getSearchQueryParams(); this.executeQueryForTable1(); resultsPane.setHidden(false); auditForm.setHidden(true); } return true; } ClientMethod getSearchQueryParams() [ Language = javascript ] { // Get values from component ID var startDateLabel=zenPage.getComponentById('startDateId'); var startDate=startDateLabel.formatValue(startDateLabel.getValue()); var endDateLabel=zenPage.getComponentById('endDateId'); var endDate=endDateLabel.formatValue(endDateLabel.getValue()); // Add the start date as a parameter var table=zenPage.getComponentById('workBioTable'); var param1=zenPage.getComponentById("p1"); var param2=zenPage.getComponentById("p2"); param1.value=startDate; param2.value=endDate; } ClientMethod executeQueryForTable1() [ Language = javascript ] { var table=zenPage.getComponentById('workBioTable'); table.executeQuery(); table.refreshContents(true); }
UPDATE:
Working stripped down example attached. Some minor CSS omissions so styling will be different to earlier screenshot. To use the example, you will need to import the .xml containing the Cache classes into your SAMPLES namespace and import the ^WORK and ^WSF globals using the .GOF file and the System Management Portal. To run the example, simply press F5 on the LabsApp.AuditTrail class within Cache Studio. The important thing to note is that the tablePane always has the bottom row selected.
Here is the version of Cache I am using.
$ZV : Cache for Windows (x86-32) 2013.1.6 (Build 950_1) Fri Jun 6 2014 19:03:11 EDT
Hi Stephen.
Can you please provide small complete standalone example, that we can run in SAMPLES namespace to reproduce the behaviour you see.
Thank you,
Alexander.
Done! See update in description.
Thank you Stephen, that helps a lot.
You have valueColumn defined: valueColumn="ID"
"Each time the table is refreshed, in each row Zen tests this logical value against the actual value that appears in the valueColumn in that row. Zen selects any row(s) that contain value in valueColumn"
http://docs.intersystems.com/cache20162/csp/docbook/DocBook.UI.Page.cls?...
However no ID column in query. So value of every row is empty string, that matches value of table for every row, so last row is hightlighted.
You need either remove valueColumn="ID" or add ID column to query.
Regards,
Alexander.
Thanks @alexander-koblov, your solution worked perfectly :)
This question is solved.