datatable pagination not working - datatable

I have used datatable for pagination ,all is working fine except that next prev pagination is not showing first time ,after onkeypress event in search-box it is working fine, in console it is showing following error:
"TypeError: aoLocal[(i + iRowspan)][j] is undefined".

Check the table structure. Unended tags cause the undefined rowspan. For example, this structure breaks the table rendering with DataTables:
<table>
<thead>
<tr>
<th>I am a visible header</th>
<th>Hey! what the hell... Why am i invisible?</th>
<tr>
</thead>
</table>
Breaks due to the 2nd <tr> which should be </tr>.

Related

Circumvent Boostrap-Table from rendering 100+ rows slowly

I'm rendering a list of state objects (with Spring and Thymeleaf) on my view page:
<table id="state-table" data-toggle="table" data-pagination="true" data-pagination-v-align="top" data-search="true">
<thead>
<tr>
<th data-sortable="true">ID</th>
<th data-sortable="true">Descrizione</th>
<th>Azioni</th>
</tr>
</thead>
<tbody>
<tr th:each="s : ${state}">
<td><span th:text="${s.id}"></span></td>
<td><span th:text="${s.descrizione}"></span></td>
</tr>
</tbody>
</table>
The table contains about 150 elements, but when the page is rendering I see for less than a second an ugly page (is the plugin trying to paginate the result) and I would like to avoid it.
I have already tried adding a timeout as workaround:
$(function() {
$("#state-table").bootstrapTable("showLoading");
setTimeout(function() {
$("#state-table").bootstrapTable("hideLoading");
}, 1000);
});
but with this code, when the page renders, I see a strange html page at beginning, then I see the loading message, and finally the table with all elements loaded.
I think I have to intervene before (or while) the table is created but I don't know how. What would I need to do so that the table is rendered correctly without the user noticing the ugly "un-bootstraped" table?
Try To use Pagination instead of showing all your entries.
Hope it help you : https://www.baeldung.com/spring-thymeleaf-pagination

Tablesorter: Set initial filter-select value on load

I have a tablesorter table where a column uses the filter-select and filter-onlyAvail classes.
What I'm trying to do is pre-filter that column on one of the values in the drop-down select.
I have tried setting it in the data-placeholder attribute but that doesn't do the trick.
I've also tried the following:
$(document).ready(function(){
$.tablesorter.setFilters($("#table"),['','','','','','','','T'],true);
});
It correctly sets the filter in the select menu but doesn't actually RUN the filter.
Any ideas?
To initially set the filters, add the filter to a header "data-value" attribute (set by the filter_defaultAttrib widget option):
<table id="table">
<thead>
<tr>
<th>...</th>
...
<th data-value="T">...</th>
</thead>
<tbody>
...
</tbody>
</table>
You can see an example here in the Age column where <30 is initially set.

ASP Classic VB error 800a01a8 object required

