I need to delete/remove rows client-side and track changes. I'm using 2013.2
How can I track added/modified/deleted rows when the page is posted back? How can I delete rows client-side?
I have bound records to the grid, and I am able to add/edit records and their changes are reflected in the grid. I have batching turned on since I don't want a postback on every action. I just want to be able to add/edit/delete client-side, and then save the entire page on a single postback without having to handle rowAdding, rowAdded, rowDeleting, rowDeleted, etc... I just want my one single save method called from the Save button's click.
Since the WebDataGrid apparently cannot track the changes, I had to add a hidden column called DataStatus and on each action, describe what was done "Added", "Modified", "Deleted". The old UltraWebGrid had a DataChangedStatus on each row so you could process it correctly. Now it seems like the Akido controls want you to wire everything up and have 50+ postbacks per page. If there's a way to track changes without handling those rowAdding, etc... events (which aren't feasible anyway), then I'd love to hear it.
I've also tried removing rows, but nothing removes them client-side and I've seen where people are hiding them using css, which breaks the css for alternating rows. How can I remove/delete a row client-side without a postback?
Hi revbones,The WebDataGrid does not presently have the feature to track changes. For this I am doing research and development to arrive at a work-around. We have a private support case open for you on this and I will follow-up with you on the private support case as to the progress of my work.
In the interim, Infragistics invites you to submit the feature for tracking changes as a new product idea for the WebDataGrid. To suggest a new product idea you can do so by navigating to http://ideas.infragistics.com The steps are easy to do:
1. Create a new UserVoice account and log in to the Infragistics Product Ideas site at http://ideas.infragistics.com.
2. Navigate to the product / platform channel of your choice (e.g. WPF, Windows Forms, ASP.NET, HTML5 / Ignite UI, iOS / NucliOS, etc.)
3. Review the feature suggestions already posted by the community.
4. Vote for the features you’d like to see added to the product.
5. If the feature you’re looking for has not been posted, you can add your own product idea. Make sure to be specific and provide as much detail as possible. Explain the context in which a feature would be used, why it is needed, why it can’t be accomplished today, and who would benefit from it. You can even add screenshots to build a stronger case. Remember that for your suggestion to be successful, you need other members of the community to vote for it. Be convincing!
With this system, you are in the driver’s seat by submitting your product ideas. You can even track the progress of your ideas at any time, see how many votes it got, read comments from other developers in the community, and see if someone from the product team has additional questions for you.
For your inquiry pertaining to deleting rows client-side as it relates to Alternate Row Styles, this has been addressed for you on another forum thread: http://ko.infragistics.com/community/forums/t/88378.aspx
Please let me know if you need any additional assistance regarding this matter.
Hi revbones,
Please let me know if you need any additional details regarding this.
In order to get the functionality I needed, I created some wrappers for the WebDataGrid and its JavaScript. If I can easily rip it out and genericize it a little more, I'll include the wrappers in the forum. Until then, here are the basic steps and functions.
function populateGridFromForm() {
if (attributeId) {
var row = attributeGrid.get_rows().get_rowFromKey(new Array(attributeId));
if (row.get_cellByColumnKey('DataStatus').get_value() !== 'Added') {
row.get_cellByColumnKey('DataStatus').set_value('Modified'); }
row.get_cellByColumnKey('Element').set_value($('#' + _ElementTxtId).val());
row.get_cellByColumnKey('Description').set_value(attributeEditor.getText());
}
else {
var row = new Array('Added', $('#' + _SubHeaderTxtId).val(), $('#' + _ElementTxtId).val(), attributeEditor.getText(), '','');
attributeGrid.get_rows().add(row);
refreshGridStyle();
return false;
function removeRow(id) {
var row = grid.get_rows().get_rowFromKey(new Array(id));
row.get_cellByColumnKey('DataStatus').set_value('Deleted');
$(row._element).css('display', 'none');
function refreshGridStyle() {
$(grid.get_element()).find('tr').removeClass('igg_IGAlt');
$(grid.get_element()).find('tbody').children('tr:visible:even').addClass('igg_IGAlt');
SERVER SIDE
'Updates
Dim updatedAttributes = From r As GridRecord In grid.Rows Where r.Items.FindItemByKey("DataStatus").Value = "Modified" Select r
'Adds
Dim addedAttributes = From r As GridRecord In grid.Rows Where r.Items.FindItemByKey("DataStatus").Value = "Added" Select r
'Deletes
Dim deletedAttributes = From r As GridRecord In grid.Rows Where r.Items.FindItemByKey("DataStatus").Value = "Deleted" Select r
Thank you for sharing your solution with the Infragistics Community!