To access a specific cell and retrieve its content - tablesorter

How can I retrieve the content of a specific cell in a TableSorter object ? Let say I want to retrieve the content of cell[3,4] meaning the content of the third row and fourth column. I'm sure there is an easy way to do that...
Thanks !
FG

According to the documentation TableSorter works on a standard table
Assuming this is your table
<table id='myTable'>
<tr>
<td>Row 0 / Cell 0</td>
<td>Row 0 / Cell 1</td>
</tr>
<tr>
<td>Row 1 / Cell 0</td>
<td>Row 1 / Cell 1</td>
</tr>
</table>
So you should be able to get a specific cell by getting a reference to your table
var myTable = document.getElementById('myTable');
Then access the specific cell by calling
var cell = myTable.rows[1].cells[0]
The contents of the cell should be accessible using
cell.firstChild.nodeValue; // returns "Row 1 / Cell 0"

Related

didCellParse does not return cell

I'm trying to center a row. My <td> has colspan across the table.
I have a data tag in the <td> because I have dynamic subheaders in the tables. With willDrawCell and didDrawCell I can access the cell.raw property and check the data tag to apply the style.
When I use didCellParse the CellHookData has cell as undefined.
With the willDrawCell and didDrawCell, I can alter the halign property, but it DOES NOT render in the center of the row in pdf.
didParseCell: data => {
if($(data.cell.raw).data('subhead') == true){
data.cell.halign = 'center';
}
}
With didParseCell I receive an error, because cell is undefined.
https://codepen.io/lightningmd/pen/gOOaezM
This code pen is using willDrawCell. You can see the subheader is found, and the cell.styles.halign is applied. Just change to didParseCell for the error.
You need to set the styles on the cell styles object, not the cell: data.cell.styles.halign = 'center'.
Seems there also is a bug where didParseCell is called with a null value for data.cell when there are colspans/rowspans. All in all, this should work:
didParseCell: data => {
if (data.cell && $(data.cell.raw).data('subhead') == true) {
console.log('Subheader Found;')
data.cell.styles.halign = 'center';
}
}

Print custom barcode label using TCPDF

I have a project to print barcode in roll label like
this.
It is possible to do these things with tcpdf? At first the barcode should be placed at bottom and rotated 180° but i think its impossible to rotate the barcode using start transform and rotate since its only for graphic. So i tried to rotate the text, its works but only in another page to test that with dummy data. How to implement it in this code since im using serializeTCPDFtagParameters?
foreach($product as $row){
$description = $row['description'];
$barcode = $row['barcode_code'];
$barcode = $pdf->serializeTCPDFtagParameters(array($barcode, 'C128','','',25,10,0.5, array('position'=>'S','border'=>false,'padding'=>0, 'fgcolor'=>array(0,0,0), 'bgcolor'=>array(255,255,255), 'text'=>true, 'font'=>'helvetica','fontsize'=>7, 'stretchtext'=>6), 'N'));
$html .= '
<table width="60mm" height="15mm" cellpadding="3" border="1">
<tr>
<td><tcpdf method="write1DBarcode" params="'.$barcode.'" /></td>
</tr>';
'<tr>
<td> '.$description.'</td>
</tr>';
$html = '</table>';
$item = $item+1;}
$pdf->setFont('helvetica', '','4');
$pdf->writeHTML($html, true,0,true,0);
$pdf->lastPage();
$pdf->output('test.pdf','I');
And should i using cell to make the label side by side per table row? Im gonna use it for labeling jewelry and accessories. Is there any other alternative?
ps. Sorry for my poor english.

Iterate over Vaadin Table Rows

I have a Vaadin Table with some Filters and sorts. Is it possible to get the ID of the row over and under the current selected row?
Object currentRow = table.getValue(); //current selected row
Object nextRow = table.nextItemId(currentRow);
Object previousRow = table.prevItemId(currentRow);

Foreach loop table, max 2 cells then a new row?

I have a question for my foreach loop on a table design in my mvc view.
I want my loop to output max 2 cells for each table row and if and it has data to loop out more than 2 cells it adds a new row and continues to loop out the data on the cells on that row etc..
Anyone have a solution for this?
Iterate over the collection in increments of two. Check to make sure that the i+1th item is available before outputting it, outputting an empty cell instead if it isn't.
<table>
<thead>
<tr><th>Column 1</th><th>Column 2</th></tr>
</thead>
<tbody>
#for (int i = 0; i < Model.Count(); i = i + 2)
{
<tr>
<td>#Model[i]</td> // or #Model.ElementAt(i)
<td>#(i+1 < Model.Count() ? Model[i+1] : "")</td> // similar
</tr>
}
</tbody>
</table>
You shouldn't use tables for this.
Instead, put your content in <div>s with float: left or display: inline-block, and make the parent element just wide enough to hold two children.
You want to look at using the modulus operator (%).
Something like
if i%2 = 0 { new line }

Access to multiple ItemRenderers within an AdvancedDataGrid

I've create an AdvancedDataGrid where most of the cell are based on an ItemRenderer. The custom ItemRenderer (SoundBox) extends VBox. This custom component allow for simple changes in the background color based on user clicking on a cell.
Here is the snippet of the AdvancedDataGrid (nothing too advanced):
<mx:AdvancedDataGrid id="fsfw" dataProvider="{fsfWordList}" sortableColumns="false" >
<mx:groupedColumns>
<mx:AdvancedDataGridColumn width="35" dataField="wordcount" headerText=" "/>
<mx:AdvancedDataGridColumn id="myWord" width="150" headerText="TEST ITEMS">
<mx:itemRenderer>
<mx:Component>
<components:SoundBox width="100%" letterSound="{data.word}" />
</mx:Component>
</mx:itemRenderer>
</mx:AdvancedDataGridColumn>
<mx:AdvancedDataGridColumn width="200" headerText="Correct / 2 points" dataField="sound1">
<mx:itemRenderer>
<mx:Component>
<components:SoundBox width="100%" letterSound="{data.sound1}" pointColumn="2"/>
</mx:Component>
</mx:itemRenderer>
</mx:AdvancedDataGridColumn>
</mx:groupedColumns>
</AdvancedDataGrid>
What I'm trying to do is change the background color of (let's just say I have one row of data) row1, cell1 to green when the user clicks on cell3 of row1.
I'm unsure as to how I get access to those items (ItemRenderer/SoundBox) within the Grid.
Any Ideas? THX!
look at the following code,,, it will return the item rendrer of given row and colomn index.. Extended the Advance dataGrid and define this function in the extended class,to get it worked, then use it like "CustomADG.indicesToItemRenderer(0,0)" and in that reuturend object try to get the reference to soundComponent.
public function indicesToItemRenderer(rowIndex:int, colIndex:int):IListItemRenderer
{
var firstItemIndex:int = verticalScrollPosition - offscreenExtraRowsTop;
if (rowIndex < firstItemIndex ||
rowIndex >= firstItemIndex + listItems.length)
{
return null;
}
return listItems[rowIndex - firstItemIndex][colIndex];
}

Resources