Batch Editing - Cascading Lists

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

    Posted 28 Jul 2014 Link to this post

    Hi,
        I would like to create a batch edit grid where the first two columns are a pair of cascading combo boxes (actually the first column needs to be a combo, the next column can be a combo or just a dropdown list). I've had a few experimental attempts so far but have not been able to get anything to work properly. Before I go any further, I would like to ask what is the best way to tackle this problem?

    The application I'm trying to write is a timesheet module. The idea is that at the end of the week, the user will enter a row on their timesheet for each job (selected from the combo box) they worked on. Then they will select a task (each job is broken down into a number of tasks) from the next combo/dropdown. Then in the next seven columns, they will enter the number of hours worked on that job/task against each day.

    The list of jobs and their related tasks is being queried from a SQL database and I've tended to use asp:SqlDataSource controls to supply the data to the page. I'm OK with batch editing generally but the cascading lists has me stumped so any help would be much appreciated.

    Regards Geoff
  2. Answer
    Angel Petrov
    Admin
    Angel Petrov avatar
    1026 posts

    Posted 31 Jul 2014 Link to this post

    Hi Geoff,

    When implementing related drop downs in a batch editing grid one should populate the secondary combo using client-side binding. This is needed because if a postback occurs while the user edits the data its changes will be lost. That said you can populate the related combo by calling a web service or executing a callback.

    In attachments you can find a sample website that follows the second suggestion and populates the RadComboBox by subscribing to its OnItemsRequested event. Note that in the concrete example uses dummy data but the logic can be modified in such a manner so that a SQL database is used.

    Regards,
    Angel Petrov
    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. Geoff
    Geoff avatar
    53 posts
    Member since:
    Aug 2012

    Posted 31 Jul 2014 in reply to Angel Petrov Link to this post

    Angel,
        Thank you for your prompt response and code sample. It will take me a couple of days before I get around to trying it out, then I'll post a response.

    Regards

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

    Posted 01 Aug 2014 in reply to Angel Petrov Link to this post

    Angel,
        I got your sample running great and figured out (mostly) how it all works. I then adapted it to our needs and it works great. I added an "OnClientDropDownClosed" event to the first dropdown so that when the user changes the selection, it clears the text displayed where the second dropdown appears (as this has now become invalid).

    Thank you very much for your help.

    Regards

    Geoff
  5. Rayne
    Rayne avatar
    254 posts
    Member since:
    Sep 2010

    Posted 28 Apr Link to this post

    I implemented the suggested method to cascade as well as clearing the value in box 2 when drop down of box 1 closes. Works beautifully. But...

    it only works if your EditType is Cell. How do I get all this to work if I'm using EditType = Row?

  6. Marin Bratanov
    Admin
    Marin Bratanov avatar
    3823 posts

    Posted 03 May Link to this post

    Hello Rayne,

    I can suggest you look into using the OnBatchEditOpened event to relate combos, access cells from various columns and modify controls as per your logic: http://docs.telerik.com/devtools/aspnet-ajax/controls/grid/client-side-programming/events/onbatcheditopened.

    Regards,

    Marin Bratanov
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  7. Rayne
    Rayne avatar
    254 posts
    Member since:
    Sep 2010

    Posted 03 May in reply to Marin Bratanov Link to this post

    I have looked into all the Batch Edit client events and none of them work for what I need when I have EditType set to Row. The events are triggered when the row goes into edit mode, but at that point the user hasn't chosen a value for the first comboBox. And none of the events are triggered when you move from one column to the next if the whole row is in edit mode.

    So basically I can't seem to do cascading comboBoxes when I put the entire row in edit mode. it only works if you put an individual cell in edit mode.

  8. Rayne
    Rayne avatar
    254 posts
    Member since:
    Sep 2010

    Posted 03 May Link to this post

    I finally got it working, but modifying the provided code. For anyone else needing this:

    After I get the row, instead of calling get_cell, I used the following code to get the value of the first comboBox. I also used this method to clear the value of box 2 when the value in box 1 changes.

    var combo = $telerik.findControl(row, "AnalyteComboBox");
    var value = combo.get_text();
Back to Top