Reusuable Grids

[James-S]

I know this may come across as "what?", "huh?" :)

Does anyone know a practical way to create a generic grid (preferable the same default look as Profound UI)? We would like to create a single grid that can be put on any browser either as a tab or HTML container panel. I understand their is an API to do that but we are needing it to be shown on an browser that may not be using the Profound HTTP server.

We have discussed the possibility of using Universal File Display to generate the HTTP coding and then called by JavaScript API call and just post that to the screen.

I understand if this is confusing. Reply with questions and hopefully I can give better detail.

Thoughts, ideas?

[Scott Klement]

You want to have one grid that shows up with completely different columns depending on some criteria.

Off the top of my head, I'm thinking of a situation where the user can type any SQL SELECT statement they wish, and it creates a grid with the particular columns, of that statement. Since they can type any statement they wish, it'd need to be able to adapt to whatever statement was typed.

Is that what you are referring to? Can you give an example of your use case?

[James-S]

Hi Scott.

Not thinking dynamic SQL for this but that is an interesting idea! :)

Maybe a better explanation is if our enterprise had thoughts of standardizing on a universal look and feel to data presentation across browsers. These browsers may be accessing a combination of HTTP servers including Profound UI and "non" Profound UI servers. I have been asked about the Profound framework and if the look and feel of the Profound grids are inherent to the Profound framework or something more generic?

[Scott Klement]

They were created by the Profound Logic team for Profound UI, but of course, there's nothing stopping you from creating the same look in another environment.

[SrinivasSiripuram]

Hi,

I am trying to do profound grid styling, when i am trying to do below three settings through java script some how its not applying(but other settings are working fine when i apply through js), when i am trying to do inline grid setting also its woring fine.

Below are the setting which are not working:
getObj("MyGrid").grid.setProperty("has header", true); //Not applying
getObj("MyGrid").grid.setProperty("starting row", 5); //Not applying
getObj("MyGrid").grid.setNumberOfRows(8);//applying some times

Can you please someone help how i can apply these settings throuhg javascript code, i have many grids with same header rows so i want to make it generic instead of doing setting for each grid separately.

[Scott Klement]

Srinivas,

The grid properties are just settings. When the grid is drawn, it reads these settings to determine how to draw it. Once it has already drawn the grid, changing those settings will have no effect (unless you also tell it to re-draw the grid).

You can do that by calling the 'render' API of the grid.

Code: Select all

var myGrid = getObj("MyGrid");
myGrid.grid.setProperty("has header", "true");
myGrid.grid.setNumberOfRows(8);
myGrid.grid.render();

I'm not sure that "starting row" would be helpful to change in any case, as that's part of Genie's auto-subfile-detect feature, and there's no way that I'm aware of to re-run the auto-detect. But, you can try it.

[SrinivasSiripuram]

Thank you so much Scott for the quick reply.
I am fallowed the same way what you suggested,but when i am setting header row to true, its replacing the first row of my grid, even though i am setting the number of rows including my header row, can you please help me how can resolve this.

Below is the sample code which i wrote:

var myGrid = getObj("CustomGrid");
myGrid.grid.setProperty("has header", "true");
myGrid.grid.setNumberOfRows(8);
//myGrid.grid.setProperty("starting row", 5);
myGrid.grid.setProperty("has header", true);
myGrid.grid.setProperty("header height", "30px");
myGrid.grid.removeColumn(0);
myGrid.grid.setProperty("column headings", "Environment,Description");
myGrid.grid.setProperty("row height", "28px");
myGrid.grid.setProperty("scrollbar", "scrolling");
myGrid.grid.setProperty("top", "40px");
myGrid.grid.setProperty("left", "12px");
myGrid.grid.render();

[Scott Klement]

Yes, that is the way header rows work... they are considered one of the rows in the grid. Can you explain why this is a problem?

[SrinivasSiripuram]

Hi Scott, after setting the header property true, its replacing the first row, but first row content is not moving to the second row, i mean first row is completely missing, grid data is showing from the second row, as i mentioned in the previous post even even though i am setting my number of rows including my header row (Ex: if i have 7 data rows, i am setting number of rows to 8), still my first row is missing. Please suggest.

[SrinivasSiripuram]

Hi,

Can some one please help how to resolve this.

After setting the header property true for my grid, its replacing the first row, but first row content is not moving to the second row, i mean first row is completely missing, grid data is showing from the second row, even though i am setting the number of rows including my header row.

I am using the fallowing code, please suggest.

var myGrid = getObj("CustomGrid");
myGrid.grid.setProperty("has header", true);
myGrid.grid.setNumberOfRows(8);
myGrid.grid.setProperty("header height", "30px");
myGrid.grid.removeColumn(0);
myGrid.grid.setProperty("column headings", "ColumnName1,ColumnName2");
myGrid.grid.setProperty("row height", "28px");
myGrid.grid.setProperty("scrollbar", "scrolling");
myGrid.grid.setProperty("top", "40px");
myGrid.grid.setProperty("left", "12px");
myGrid.grid.render();