I am attempting to fix an issue on a company website. The page in question is http://www.srbc.com/SiteMap.asp. I am getting the following error when trying to call a global options file:
Microsoft VBScript runtime error '800a01a8'
Object required: ''
/_Includes/Callout_Global.asp, line 40
And this is the line the error references in the /_Includes/Callout_Global.asp file:
rs_main.open "Select TeamID, FirstName + ' ' + LastName as FullName from team where Category = 'Attorney' and IsActive = '1' Order by OrderNum"
The code controls the dropdown box that should contain a listing of attorney names.
This code works just fine on other pages in the site (see for example http://www.srbc.com/Careers/Default.asp).
I am not a coder, just trying to cleanup this site a bit. It is pretty dated code, but any suggestions on what I could do to fix this would be appreciated.
The coding on the SiteMap.asp page around where this function is called looks like:
<td width="210" valign="top" class="hideforprint">
<!--#include virtual="/_Includes/Callout_Global.asp" -->
</td>
<td width="20"> </td>
</tr>
</table>
<table width="726" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="25"></td>
</tr>
</table>
</td>
<td width="22" valign="top" background="/Images/CommonImages/rightborder.gif"> </td>
</tr>
</table>
<!--#include virtual="/_Includes/Footer.asp" -->
</body>
</html>
Thanks!
That error would suggest that you haven't created an object called rs_main. It looks like it should be a recordset object, so you earlier in your code you should have the line
Set rs_main = Server.CreateObject("ADODB.Recordset")
Could you post the first 40 lines of Callout_Global.asp, there might be other stuff missing?
I'm a dope!
I figured it out. At the top of the SiteMap.asp code, there was a function call missing. Once I added that back in, everything started working. I just noticed that was different from every other page that was working normally.
Now to tackle a search index issue.
Thanks!

Wijimo 5 AngularJS - ng repeat and Auto Complete Directive issue

I am trying to use the Wijimo Auto Complete Directive inside a ng-repeat and though I can bind successfully to a data source I cannot set the scope for a specific instance - the value selected in 1 directive is set for all instances in the scope.
Its the classic ng-repeat issue when using using repeated input controls.
I am not sure if its the way the wj-auto-complete directive sets which property on the scope.
So this works fine for 1 instance and multiple instances within an ng-repeat (but sets the same value).
<wj-auto-complete
text="selectedHotel"
items-source="limo.hotelData"
placeholder="Hotel"
display-member-path="address"
max-items="50"/>
</div>
<p>{{selectedHotel || json}}</p>
I have tried the following
<div ng-repeat="flight in flights">
<wj-auto-complete
text="flight.from"
items-source="limo.hotelData"
placeholder="Hotel"
display-member-path="address"
max-items="50"/>
</div>
but no joy.
It looks like the text property is what is set with the selected value? Though the property value is a little odd.
Both the ComboBox and AutoComplete control have a "text" property that gets or sets the text currently shown by the control, and also a "selectedValue" property that gets or sets the value that is currently selected. These two often match, except while the user is typing and the incomplete text doesn't match any items in the list of valid choices.
This fiddle shows how using the "selectedValue" property works OK for both the ComboBox and AutoComplete. I hope it's useful:
http://jsfiddle.net/Wijmo5/8p94jo6q/
<table class="table table-condensed">
<thead>
<th>ID</th>
<th>Country</th>
<th>AutoComplete</th>
<th>ComboBox</th>
</thead>
<tbody>
<tr ng-repeat="item in data">
<td>
{{item.id}}
</td>
<td>
{{item.country}}
</td>
<td>
<wj-auto-complete
items-source="countries"
selected-value="item.country"
placeHolder="country"
required="false">
</wj-auto-complete>
</td>
<td>
<wj-combo-box
items-source="countries"
selected-value="item.country"
placeHolder="country"
required="false">
</wj-combo-box>
</td>
</tr>
</tbody>
</table>

AngularJS: How to use ng-repeat on a data collection that is hierarchical

I am receiving a collection from server that is hierarchical. ie., I've a list of Study that contains Series. For example I get below object from server.
var studies = [ {studyDescription: 'Study1', series:[
{seriesDescription:'Series1'},
{seriesDescription:'Series2'}
]
}];
'series' is nested within a study.
I am using a HTML table to display this data. And I wanted to flatten the hierarchy while displaying. ie the table should look like:
Study Series
--------------------
Study1 Series1
Study1 Series2 ---> Study1 repeats for each series it contains
I use ng-repeat to iterate the the rows:
<tr ng-repeat="study in studies">
<td>{{studyDescription}}</td>
// HOW to repeat for each series ????
</tr>
How to display such hierarchical data using AngularJS ng-repeat directive? I tried using before , but that did not work. Basically I need multiple for loops to repeat the rows that many time. How to achieve this.
Thanks.
You can use multiple tbody to iterate on the series :
HTML :
<table border=1>
<thead>
<th>Studies</th>
<th>Series</th>
</thead>
<tbody ng-repeat="study in studies">
<tr ng-repeat="series in study.series">
<td>{{study.studyDescription}}</td>
<td>{{series.seriesDescription}}</td>
</tr>
</tbody>
</table>
Here's the JSFiddle :
http://jsfiddle.net/L3MWJ/1/
Tell me if it works for you, still I'm not sure if it will work on all browsers.
Did you try nested ng-repeat ? Try this :
<tr ng-repeat="study in studies">
<td>{{study.studyDescription}}</td>
<td>
<span ng-repeat="serie in study.series"></span>
<p> {{serie.seriesDescription}}</p>
</td>
</tr>

Resources