Update Id and Name of DropDownList

6 posts, 1 answers
  1. Abderrahmane
    Abderrahmane avatar
    3 posts
    Member since:
    Sep 2014

    Posted 26 Sep Link to this post

    Hello,

    I'm using Kendo UI MVC to generate a dynamic form. 

    User fill the form with Name and Las name. And I have a button that adds a template with two DropDownList with cascading behavior.

    Each time user clicks on the add button, a couple of DropDownLists is added using template. Everything works fine.

    The name and id of those ddl is Articles[0].Name and Articles[0].Quantity each time I add I increment the number between bracket.

    The problem is when the user wants to delete one couple of ddl, I find my self with not continuous ids :

    Initial :

    Articles[0].Name, Articles[0].Quantity

    Articles[1].Name, Articles[1].Quantity

    Articles[2].Name, Articles[2].Quantity

    When user deletes the second one I have :

    Articles[0].Name, Articles[0].Quantity
    Articles[2].Name, Articles[2].Quantity

    This don't work because the mode binder in my action controller will stop at 0 if he doesn't find the index 1.

    I tried updating the inputs with jquery, but this breaks the cascading behavior of the kendo DDL.

    So is there a way to update the ID and name of a kendo DDL without breaking the cascading behavior ?

     

    Thank you.

     

     

  2. Peter Milchev
    Admin
    Peter Milchev avatar
    135 posts

    Posted 28 Sep Link to this post

    Hello Abderrahmane,

    I am afraid that I was unable to completely understand your scenario and the provided information is insufficient to provide exact solution to your problem. Nevertheless, would you check if this Dojo example implements your scenario? It when clicking the button the id of the first input element changes and the second DropDownList's cascadeFrom property is set to the new id of the first DropDownList. 

    If this approach does not fit your scenario, I would suggest another two options:
    1. Re-initializing the DropDownList with the new id and name;
    2. Removing the last DropDownList pair instead of the selected one and passing the selected values of the following DropDownLists to the previous ones. For example:

    We have the following DropDownLists: DDL1, DDL2 and DDL3. If you want to remove the second DropDownList(DDL2), you just set the selected value of DDL3 to DDL2 and remove DDL3 isntead of DDL2. This way the DropDownLists should have continuous IDs. 

    I would like also to clarify that these are custom solutions and it is not guaranteed that they will work in all cases.

    Regards,
    Peter Milchev
    Telerik by Progress
    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
  3. UI for ASP.NET MVC is VS 2017 Ready
  4. Abderrahmane
    Abderrahmane avatar
    3 posts
    Member since:
    Sep 2014

    Posted 29 Sep Link to this post

    Hello Peter,

    Thanks for your reply.

    Your understanding is good, but the Dojo example didn't work (inspecting the categories input after clicking on the button, ID hasn't changed).

    For your two other solutions :

    1 - Is it possible to reinitialize DropDownList and keeping all the options that were before ? and inputs also ?

    2 - This looks like a good solution, do you have a sample code that implemented it ?

    Thank you.

  5. Peter Milchev
    Admin
    Peter Milchev avatar
    135 posts

    Posted 03 Oct Link to this post

    Hello Abderrahmane,

    Here is a screen recording showing how the Category's input changes its id.

    As for the other questions:
    1. You could get the options of an existing DropDownList instance as follows:

      var options = $("#WidgetName").data("kendoDropDownList").options;

      Then you could create an identical instance of the DropDownList from another <input> or <select> using the following snippet:

      $("#New-Widget-Name").kendoDropDownList(options);

    2. I am afraid that we do not have such example and as it is a custom solution it is the developer's task to implement it. 

    I would also recommend reviewing the following resources:
    Regards, Peter Milchev
    Telerik by Progress
    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
  6. Abderrahmane
    Abderrahmane avatar
    3 posts
    Member since:
    Sep 2014

    Posted 06 Oct Link to this post

    Hello Peter,

    It looks like it's good, the demo is working.

    Can you help me understand this line :

    categories.id = "caregoryChangedId";

    When was the variable "categories" instantiated ? I can't find it anywhere in the code provided.

    Thank you.

  7. Answer
    Peter Milchev
    Admin
    Peter Milchev avatar
    135 posts

    Posted 07 Oct Link to this post

    Hello Abderrahmane,

    In this case "categories" is not a variable but a reference to the HTML element with id="categories". You could read more on the topic in the following forum threads:
    Regards,
    Peter Milchev
    Telerik by Progress
    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
Back to Top
UI for ASP.NET MVC is VS 2017 Ready