Discussions
Categories
Groups
Community Home
Categories
INTERNAL ENABLEMENT
POPULAR
PUBLIC CLOUD
PRIVATE CLOUD
Quick Links
MY LINKS
HELPFUL TIPS
Back to website
Home
Intelligence (Analytics)
Integrating tablesorter.js with BIRT tables
jzander2k16
<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
jzander2k16
<p>solved, i was calling it incorrectly through $(document).(ready)</p>