We Keep Coding

Color cell according to condition

I have a table in which I have to set background color when the cell in header and cell in row appear as pair in a certain list in data source.
For example:
column : "AUD, USD"
row : "BRL, CZK"
in the cell of column AUD and row is BRL I check if exists in the list in datasource "AUD-BRL" and if so I need to color in a green
Now, I thought to do it in this way:
columns and rows will be in lists.
I go over both lists and then color in those indexes the cell.
So that I will have one function for whole table and not have to call from each cell to function (There are 1200 cells overall).
How can that be done?

The answer from Fede MG is correct.
If I understand your question correctly, you want to add a highlighting rule to all cells in the table detail row. Unfortunately I think it is a bit cumbersome to achieve this in BIRT.
I assume that your table has e.g. bindings like COL_VALUE_1, ..., COL_VALUE_9 for the cell values and COL_TITLE_1, ..., COL_TITLE_9 for the column headers.
Furthermore I assume a bit of experience with using Javascript in BIRT.
The way I do this like this:
For each detail cell I create a onCreate event script with code like this:
highlightDetailCell(this, row, 1);
... where 1 is the column number. E.g. this is the code for the first column, for the second column i replace the 1 with 2 and so on. One can quickly do this with copy&paste.
Next I implement the logic in a function inside the onInitialize script of the report like this:
function highlightDetailCell(item, row, colnum) {
var colTitle = row["COL_TITLE_" + colnum];
var colValue = row["COL_VALUE_" + colnum];
var highlight = use_your_logic_to_decide(colTitle, colValue);
if (highlight) {
item.get_Style().backgroundColor = "yellow";
}
}
This is the basic idea. If you want to add the script to many cells, it might be a lot of work to do this by hand. In fact it is possible to attach the call to the highlightDetailCell function with a script (of course, this is BIRT :-). You should read the documentation and just tinker with the Design Engine API (DE API for short).
But be warned that writing and debugging such a script may be even more work than doing the donkey work of adding and editing a one-liner to 1200 cells!
What I once did was basically this (in the onFactory event of the report item):
// This code is a simplified version that modifies just the first cell,
// However it should point you into the right direction.
// Some preparation
importPackage(Packages.org.eclipse.birt.report.model.api);
var myconfig = reportContext.getReportRunnable().getReportEngine().getConfig();
var de = DataEngine.newDataEngine( myconfig, null );
var elementFactory = reportContext.getDesignHandle().getElementFactory();
// Find the item you want to modify (in my case, a "Grid Item").
// Note that for tables, the structure is probably a bit different.
// E.G. tables have header, detail and footer rows,
// while grids just have rows.
var containerGrid = reportContext.getDesignHandle().findElement("Layout MATRIX");
// Get the first row
var row0 = containerGrid.getRows().get(0);
// Do something with the first cell (:
var cell = row0.getCells().get(0).getContent();
cell.setStringProperty("paddingTop", "1pt");
cell.setStringProperty("paddingLeft", "1pt");
cell.setStringProperty("paddingRight", "1pt");
cell.setStringProperty("paddingBottom", "1pt");
cell.setStringProperty("borderBottomColor", "#000000");
cell.setStringProperty("borderBottomStyle", "solid");
cell.setStringProperty("borderBottomWidth", "thin");
cell.setStringProperty("borderTopColor", "#000000");
cell.setStringProperty("borderTopStyle", "solid");
cell.setStringProperty("borderTopWidth", "thin");
cell.setStringProperty("borderLeftColor", "#000000");
cell.setStringProperty("borderLeftStyle", "solid");
cell.setStringProperty("borderLeftWidth", "thin");
cell.setStringProperty("borderRightColor", "#000000");
cell.setStringProperty("borderRightStyle", "solid");
cell.setStringProperty("borderRightWidth", "thin");
// When you're finished:
de.shutdown( );
Things are more complicated if you have to handle merged cells.
You could even add content to the cell (I created a whole matrix dynamically this way).
The script does not exactly what you want (add the script to each cell), but I leave this as an exercise...
It is also helpful to save the dynamically modified report design for opening in the designer, to see the outcome:
reportContext.getDesignHandle().saveAs("c:/temp/modified_report.rptdesign");
HTH

Go to the cell you want to format (applies also to elements like rows or columns), on the "Property Editor" go to "Highlights" and click "Add...". You'll get a dialog where you can enter a condition for the highlight and what styling to apply on the element if the condition is true.
Screenshot here

Tabulator: links with a label

I'm currently building a table with Tabulator where I have a column "Link". Only some rows contain a URL and some don't (emtpy cell). I now want to have a clickable link which shows the text "Link".
I can either get
- the entire URL as clickable link shown in the cell or
- show "Link" in all rows, even if there is no link available (which leads to "undefined" destination) or
- have the URL as plain text
My 'link' column is defined as follows:
{title:"Link", field:"link", formatter:"link", formatterParams:{target:"_blank",}},
The data I geht from my MySQL database is handled as follows:
if($row->link != "") {
echo "link:\"" . $row->link . "\", \n";
}
It does not work (for me) to build a link in the echo part (it will be plain text later):
echo "link:\"Link\", \n";
Does someone know, how to set it up?

