Hi,
am not sure if I'm doing this right ..
I have here the function to move the paging from GridView(table)
generated by .NET, on top/before the table(GridView), and put it
inside the DIV element.
Problem is, the condition there:
if($('tbody tr:last td:has(table)', this).length > 0)
doesn't work.
I have provided a simplier table and expected result at the bottom.
- JQuery Code : Start
---------------------------------------------------------------------------------------
jQuery.fn.CreatePagingOnTop = function() {
if(jQuery(this).is('table')) {
if($('tbody tr:last td:has(table)', this).length > 0) { //
need to check if the paging table exists in the last row of the table
this.before('<div><table id=\'pages\'></table></div>');
this.find('tbody tr:last').remove().appendTo($("#pages"));
}
}
return this;
}
$(document).ready(function()
{
// let's remove our paging and create
// DIV element on top of table element and move the paging
there..
$("#scrollTable").CreatePagingOnTop();
});
- JQuery Code : END
---------------------------------------------------------------------------------------
- HTML: Table problem, simplified : Start
-----------------------------------------------------------
<table>
<thead>
<th>head 1</th>
<th>head 2</th>
</thead>
<tbody>
<tr>
<td>col 1 r1</td>
<td>col 2 r1</td>
</tr>
<tr>
<td>col 1 r2</td>
<td>col 2 r2</td>
</tr>
<tr>
<td colspan="2">
<!--
start of paging table, which is conditionally generated
depends on Items/Row Per Page.
"Conditionally": because if current items/row in page
displayed is lesser than Items/Row Per Page,
this table will not be generated.
I have to set a condition on my jQuery so it will not
remove and move the last row which could be a data values,
instead of the Page links.
-->
<table border="0">
<tr>
<td><span>1</span></td>
<td><a href="">2</a></td>
</tr>
</table>
</td>
</tr>
</tbody>
</table>
- HTML: Table problem, simplified : END
-----------------------------------------------------------
- HTML: Expected result : Start
------------------------------------------------------------------------
<div>
<table>
<tr>
<td><span>1</span></td>
<td><a href="">2</a></td>
</tr>
</table>
</div>
<table id="scrollTable">
<thead>
<th>head 1</th>
<th>head 2</th>
</thead>
<tbody>
<tr>
<td>col 1 r1</td>
<td>col 2 r1</td>
</tr>
<tr>
<td>col 1 r2</td>
<td>col 2 r2</td>
</tr>
<tr>
<td colspan="2">
<table border="0">
<tr>
<td><span>1</span></td>
<td><a href="">2</a></td>
</tr>
</table>
</td>
</tr>
</tbody>
</table>
- HTML: Expected result : Start
------------------------------------------------------------------------
- HTML: Result if no condition and no Page links table : Start
-----------------------------
<div>
<table>
<tr>
<td>col 1 r2</td>
<td>col 2 r2</td>
</tr>
</table>
</div>
<table>
<thead>
<th>head 1</th>
<th>head 2</th>
</thead>
<tbody>
<tr>
<td>col 1 r1</td>
<td>col 2 r1</td>
</tr>
</tbody>
</table>
- HTML: Result if no condition and no Page links table : END
-----------------------------
Please?
