How can I set the background-color of an entire row (not just cell) using the custom formatter?
The custom formatters are used for formatting the cell's data (= text). As far as I know they don't know about the actual cell (meaning a jquery object) but only of it's value.
But usually jqGrid assigns IDs to all rows so setting the background color if you know the rows ID should be only a matter of setting the background color of all td child elements of this row.
$(rowid).children("td").css('background-color', "#5E5E5E");
Related
A selection on page and are used to filter the items in a table.
the table displays like this:
Here we can see the item's color is gray-dark every other row.
if I modify some of them(I modified two gray items):
and using the selection to show the modified ones:
the rows of the table are all gray, not gray-dark...
I guess this is because ng-show hides the other rows but not reload the css(I use ng-class-odd to draw the table rows color)
Are there any good ideas to let the filtered items displays gray-dark every other row?
Use ng-if instead of ng-show.
Then the rows won't be included in the DOM, and the CSS selector of odd/even will work.
I am using ng-grid and would like to omit cells in some of the rows, creating table colspan effect.I tried with simply not defining those cells, however they end up empty in the grid, and the border is visible.Is it actually possible to create colspan effect with ng-grid? So that border is not visible for not defined cells ?
I am trying to change the default document settings for a batch of InDesign documents – that is, the styles, swatches etc. that are 'active' (marked blue) in an open document with nothing selected.
But I have a hard time figuring out how to change the default cell style.
Stroke swatch, Paragraph style and Character style are simple:
app.activeDocument.pageItemDefaults.strokeColor = "Black";
app.activeDocument.textDefaults.appliedParagraphStyle = app.activeDocument.paragraphStyles.item ("[Basic Paragraph]");
app.activeDocument.textDefaults.appliedCharacterStyle = app.activeDocument.characterStyles.item ("[None]");
Cell style, however, is not so easily accessed, even though it is really just a simple mouse-click for a user. There is no 'appliedCellStyle' property.
How can I do this?
I think defalut cell style is "None", though selected other cell style in GUI
if you want apply default cell style as "None", there are no need to do.
when create a table without applying table style, the cells are always applyied 'None'.
please try this code.
var table = app.activeDocument.textFrames.add().tables.add();
alert(table.cells.firstItem().appliedCellStyle.name);
thank you
mg
I am using HTML tables to show my data in tabular form. I know that the
Default behavior of td elements in a table is that they change their width and height in order to accommodate the text inside it i.e. like that shown in figure (A)
Is it possible that I some how achieve the effect as shown in figure (b) , i.e. I would like to modify the td elements using CSS in such a way that it gets the shape as that in Figure (b) i.e. maintain it's width and height but makes the text inside itself overlay the sibling td elements?
PS: Have tried fixing the width and height plus using the overflow property of CSS but that didn't work.
NOTE
I don't want to use the colspan property, i.e. I still want the sibling td to be there (of course, they won't have any content inside them).
The reason Why I want to achieve this is I'm using jQuery plugin Datatable and this doesn't work with the table having tds that are using colspan property
Finally, using #teemu suggestion, i.e.
Using an absolutely positioned extra element into td
How would I go about setting the background colour of an Ext JS Grid row, mainly just the selected item(s).
Any help would be greatly appreciated.
To change the selected row color you have to override the appropriate CSS class:
.x-grid3-row-selected {
background-color: red !important;
}
You could also override the default border-color if you want using that class.
The getRowClass function, on the other hand, is for adding a static CSS class to rows using business logic to determine which rows are affected. You could also achieve row coloring that way, but it would not affect highlighted row color (although you could also write CSS that used both classes together to do so).
EDIT: To change the row style programmatically you will still want to define your styles statically in CSS, then simply add/remove CSS classes dynamically as needed. E.g., assuming a grid and a button with id 'my-btn', clicking the button will add a class (could be defined just like .x-grid3-row-selected as shown above) to the first row in the grid, applying whatever style is in the CSS class. It's up to you to define your real business logic for selecting row(s), but this is the syntax:
Ext.get('my-btn').on('click', function(){
Ext.fly(myGrid.getView().getRow(0)).addClass('error');
});
#bmoeskau This thing you gave does not work with me.
I rather use
grid.getView().addRowClass(rowIndex, 'red');
inside the onDoubleClick function.