I have to create a grid which allows sorting and filtering. Currently I am able to achive this by binding PagedCollectionView of the data. I would like allow user to insert or delete row from the grid with context menu. User can select a row and right click on the context menu and insert or delete a row. I can delete the current row, but adding row got me stumped. When I insert a new row and since I do not know any values, I insert a blank row and that end up coming at the end of the grid.
One solution I am working on is to copy the previous row of the gird and using converter, if the row is dirty display blank.
Just curious, is there a better way of inserting row at current place in a grid while keeping sorting and filtering in place?
Thanks,
Just in case anyone is interested, what I ended up doing is insert the row in the grid manually with out paged collection view to keep the sorting and in the code behind insert a dummy row.
Related
Just started using Ant, have been loving it so far. I have a working ant table and add row button, however when a row is added, it is added at the end of all rows since its ID is incremented from the last ID in the table. I am working with less than a 1,000 items.
Is there common logic or a property I can change to make adding a new row visible at the beginning by default? This way a user can visibly confirm that their actions succeeded.
Some ideas around this are:
Add a date created field and have it hidden by default, but sort by newest date
Figure out a way to make the ID column invisible and display the largest ID first..this not scalable when using GUIDs which I would prefer :(
Temporarily render the newly added row data in a special container in the table? No idea on how to go about trying this.
I am new to Angular and I am now learning about directives.
I have created a directive that will create a table.
You can sort the table by clicking on the header arrows.
You can also edit/delete a row by clicking on the action button.
The problem with my table is that when the rows are sorted by some column,
and I edit an item under that column, the table resorts because of the changed data. Thus my currently editting item moves to another row and the current input fields contain a different one.
For example, if I sorted the table by visits, and then I edit a visit data in a row,
changes to :
How can I maintain the current order of the rows during edit,
and only allow resort when I click on the apply button (check) ?
You can copy the model which will be edited during editing. And in your save function, update the actual model in table list.
Is it possible to enter listview data by row instead of by cell? I would like to be able to pull data out of the listview by row using an index rather than having to create a ton of statements to pull out the data by cell, it would be easier this way.
I am aware of what a RowExpander plugin is for a Grid, where each row in a Grid expands to show it's childs or related store data. My requirement is a bit different.
I need multiple Grids on a page. Each Grid is loaded with data from different backend DB tables TB1, TB2, TB3.
However, each of the backend DB tables have a one to many relationship with each other. That is, each row in TB1 has multiple rows in TB2. One row in TB2 has multiple rows in TB3.
Now, I need one grid for each of these tables on UI. And then if I select a particular row in the first Grid ( relavant to TB1 ), I should populate the second grid with the relavant records from TB2. And then if I select a row in the grid corresponding to TB2, I should populate third grid with all the records relavant to the row selected from TB3.
I hope I am clear. Could you please help me with any sample code that you might have?
Subscribe to select (http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.grid.Panel-event-select) event of the TB1 and then filter store associated TB2 with whatever filter criteria you need - this way second grid will be automatically filtered to the records you need to show.
My screen has two drop downs, and a grid. i basically do an ajax call and populate the grid based on the value from the first drop down. Now when i select the second drop down i want to hide few rows that i have populated previoulsy based on the value in the second drop down
taskFromGrid.getStore().filter('TASK_OWNER_ID', record.get("PERSON_ID"));
i used filter and it worjke for me