How to change width from a Table row with rowClass/rowStyle

[sbsbb]

Is it possible to use the rowclass / rowStyle to define the column width, without having to change css on the file system ? (no application css)

<view isSticky="False" isVisible="true" onunloadCancelJobs="true" template="dashboard.html">
  <label>test_entlarge_table_column</label>

  <module name="AccountBar" layoutPanel="appHeader" />

  <module name="AppBar" layoutPanel="appHeader" />

  <module name="SideviewUtils" layoutPanel="appHeader" />

  <module name="Message" layoutPanel="messaging">
    <param name="filter">*</param>
    <param name="maxSize">2</param>
    <param name="clearOnJobDispatch">False</param>
  </module>

  <module name="HTML" layoutPanel="viewHeader" autoRun="True">
    <param name="html"><![CDATA[
<style type="text/css">

.Table table td:nth-child(1) {
  width:100px;
}
.Table table td:nth-child(2) {
  width:200px;
}
</style>
]]></param>

    <module name="Search" layoutPanel="panel_row1_col1">
      <param name="search"><![CDATA[
* | head 10 | table *

]]></param>
      <param name="earliest">-5m@m</param>
      <param name="latest">@m</param>

      <module name="Table" />
    </module>
  </module>
</view>

[sideview · Accepted solution]

1) You can use the Sideview HTML module to embed custom CSS into the page fairly easily.

Depending on exactly how you want to set the widths, using an HTML module to include embedded CSS may work just fine.

<style type="text/css">

.Table table td:nth-child(1) {
  width:100px;
}
.Table table td:nth-child(2) {
  width:200px;
}
</style>

To more cleanly apply the CSS to one or more specific Tables on the page, you can use the 'cssClass" param, and then incorporate the className(s) into your CSS rules as necessary.

It's inelegant to use HTML to embed CSS but if you have no other way of getting CSS in there, it'll work just fine.

2) Beyond that, I can put a pretty easy change into the Table module where the <th> nodes have classnames like "columnFor", where nonalphanumeric values in the fieldname value are cleaned up. The classnames wouldn't be used very often, but they could come in handy in certain cases, and in simple cases like this one it would have better browser support than the nth-child selector trick above.

3) Beyond that, I have tinkered with new functionality to implement basically an analogue of rowClass/rowStyle, that would allow you to apply custom CSS to columns and cells.

What happened instead is that I implemented the "Embedding" feature of the Table module, which is far more powerful, and which automatically took care of big swaths of "custom icon", and "put a button into this cell" use cases. With that plus the abilities advanced Sideview users have with CustomBehavior, the custom-cell-rendering feature set hasn't been in as much demand as I thought.

[sideview]

The CSS now posted in your description seems to work fine for me. However tables in HTML are not absolutely beholden to CSS width declarations. If they have any words with no spaces (or a handful of other special breaking chars like commas), then they will not allow that text to break even if it then exceeds the minimum specified width. Also if the overall Table is 100% width and the explicit widths given are less than actual width, it'll share the extra space among them. You might give one cell "100%" width, which will give that cell all the extra width and shrink-wrap the others.

[sbsbb]

I've tried this, but it is not working, maby I've not implemented properly... See code in Description.
Most of the time I need this because of the _time field, that is displayed on 2 lines...