I have a ui grid that has 20 columns, and I would like to be able to tell what the next column will be as I scroll through the horizontal axis so that I can have some text that will tell the users what the names of all the columns they can't see are.
Anyone know if this is possible? As I watch the the inspector and scroll through the columns, I see html attributes changing.
---UPDATE 1----
This is what is all looks like (where it says "home #" is dynamic and will change to show the next column that is out of site)
Based on the ui-grid configuration that you use to render the grid, you already know the order of the columns. You can use this information together with the visible on each column added by the gird itself.
What you need to do is bind a event handler on scroll to iterate over the columns on each change and check the visibility of them. Then the first one with visible === false is the upcoming.
Here is a working Plunker where is used this flag.
Related
According to latest documentation, one can set the maximum number of grid columns form authors can create:
<property
as="xs:integer"
name="oxf.fb.grid.max-columns"
value="4"/>
Because of some constraints in our use of Orbeon, I set the maximum of columns to "1". However, when I open the Form Builder to create a new form, the default arrangement shows a grid of two columns and one row, one cell containing a text field.
Now, if I delete the second column, I can't add a new column again, in line with the property set. But the fact that you can leave the two columns annoys me.
Is there a way to make default controls use only one column when opening the Form Builder?
It's not possible to change this right now. Orbeon Forms 2017.2 will, in addition, have a 12-column layout, which means that oxf.fb.grid.max-columns will have no effect. I think that constraining a form to follow an n-column layout would be a new feature of the product.
User has options for selecting columns he/she wants to see(from a list of check boxes user can select) and they can also set priority for each column i.e which column should be displayed first,second and so on .How to make this happen .
Thanks
I have not tried this before. But I think what you can do is sort you columnDefs array in the the grid options dynamically. And then do queueRefresh()
I create a table dynamically from json data. I then allow the user to update certain elements in the table. Before the update the table looks as follows:
I inspect the element and it has the following:
Then after I update the table, the styles added to the input boxes and selects in the table are removed:
I would like to know, how would I add back these styles (i.e ui-select, ui-btn-inner etc) so that the tables dont lose their styling when I recreate the tables. I want to know how to add back the styles to the select, input and the colour of the "Update TextBooks".
just to shed some more light on the answer so that people understand everything 100%. I was always calling code that basically kept reconstructing the above table, as seen in the pictures above.
In order to keep adding the jQuery Mobile formatting and css to the table everytime one has to call the .trigger() method on the table. So for example I would dynamically create an a table based in the users values entered previously. For this solution lets say my table has an id of id = 'updatetable'.
Thus to fix the above problem simply use:
$("#updatetable').trigger('create');
after you have dynamically created the table.
I am using TDBGrid for the first time.
I didn't even notice the Columns property in the object inspector and everything went just fine: the grid was filled.
Then I saw the Columns property and tried it. When I use the object insector to add items to the Columns property of the grid, they do not all of them show up at run time. To me, it looks like the FieldName property is important. It looks like it is correct, but there are no values in some columns.
If I leave this property blank (no columns at all) it seems that the control populates it itself at run time and I do see all the columns. I could live with that. When I set column titles at run time it works, but setting column width does not.
[Update] Thanks for the feedback. I am learning slowly. Now I see what is happening. I wanted three of the five columns to be calculated. Two are gotten from INNER JOINs and the third from an SQL 'cast' of SELECT ... FROM_UNIXTIME(<table>.time_stamp).
If I do not define the columns at design time then these values are populated at run time when I execute my SELECT. Cnn anyone tell me how to set things up at design time? Thanks
There is no difference in functionality between runtime and designtime set up columns. That is: what can be done designtime can also be done runtime, and vice versa.
When te Columns property is kept empty, the grid fills it by default with all fields it finds in the linked dataset, once the dataset is opened. All column specific settings, such as alignment, width, title caption, etc... are set to default, based on the type, length and name of the corresponding field. This is the lazy way which sure could be sufficient.
You could deside to use your own setup or modification of the columns property, for one or more of the following reasons:
Change the order of the dataset fields in which they must appear in the grid,
Truncate the width of text fields (especially VarChar fields or Char fields with a large length normally result in colums that are too wide for normal presentation and/or user interaction),
Change the alignment of the fields (normally numeric fields are right aligned by default),
Hide one or more fields from the dataset,
Etc...
These own settings can be done desingtime as well as runtime.
Using the designtime columns editor is the preferred and RAD way in need of these customizations. Open the editor by double clicking the grid or the property, or via the grid's context menu. If the linked dataset is active then the command Add all fields is enabled, which does exactly the same as if you did not select any field at all, i.e. the default behaviour as described in the second paragraph.
The best way to define the columns on a dbGrid is to doubleclick the dataset in order to create variables that the form knows about (persistent fields). You can edit various properties of these variables such as DisplayLabel, DisplayWidth and DisplayFormat.
You can also add calculated fields by double clicking on the dialog box which appears when you double click on the client dataset.
If I have a a number of elements in one table column and I drag them one at a time to another column utilizing jQuery UI, how do I make remaining items in the first column move up, i.e. fill the gap left by the items that were moved. Assuming table cell valign="top".
I think it has to do something with DOM. It seems that even after I drag the item is it still in the same column.
You might want to use jquery ui's sortable instead.
http://jqueryui.com/demos/sortable/#connect-lists
You can connect lists and anything moved from one list will move the remaining elements to fill any gaps
However you are not giving us any code/markup to work with so I can only guess. Hope this helps!