Batch Editing - Row Validation

16 posts, 1 answers
  1. Geoff
    Geoff avatar
    53 posts
    Member since:
    Aug 2012

    Posted 20 Jun 2014 Link to this post

    Hi,
        I am looking for help with RadGrid Batch Editing. I have developed a solution that works fine as far as inputting data and saving to the DB goes but doesn't handle validation very well at all. I'm sure there are likely to be some good examples of what I would like to do but my searches fail to turn up anything, mainly because of the multitude of related articles.

    Currently, I have cell validation for those cells that need it but not row validation. There are some cells that are either mutually exclusive or inclusive, so I would like to do a validation check on these. At the moment I just discard invalid rows, which isn't very helpful to the poor user. My two problems are:

    1) I cannot see a way to preserve invalid rows on the grid after postback.

    2) I can create a list of validation errors but cannot figure out how to display these to the user. Everything I have tried executes OK but doesn't show up in either a label or popup message after postback.

    Below is a list of options, a solution for any one of these would be sufficient for me. My favourite solution is at the top but any one is acceptable.

    1) When the user presses the "Save Changes" button, check all rows and flag up the ones with validation problems. The whole grid remains as it was when the user pressed the "Save Changes" button (i.e. with all the edits stall flagged and outstanding).

    2) When the user presses the "Save Changes" button, each row is checked and saved if OK. The remainder are flagged up as having validation problems, which the user can then address and re-save once sorted.

    3) Discard the invalid rows as I am currently doing but notify the user via a popup message once the postback has completed.I would be grateful for any help
    with this problem.

    Regards

    Geoff
  2. Answer
    Konstantin Dikov
    Admin
    Konstantin Dikov avatar
    1803 posts

    Posted 24 Jun 2014 Link to this post

    Hi Geoff,

    Since there is no easy way for preserving the changes for rows with failed validation after postback, what I could suggest is that you handle the row validation entirely on client-side and allow the user to save only when the validation for all rows passes.

    For your convenience I am attaching a simple example demonstrating such client-side validation, where you could go through each row, get reference to any of the cells of that row and validate each value. This should be achieved in the client-side OnCommand event of the grid. If the validation fails for any row you could cancel the command, which will prevent the postback.

    Please give a try to the attached sample page and see if the same approach could be used for your requirement.


    Regards,
    Konstantin Dikov
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Geoff
    Geoff avatar
    53 posts
    Member since:
    Aug 2012

    Posted 25 Jun 2014 in reply to Konstantin Dikov Link to this post

    Konstantin,
        Many thanks for your reply, it looks as though your solution will do just what I need. It'll take me a couple of days to give it a try because I have some other things to sort out first.

    Thanks again.

    Geoff
  5. Geoff
    Geoff avatar
    53 posts
    Member since:
    Aug 2012

    Posted 26 Jun 2014 in reply to Konstantin Dikov Link to this post

    Konstantin,
        I managed to find time have a go with the example you sent me. I had to make one small change that is likely to be caused by us using an earlier version of Telerik's Dev Tools (Qtr 3 2013). I had to change "batchManager.getCellValue" to "batchManager._getSetCellValue" because the getCellValue method doesn't exist in our version.

    Apart from that the example worked great and I found it easy to integrate with my project. Now I can display errors/warnings and give the user the opportunity to sort things out before the Save Postback occurs.

    Thank you very much for making this easy for me.

    Regards

    Geoff
  6. Geoff
    Geoff avatar
    53 posts
    Member since:
    Aug 2012

    Posted 26 Jun 2014 in reply to Konstantin Dikov Link to this post

    Konstantin,
        I do have a question for you about the solution you provided. I understand that the following line will prevent the postback for the save operation. 
    args.set_cancel(true);

    but what does this line do?
    dataItems[i].get_element().className += " failedValidation";


    Regards

    Geoff
  7. Konstantin Dikov
    Admin
    Konstantin Dikov avatar
    1803 posts

    Posted 26 Jun 2014 Link to this post

    Hello Geoff,

    The second line demonstrates how you could add custom CSS class to the rows where the validation fails and apply some informative styles to those rows. As you could notice in the attached sample page, the CSS class failedValidation is changing the background of the row:
    <style type="text/css">
        .failedValidation {
            background: #ff6a00!important;
        }
    </style>

    If in your scenario you do not need to change the style of rows with failed validation you could remove those lines from the logic.


    Best Regards,
    Konstantin Dikov
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  8. Geoff
    Geoff avatar
    53 posts
    Member since:
    Aug 2012

    Posted 27 Jun 2014 in reply to Konstantin Dikov Link to this post

    Konstantin,
        Ah yes, I did not spot the style tags at the top of the page, I was too eager to get the rest of the code going. I have now included this in my project too. Looks good, thank you once again for your excellent support.

    Regards

    Geoff
  9. Brad
    Brad avatar
    22 posts
    Member since:
    Nov 2011

    Posted 16 Jul 2015 Link to this post

    Hi, I implemented this same solution and for the most part it works great.  However it seems to validate all of the rows and not just the rows that have been edited. I only want to validate the rows that were just typed, how would I go about doing this?  I tried changing masterTable.get_dataItems() to masterTable.get_editItems() but it always returns nothing.

    I also tried using the _extractChangesString but that doesn't appear to help me at all as it's for the whole table not just that row.

     

    Thank you

  10. Konstantin Dikov
    Admin
    Konstantin Dikov avatar
    1803 posts

    Posted 21 Jul 2015 Link to this post

    Hello Brad,

    In a real scenario, if you have validation for the edited rows, that validation should pass on the already existing rows, so I am not exactly sure why you need to validate only the updated items.

    Nevertheless, you can use the following modification that will validate only the edited rows:
    ....
     
    if (id > 3 && $telerik.$(dataItems[i].get_element()).find(".rgBatchChanged").length > 0) {
        dataItems[i].get_element().className += " failedValidation";
        validationFails = true;
    }
     
    ...

    Hope this helps.


    Regards,
    Konstantin Dikov
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  11. Brad
    Brad avatar
    22 posts
    Member since:
    Nov 2011

    Posted 08 Oct 2015 in reply to Konstantin Dikov Link to this post

    Thanks Konstantin. I implemented this and it has been in use for some time however we just discovered an issue with it, it only works the first time they hit save.  So if you have it flag a row as being required and abort the save the user can just hit save a second time and ​it will bypass the validation. It no longer sees this as a "new" row and does not validate it as it should.  Is there any way to do this while having it remember that this is an unsaved row?

    I have tried disabling the save button and then re-enabling it when a change is made.  However as I mentioned above there seems to be no way to compare the old value to the new value so I can't actually check that the proper field was updated before enabling the save button.  Currently the user can change another unrelated field and that will re-enable the save button.

    Also I'm not sure why you think this isn't a "real" scenario as it very much is. We have lines being prefilled for the user on a Timesheet grid but they do not have to be filled in, however if you do fill them in you are required to meet a certain criteria.  The prefilled rows almost never have all the required values but if you are not adding time against them it does not matter, it's only when you enter time against them that you have to ensure that the time code, job code, etc are all entered.

     

    Thank you

  12. Konstantin Dikov
    Admin
    Konstantin Dikov avatar
    1803 posts

    Posted 13 Oct 2015 Link to this post

    Hi Brad,

    I have tested the example that I have attached in one of my previous posts with the modification from the last one and I am not able to observe such issue and the validation works on each "Save Changes" click, because each click will fire the client-side OnCommand event of the grid, where the validation is performed. 

    Can you please try to modify the example in question, so it could replicate the issue that you are facing?

    I am looking forward to your reply.


    Regards,
    Konstantin Dikov
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  13. Jeremy Yoder
    Jeremy Yoder avatar
    131 posts
    Member since:
    Dec 2009

    Posted 18 Mar in reply to Konstantin Dikov Link to this post

     

    I really like the code solution given in the 2nd post here, by highlighting problematic rows. But as you can see from my screenshot, when I select a row that was flagged as an error, the highlight color is in the bottom part of the row, whereas the error color (from the failedValidation class) is the top part of the row. This is because I have <Selecting AllowRowSelect="True" />

    How can I get around this?

    Btw, the Skin on my grid, for this screenshot, is Office2010Blue.

     

  14. Konstantin Dikov
    Admin
    Konstantin Dikov avatar
    1803 posts

    Posted 22 Mar Link to this post

    Hi Jeremy,

    For applying the custom background of the problematic rows over a selected item you could include the following in the CSS, which will add the same background color to the TD elements as well:
    <style type="text/css">
        .failedValidation, .failedValidation td {
            background: #ff6a00!important;
        }
    </style>

    Hope this helps.


    Regards,
    Konstantin Dikov
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
  15. Jeremy Yoder
    Jeremy Yoder avatar
    131 posts
    Member since:
    Dec 2009

    Posted 22 Mar in reply to Konstantin Dikov Link to this post

    Perfect! Thanks!
  16. Dan
    Dan avatar
    30 posts
    Member since:
    Oct 2013

    Posted 31 Aug in reply to Konstantin Dikov Link to this post

    Hi,  The code provided by @Konstantin may be the beginning of my solution.
    I have a RadGrid (Telerik.web.UI v. 2015.2.623.45) which utilizes Batch Editing.

    I validate one of the fields utilizing a Server/Database Query which  I plan to implement with an ajax call imbedded in the JavaScript provided.  

    Since this is somewhat costly, Is there a way to identify which rows have been edited (for "Insert" or "Update") as my data size is relatively large and I don't want to validate rows that have not been edited.

  17. Eyup
    Admin
    Eyup avatar
    3015 posts

    Posted 06 Sep Link to this post

    Hello Dan,

    Generally, you can use the hasChanges method to determine whether the user has made any changes:
    http://demos.telerik.com/aspnet-ajax/grid/examples/data-binding/client-side/client-data-source-binding/defaultcs.aspx

    You can use the following approach to achieve this requirement:
    1. Use the following event handler:
    http://docs.telerik.com/devtools/aspnet-ajax/controls/grid/client-side-programming/events/onbatcheditcellvaluechanging
    2. Get a reference to the row using the arguments.
    3. Extract the unique record ID:
    http://docs.telerik.com/devtools/aspnet-ajax/controls/grid/rows/accessing-cells-and-rows#accessing-cells-and-values-in-client-side-code
    4. Execute your custom validation logic.
    5. Depending on the result, you can cancel the modification using the args.set_cancel(true) method.

    I hope this will prove helpful.

    Regards,
    Eyup
    Telerik by Progress
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017