Hello Outsystems community!
This post and the question is because there is NO example that I could come across, neither in the forge nor in the documentation and not even Google! that could help me add columns to an Outsystems Datagrid via a JS node. Well when I say NO example, I categorically mean an example that clearly states all the options while defining a column, especially two specific ones,
#1: Type of column
#2 Column configuration object
the JS object for Outsystems doesnt seem to work as expected, the Wijmo object too doesnt seem to work as expected and there is ZERO guidance available
----------------------FYI---------------------
What works is (I have taken the out of box user entity to bind the grid via a data action)
var provider = GridAPI.GridManager.GetActiveGrid().provider;
var column = new wijmo.grid.Column({ header: "Username", binding: "User.Username"});
provider.columns.push(column);
-----------But----------------
Anything to do with column type and column options configuration and boom.....it gives all sort of errors on JavaScript console, I'm thinking this is most likely due to the lifecycle events and the binding and column creation sequence but cannot say for sure
I would sincerely appreciate some help here since I'm running dry on the solution.. outa gas and fried..!!
Hello @ARS
All the supported offer in OutSystems Data Grid is available through the low code blocks and client actions that are available on the module and where most of the use cases are documented and/or showcased here.
Underneath and by design, what we created was a way to allow our developers to achieve use cases that we don't offer out of the box (and based on the analysis they might never be offered directly since they're not relevant enough from a product standpoint - we will never have 100% of the features available in low code) by offering allowing access through our javascript API to access the Wijmo objects to achieve those use cases. This path will not be documented because is an extensibility point (the code will be written by the consumer so we can't control it) and our reference will always be Wijmo's Flexgrid documentation since they're our provider. We already have tons of use cases solved by the community using this approach without major issues so, if you could explain a bit better what's the use case you want to achieve and where you're struggling, together with a sample OML we can try to take a look and provide some guidelines focused on the resolution of that use case.
Cheers,GM
Thanks for your quick response @Gonçalo Martins
Simply put, what I need is dynamic columns addition using low code and it would be great if you can point me to the low code blocks and client actions that specifically facilitate this.
One may ask, why dynamic columns? Answer: Not everything in life is static! Life is dynamic and so should be my grid. E.g. 1 screen 1 grid 2 data sources - Users and Role entity
Based on user selection (what he/ she wants to see on screen), I need to bind either the user/ role data to the grid (which is already achieved)
And then, not go the auto columns route but to create columns dynamically and add to the grid. This is required because it allows the developer exclusive control over the column rendering and not leaving it upto the black-box magic of Outsystems Datagrid auto columns feature (which is appreciable otherwise but doesnt fit my current requirement)
Now, if we cannot achieve this the low-code way, since Outsystems has enabled us by providing such a wonderful control, I can only request Outsystems Team to help me with an example of doing it the correct way using JS since I've exhausted all my options.
May be I'm missing something but at this point I'm so frustrated of not being able to programmatically do the same things that I can do it at design time (low-code way) that I'm on the verge of giving up on the datagrid control
Can you share an oml with what you've tried so far so that we can have a common starting point? And by dynamic columns, you mean some column that is already present on your data source?
Can you share a sample made with Wijmo FlexGrid to show that this can be done and how? This should always be the starting point.
Yes, you are correct! @Gonçalo Martins
Data source has all the required columns. I just need to display only columns of my choice and hence the manual addition of columns instead of auto columns feature
Attached oml does this in an auto columns way. I need to implement manual columns by defining the header, binding, and column configurations based on column type i.e.
Just as we do it in our design time canvas, how to specify all the column configurations at runtime and add the required columns
@Gonçalo Martins our very conversation led me to the solution! I should thank you for your responses as it let me explore more. Now, I'm able to create different columns at runtime. However, there are two issues that remain unsolved. It would be great if you can share some perspective
Issue #1: Dates being rendered in ISO formats as Text columns. How to deal with this situation and achieve a straightforward binding. Is there an implicit way of converting datatype by forcing it using underlying Structure? Haven't tried this yet but I'm open to options :)
Issue #2: Creating action columns dynamically. This is still a blocker as I'm trying to figure out how I can place different HTML elements via the cell template option and make it behave the same like it would, if I place a action column at design time. Again, I'm exploring options but no luck as yet :(
Hi @ARS ,
Could you share the OML of what you achieved so far so we can assist you better with this other questions based on the solution you implemented?
Thank you,
Giuliana.
Sure @Giuliana Silva just allow me some time and I shall upload the updated oml
Hi @ARS. Any update on this topic?