You would need to use a Custom Formatter to do this.
You could use the built in Link Formatter Code as a starting point, and just add a bit more logic to handle your usage case

#illuminarch: sorry, cannot add a comment to your question: Yes, but if I use a label - a string representing the lable this label will also be shown in cells where no URL is available.

How to check if a table row contains a certain button in jQuery?

I have an HTML table that is filled dynamically and only shows a certain button in the first column if specific conditions are met, otherwise this button does not appear.
The button looks as follows (it always has the name = voidBtn):
<input type="button" name="voidBtn" value="Void" />
How can I check whether the current row contains this button or not ?
I was thinking of something like the following but didn't know how to write this the right way:
if($(this).closest('tr').find('input[name=void]') ...
OR
if($(this).closest('tr').find("td:eq(1):contains('voidBtn')") ...
I just need to know if the current row has such a button as then I want to click on it and do some other stuff.

Your way of checking should be fine, you just need to ask if it found it with length:
if($(this).closest('tr').find('input[name=void]').length > 0){
// there is a button
}

Considering $(this) as current row then you can find button like this...
$(this).find('input[name=voidBtn]')

$( '#'+tableId + "> tbody > tr> td").find('td','searched-string')
Here is the Example where we can find an element inside a row containing searched-string.Here yoy may use other option as my string was coming for input text field.

Let say you want to find all the rows of the table that contains a particular String "STRING" then you may write like this
**$('#tableid > tbody').find('tr','STRING')**
You may also count the number of row by
**$('#tableid > tbody').find('tr','STRING').length**
In Above answer i already declared tableid as Var in my Jquery Code.

Jquery tablesorter sort via two fields

I have such html table:
here: http://jsfiddle.net/zrjaM/1/
And such js for sorting:
$(document).ready(function() {
$(".sortable")
.tablesorter({sortList: [[4,0]], widgets: ['zebra']});
});
But i need to sort via 0-th column to.... i write:
$(document).ready(function() {
$(".sortable")
.tablesorter({sortList: [[0,0],[4,0]], widgets: ['zebra']});
});
but it works strange...
Also i need to do that, tr's with price value (4-th column) are on top, but now, when i sort only by price - all is ok, but when via two columns, i could have tr's with price both in end or middle.... How to send them to top, and sort first via 0-th, then via sorter 0-th sort via 4-t column.... How to do it?

#charlietfl's solution would work even without the code to add ZZZZZZZ to empty cells. But because that demo is using the original version of tablesorter, the first tbody would have to be removed.
But, because it looks like you are using my fork of tablesorter, which does allow sorting multiple tbodies, all you need to do is set the emptyTo option to none.
The emptyTo option is set to bottom by default. So all empty cells will always sort to the bottom. The reason the third column doesn't look like it's sorting at all is because all links in that column have the same text. Here is a demo.
Update: also remove the tablesorter-headerSortDown from the fourth column, it's still in the css but the plugin is using tablesorter-headerDesc now.

I figured out a possible solution.
First check rows for no price, if no price add a hidden span before item name in first column the text ZZZZZZZ in it. This forces all the ZZZZZZZ items to bottom and you get a double sort alphabetic on first row
$('tbody tr').each(function(){
if( $.trim( $(this).find('td').eq(4).text())==''){
$(this).find('td').eq(0).prepend('<span style="display:none">ZZZZZZZZ</span>')
}
});
$(".sortable") .tablesorter({
sortList: [[0,0],[4,0]], widgets: ['zebra']});
});
DEMO: http://jsfiddle.net/zrjaM/6/

how to add a color to a line in sharepoint 2007 list that has a specific text?

I would like to know how to add a color to a line in sharepoint 2007 list
if in one field there is a specific text contained ?
for example :
I have a list that have three fields:
list1
1.id
2.name
3.full description
now i want to show only the first and the second field to the user.
list1
id name
1 abc
2 edv
second thing, i want to give a color (let say red) to a row that contains in the hidden
field - "full description", a text with the word for example 'color'.
I found a javascript code that i can add to the aspx page :
(document).ready(function(){
$Text = $("td .ms-vb2:contains('color')");
$Text.parent().css("background-color", "red");
});
but it's only works if the the "full description" is shown.
can someone give me an idea ?
thanks,
gadym

Have you considered creating a data view with conditional formatting? See http://office.microsoft.com/en-au/sharepointdesigner/HA100996241033.aspx
That way you won't have to do this ugly javascript hacking :)

One idea could be to use a calculated column to search the other field for the prescence of your text string - then base the jQuery logic on that calcualted column.
However you mention a description field which is probably defined as "Multiple lines of Text" and these can't be used in calculated columns.
How about outputting the Description field but then using some jQuery to hide it from view with .hide()?
I can't give you the exact javascript to do this right now but if you need any inspiration then Christophe's blog is a great place to start.

From your question I understood that you could highlighted the row which comes a particular text (color) , but couldn't hide that column. In the blow code I have hided that column. You may need to change the column index.
<script>
$(document).ready(function(){ $Text = $("td .ms-vb2:contains('color')"); $Text.parent().css("background-color", "red");
var myelement = $Text.parent().parent();
$(myelement).find("td:nth-child(3)").hide();
$(myelement).find("th:nth-child(4)").hide();
});
</script>
Please let me know, is this helps you?