Home
Developing Analytics Applications
Integrating tablesorter.js with BIRT tables
Migrateduser
<p>Hello, i have attempted to use tablesorter.js with birt for reporting and filtering. tablesorter offers the ability to filter data withing the table by simple adding their widget when calling tablesorter on your table.</p>
<p>for some reason something is preventing this widget from creating the table row in the table header and enabling filtering to work.</p>
<p>i have attached a sample report using the birt sample database.</p>
<p>anybody know why filtering is not working?</p>
<pre class="_prettyXprint _lang-xml">
<?xml version="1.0" encoding="UTF-8"?>
<report xmlns="http://www.eclipse.org/birt/2005/design" version="3.2.23" id="1">
<property name="createdBy">Eclipse BIRT Designer Version 4.6.0.v201606072122</property>
<property name="units">in</property>
<method name="clientInitialize"><![CDATA[head.js("https://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.27.7/css/theme.blue.css",null);]]></method>
<property name="iconFile">/templates/blank_report.gif</property>
<property name="bidiLayoutOrientation">ltr</property>
<property name="imageDPI">96</property>
<data-sources>
<oda-data-source extensionID="org.eclipse.birt.report.data.oda.jdbc" name="BirtSampleDataSource" id="4">
<list-property name="privateDriverProperties">
<ex-property>
<name>contentBidiFormatStr</name>
<value>ILYNN</value>
</ex-property>
<ex-property>
<name>metadataBidiFormatStr</name>
<value>ILYNN</value>
</ex-property>
</list-property>
<property name="odaDriverClass">org.eclipse.birt.report.data.oda.sampledb.Driver</property>
<property name="odaURL">jdbc:classicmodels:sampledb</property>
<property name="odaUser">ClassicModels</property>
</oda-data-source>
</data-sources>
<data-sets>
<oda-data-set extensionID="org.eclipse.birt.report.data.oda.jdbc.JdbcSelectDataSet" name="BirtSampleDataSet" id="5">
<list-property name="columnHints">
<structure>
<property name="columnName">PRODUCTCODE</property>
<property name="analysis">dimension</property>
<text-property name="displayName">PRODUCTCODE</text-property>
<text-property name="heading">PRODUCTCODE</text-property>
</structure>
<structure>
<property name="columnName">PRODUCTNAME</property>
<property name="analysis">dimension</property>
<text-property name="displayName">PRODUCTNAME</text-property>
<text-property name="heading">PRODUCTNAME</text-property>
</structure>
<structure>
<property name="columnName">PRODUCTLINE</property>
<property name="analysis">dimension</property>
<text-property name="displayName">PRODUCTLINE</text-property>
<text-property name="heading">PRODUCTLINE</text-property>
</structure>
<structure>
<property name="columnName">PRODUCTVENDOR</property>
<property name="analysis">dimension</property>
<text-property name="displayName">PRODUCTVENDOR</text-property>
<text-property name="heading">PRODUCTVENDOR</text-property>
</structure>
<structure>
<property name="columnName">PRODUCTDESCRIPTION</property>
<property name="analysis">dimension</property>
<text-property name="displayName">PRODUCTDESCRIPTION</text-property>
<text-property name="heading">PRODUCTDESCRIPTION</text-property>
</structure>
</list-property>
<list-property name="parameters"/>
<structure name="cachedMetaData">
<list-property name="resultSet">
<structure>
<property name="position">1</property>
<property name="name">PRODUCTCODE</property>
<property name="dataType">string</property>
</structure>
<structure>
<property name="position">2</property>
<property name="name">PRODUCTNAME</property>
<property name="dataType">string</property>
</structure>
<structure>
<property name="position">3</property>
<property name="name">PRODUCTLINE</property>
<property name="dataType">string</property>
</structure>
<structure>
<property name="position">4</property>
<property name="name">PRODUCTVENDOR</property>
<property name="dataType">string</property>
</structure>
<structure>
<property name="position">5</property>
<property name="name">PRODUCTDESCRIPTION</property>
<property name="dataType">string</property>
</structure>
</list-property>
</structure>
<property name="dataSource">BirtSampleDataSource</property>
<list-property name="resultSet">
<structure>
<property name="position">1</property>
<property name="name">PRODUCTCODE</property>
<property name="nativeName">PRODUCTCODE</property>
<property name="dataType">string</property>
<property name="nativeDataType">12</property>
</structure>
<structure>
<property name="position">2</property>
<property name="name">PRODUCTNAME</property>
<property name="nativeName">PRODUCTNAME</property>
<property name="dataType">string</property>
<property name="nativeDataType">12</property>
</structure>
<structure>
<property name="position">3</property>
<property name="name">PRODUCTLINE</property>
<property name="nativeName">PRODUCTLINE</property>
<property name="dataType">string</property>
<property name="nativeDataType">12</property>
</structure>
<structure>
<property name="position">4</property>
<property name="name">PRODUCTVENDOR</property>
<property name="nativeName">PRODUCTVENDOR</property>
<property name="dataType">string</property>
<property name="nativeDataType">12</property>
</structure>
<structure>
<property name="position">5</property>
<property name="name">PRODUCTDESCRIPTION</property>
<property name="nativeName">PRODUCTDESCRIPTION</property>
<property name="dataType">string</property>
<property name="nativeDataType">12</property>
</structure>
</list-property>
<xml-property name="queryText"><![CDATA[select PRODUCTCODE, PRODUCTNAME, PRODUCTLINE, PRODUCTVENDOR, PRODUCTDESCRIPTION
from CLASSICMODELS.PRODUCTS
WHERE PRODUCTCODE LIKE 'S18%']]></xml-property>
<xml-property name="designerValues"><![CDATA[<?xml version="1.0" encoding="UTF-8"?>
<model:DesignValues xmlns:design="http://www.eclipse.org/datatools/connectivity/oda/design" xmlns:model="http://www.eclipse.org/birt/report/model/adapter/odaModel">
<Version>2.0</Version>
<design:ResultSets derivedMetaData="true">
<design:resultSetDefinitions>
<design:resultSetColumns>
<design:resultColumnDefinitions>
<design:attributes>
<design:identifier>
<design:name>PRODUCTCODE</design:name>
<design:position>1</design:position>
</design:identifier>
<design:nativeDataTypeCode>12</design:nativeDataTypeCode>
<design:precision>15</design:precision>
<design:scale>0</design:scale>
<design:nullability>Nullable</design:nullability>
<design:uiHints>
<design:displayName>PRODUCTCODE</design:displayName>
</design:uiHints>
</design:attributes>
<design:usageHints>
<design:label>PRODUCTCODE</design:label>
<design:formattingHints>
<design:displaySize>15</design:displaySize>
</design:formattingHints>
</design:usageHints>
</design:resultColumnDefinitions>
<design:resultColumnDefinitions>
<design:attributes>
<design:identifier>
<design:name>PRODUCTNAME</design:name>
<design:position>2</design:position>
</design:identifier>
<design:nativeDataTypeCode>12</design:nativeDataTypeCode>
<design:precision>70</design:precision>
<design:scale>0</design:scale>
<design:nullability>Nullable</design:nullability>
<design:uiHints>
<design:displayName>PRODUCTNAME</design:displayName>
</design:uiHints>
</design:attributes>
<design:usageHints>
<design:label>PRODUCTNAME</design:label>
<design:formattingHints>
<design:displaySize>70</design:displaySize>
</design:formattingHints>
</design:usageHints>
</design:resultColumnDefinitions>
<design:resultColumnDefinitions>
<design:attributes>
<design:identifier>
<design:name>PRODUCTLINE</design:name>
<design:position>3</design:position>
</design:identifier>
<design:nativeDataTypeCode>12</design:nativeDataTypeCode>
<design:precision>50</design:precision>
<design:scale>0</design:scale>
<design:nullability>Nullable</design:nullability>
<design:uiHints>
<design:displayName>PRODUCTLINE</design:displayName>
</design:uiHints>
</design:attributes>
<design:usageHints>
<design:label>PRODUCTLINE</design:label>
<design:formattingHints>
<design:displaySize>50</design:displaySize>
</design:formattingHints>
</design:usageHints>
</design:resultColumnDefinitions>
<design:resultColumnDefinitions>
<design:attributes>
<design:identifier>
<design:name>PRODUCTSCALE</design:name>
<design:position>4</design:position>
</design:identifier>
<design:nativeDataTypeCode>12</design:nativeDataTypeCode>
<design:precision>10</design:precision>
<design:scale>0</design:scale>
<design:nullability>Nullable</design:nullability>
<design:uiHints>
<design:displayName>PRODUCTSCALE</design:displayName>
</design:uiHints>
</design:attributes>
<design:usageHints>
<design:label>PRODUCTSCALE</design:label>
<design:formattingHints>
<design:displaySize>10</design:displaySize>
</design:formattingHints>
</design:usageHints>
</design:resultColumnDefinitions>
<design:resultColumnDefinitions>
<design:attributes>
<design:identifier>
<design:name>PRODUCTVENDOR</design:name>
<design:position>5</design:position>
</design:identifier>
<design:nativeDataTypeCode>12</design:nativeDataTypeCode>
<design:precision>50</design:precision>
<design:scale>0</design:scale>
<design:nullability>Nullable</design:nullability>
<design:uiHints>
<design:displayName>PRODUCTVENDOR</design:displayName>
</design:uiHints>
</design:attributes>
<design:usageHints>
<design:label>PRODUCTVENDOR</design:label>
<design:formattingHints>
<design:displaySize>50</design:displaySize>
</design:formattingHints>
</design:usageHints>
</design:resultColumnDefinitions>
<design:resultColumnDefinitions>
<design:attributes>
<design:identifier>
<design:name>PRODUCTDESCRIPTION</design:name>
<design:position>6</design:position>
</design:identifier>
<design:nativeDataTypeCode>12</design:nativeDataTypeCode>
<design:precision>32700</design:precision>
<design:scale>0</design:scale>
<design:nullability>Nullable</design:nullability>
<design:uiHints>
<design:displayName>PRODUCTDESCRIPTION</design:displayName>
</design:uiHints>
</design:attributes>
<design:usageHints>
<design:label>PRODUCTDESCRIPTION</design:label>
<design:formattingHints>
<design:displaySize>32700</design:displaySize>
</design:formattingHints>
</design:usageHints>
</design:resultColumnDefinitions>
<design:resultColumnDefinitions>
<design:attributes>
<design:identifier>
<design:name>QUANTITYINSTOCK</design:name>
<design:position>7</design:position>
</design:identifier>
<design:nativeDataTypeCode>4</design:nativeDataTypeCode>
<design:precision>10</design:precision>
<design:scale>0</design:scale>
<design:nullability>Nullable</design:nullability>
<design:uiHints>
<design:displayName>QUANTITYINSTOCK</design:displayName>
</design:uiHints>
</design:attributes>
<design:usageHints>
<design:label>QUANTITYINSTOCK</design:label>
<design:formattingHints>
<design:displaySize>11</design:displaySize>
</design:formattingHints>
</design:usageHints>
</design:resultColumnDefinitions>
<design:resultColumnDefinitions>
<design:attributes>
<design:identifier>
<design:name>BUYPRICE</design:name>
<design:position>8</design:position>
</design:identifier>
<design:nativeDataTypeCode>8</design:nativeDataTypeCode>
<design:precision>15</design:precision>
<design:scale>0</design:scale>
<design:nullability>Nullable</design:nullability>
<design:uiHints>
<design:displayName>BUYPRICE</design:displayName>
</design:uiHints>
</design:attributes>
<design:usageHints>
<design:label>BUYPRICE</design:label>
<design:formattingHints>
<design:displaySize>24</design:displaySize>
</design:formattingHints>
</design:usageHints>
</design:resultColumnDefinitions>
<design:resultColumnDefinitions>
<design:attributes>
<design:identifier>
<design:name>MSRP</design:name>
<design:position>9</design:position>
</design:identifier>
<design:nativeDataTypeCode>8</design:nativeDataTypeCode>
<design:precision>15</design:precision>
<design:scale>0</design:scale>
<design:nullability>Nullable</design:nullability>
<design:uiHints>
<design:displayName>MSRP</design:displayName>
</design:uiHints>
</design:attributes>
<design:usageHints>
<design:label>MSRP</design:label>
<design:formattingHints>
<design:displaySize>24</design:displaySize>
</design:formattingHints>
</design:usageHints>
</design:resultColumnDefinitions>
</design:resultSetColumns>
<design:criteria/>
</design:resultSetDefinitions>
</design:ResultSets>
</model:DesignValues>]]></xml-property>
</oda-data-set>
</data-sets>
<page-setup>
<simple-master-page name="Simple MasterPage" id="2">
<page-footer>
<text id="3">
<property name="contentType">html</property>
<text-property name="content"><![CDATA[<value-of>new Date()</value-of>]]></text-property>
</text>
</page-footer>
</simple-master-page>
</page-setup>
<body>
<text id="6">
<property name="contentType">html</property>
<text-property name="content"><![CDATA[<script src="https://code.jquery.com/jquery-1.2.6.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.27.7/js/jquery.tablesorter.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.27.7/js/widgets/widget-filter.min.js" type="text/javascript"></script>]]></text-property>
</text>
<table id="7">
<property name="dataSet">BirtSampleDataSet</property>
<list-property name="boundDataColumns">
<structure>
<property name="name">PRODUCTCODE</property>
<text-property name="displayName">PRODUCTCODE</text-property>
<expression name="expression" type="javascript">dataSetRow["PRODUCTCODE"]</expression>
<property name="dataType">string</property>
</structure>
<structure>
<property name="name">PRODUCTNAME</property>
<text-property name="displayName">PRODUCTNAME</text-property>
<expression name="expression" type="javascript">dataSetRow["PRODUCTNAME"]</expression>
<property name="dataType">string</property>
</structure>
<structure>
<property name="name">PRODUCTLINE</property>
<text-property name="displayName">PRODUCTLINE</text-property>
<expression name="expression" type="javascript">dataSetRow["PRODUCTLINE"]</expression>
<property name="dataType">string</property>
</structure>
<structure>
<property name="name">PRODUCTVENDOR</property>
<text-property name="displayName">PRODUCTVENDOR</text-property>
<expression name="expression" type="javascript">dataSetRow["PRODUCTVENDOR"]</expression>
<property name="dataType">string</property>
</structure>
<structure>
<property name="name">PRODUCTDESCRIPTION</property>
<text-property name="displayName">PRODUCTDESCRIPTION</text-property>
<expression name="expression" type="javascript">dataSetRow["PRODUCTDESCRIPTION"]</expression>
<property name="dataType">string</property>
</structure>
</list-property>
<expression name="bookmark" type="javascript">"myTable"</expression>
<column id="36"/>
<column id="37"/>
<column id="38"/>
<column id="39"/>
<column id="40"/>
<header>
<row id="8">
<cell id="9">
<label id="10">
<text-property name="text">PRODUCTCODE</text-property>
</label>
</cell>
<cell id="11">
<label id="12">
<text-property name="text">PRODUCTNAME</text-property>
</label>
</cell>
<cell id="13">
<label id="14">
<text-property name="text">PRODUCTLINE</text-property>
</label>
</cell>
<cell id="15">
<label id="16">
<text-property name="text">PRODUCTVENDOR</text-property>
</label>
</cell>
<cell id="17">
<label id="18">
<text-property name="text">PRODUCTDESCRIPTION</text-property>
</label>
</cell>
</row>
</header>
<detail>
<row id="19">
<cell id="20">
<data id="21">
<property name="resultSetColumn">PRODUCTCODE</property>
</data>
</cell>
<cell id="22">
<data id="23">
<property name="resultSetColumn">PRODUCTNAME</property>
</data>
</cell>
<cell id="24">
<data id="25">
<property name="resultSetColumn">PRODUCTLINE</property>
</data>
</cell>
<cell id="26">
<data id="27">
<property name="resultSetColumn">PRODUCTVENDOR</property>
</data>
</cell>
<cell id="28">
<data id="29">
<property name="resultSetColumn">PRODUCTDESCRIPTION</property>
</data>
</cell>
</row>
</detail>
<footer>
<row id="30">
<cell id="31"/>
<cell id="32"/>
<cell id="33"/>
<cell id="34"/>
<cell id="35"/>
</row>
</footer>
</table>
<text id="41">
<property name="contentType">html</property>
<text-property name="content"><![CDATA[<script type="text/javascript">
$(document).ready(function() {
$('#myTable').prepend('<thead></thead>');
$('#myTable thead').append($('#myTable tr:first-child'));
$('#myTable').tablesorter({
theme : 'blue',
widget : ["filters"]
});
});
</script>]]></text-property>
</text>
</body>
</report>
</pre>
Find more posts tagged with
Comments
There are no comments yet