I have a table which represents data from a query. I added edit and delete buttons for each row in my table and also added checkbox for edit and delete along with hidden checkboxes that in the above table.
I also want to do some actions with these buttons. When a user clicks the edit button in each table row, it will trigger that checkbox also that change the button turns green.
Thank you for your time!
You didn't ask a question! Where are you stuck?
I have done UI part but I don't know how to write script for edit and delete buttons for each row in a table.
I want script for this action with these buttons. When a user clicks the edit button in each table row, it will trigger that checkbox also that change the button turns green.
You use the system.db functions to script the updates to your table. You probably just need,
I don't know what you're doing with hidden checkboxes but I would be quite sure that you don't need them.
I have a table. I added edit and delete buttons for each row in my table and also added checkbox for edit and delete in the above table
I also want to do some actions with these buttons. When a user clicks the edit button in each table row, it will trigger that checkbox also that change the button turns green.
I have to write a script on the onClick event of our buttons in a table. write a logic for trigger that checkbox on clicking I will get the value 0 to 1 on trigger that checkbox.
I added edit and delete buttons for each row in my table ...
That is standard practice for delete. For edit it is normal to edit in the cell or open a popup to edit a whole record (row).
... and also added checkbox for edit and delete in the above table.
That is not standard practice, unnecessary and confusing to users.
When a user clicks the edit button in each table row, it will trigger that checkbox also that change the button turns green.
I have to write a script on theonClickevent of our buttons in a table. write a logic for trigger that checkbox on clicking I will get the value 0 to 1 on trigger that checkbox.
Don't do any of that.
For editing, either:
column.x.editable : true orFor deleting,
In this view i have added Edit button and checkbox but I hidden that checkbox I want to do some actions with this button. When a user clicks the edit button it will trigger that checkbox also that change the button turns green.
I have to write a script on the onClick event of our button. write a logic for trigger that checkbox on clicking I will change the value 0 to 1 on trigger that checkbox.
You already said all of that in post #5.
I prefer having buttons on the side, like this:
It avoids polluting the data in the table, and it's easier to implement.
Then you can just use the table's .props.selection property to do whatever you want.
If the data comes from a database, remember to have the id in an invisible column.
This particular one opens a popup when clicking on the 'add' and 'edit' button, then sends the data back to the table through messages.
The delete one also opens a confirmation popup.
I do use a variant on this where you can edit the table directly by clicking in the cells, with 4 buttons to add/delete rows and columns, then a save and a cancel buttons to save the whole thing at once, but I find it's usually less user-friendly.
Hey pascal, can you please guide how you have added those button and functionality. A Kind request!
Implement the add/delete/edit logic on the table's scripts (either directly in message handlers, or you put them in the component's methods and have the message handlers call those methods.)
Then, have the buttons open popups. Each popup will have the necessary form components to gather the data you need.
For example, if you have a table like the default ones with cities, their respective countries, and the population, you'll need a field for each. Maybe the country is already in another table and you want to selected it with a dropdown, maybe it's not and you just want a simple text input field... That's for you to decide.
Then have a button to validate the new record. This button will gather the data from the input components, format it however necessary, and pass it to system.util.sendMessage as its payload.
Now, you have a table that manages its own operations, and popups that can ask it to perform those operations through message handlers.
I suggest passing the messages names as parameters to the popup, so the popup never needs to know exactly what it's used for.
In some cases (delete comfirmation for example) it will allow you to reuse the same popup for every confirmation you'll need.
In the specific case of the screenshot I showed, I believe the data source was a database.
So the table's methods would pretty much just grab the data received in the payload of the message, maybe make some validity checks on it, then pass it to named queries that would insert/delete/update one or several tables, then use refreshBinding to refresh the data.
I don't think the refresh button you see in the screenshot has any actual use.
Thank you pascal, Will try the same
