Multiple DropDownList MVVM with same DataSource

8 posts, 0 answers
  1. Neeraj
    Neeraj avatar
    127 posts
    Member since:
    May 2015

    Posted 04 Jun 2018 Link to this post

    Hello, i have Multiple DropDownList MVVM with same/shared DataSource. The problem is when i selected a value from DropDownList , the earlier selected values get reset. 
            I tried having multiple datasource as property  but that even doesnt works. I also tried solution in this https://docs.telerik.com/kendo-ui/controls/editors/multiselect/troubleshoot/troubleshooting#selected-item-is-lost-when-bound-to-shared-datasource 
             That also didnt worked . Here is my code.

    Inside Template:

    <script id="SegmentSelectionGridRowTemplate" type="text/x-kendo-template" class="AirPricingDivScript">
        <tr>
            <td>
                <label>#= data.SegmentDetailsToDisplay #</label>
     
            </td>
            <td>
                <input  data-role="dropdownlist" data-value-primitive="true" data-text-field="AirRequestToDisplay" data-value-field="ReservationRequestItemId"
                       data-bind="value: ReservationRequestItemID, source: SegList"  />
            </td>
        </tr>
    </script>

     

    <div data-role="grid" id="SegmentSelectionGrid" class="margin-top" style="margin-left: 0px;" data-bind="source: AirPNRViewModel.Segments" data-toolbar="<div><i class='fa fa-plane' aria-hidden='true'></i> <b>Flight Segment(s)</b> </div>"
                 data-columns='[
                             { "field": "PNRSegment", "title": "PNR Segment","width":"220"},
                         {"field": "RequestRoute","title":"Request Route","width":"80"}]'
                 data-row-template="SegmentSelectionGridRowTemplate"></div>

     

    Script:

    var viewModel = kendo.observable({
    SegList :[{"ReservationRequestItemId":1716,"AirRequestToDisplay":"SIN-LAD 03-06-2018"},{"ReservationRequestItemId":1716,"AirRequestToDisplay":"LAD-SIN 13-06-2018"},{"ReservationRequestItemId":1716,"AirRequestToDisplay":"SIN-BKK 02-06-2018"}],
    AirPNRViewModel:{
     Segments: [
    {"ReservationRequestItemID":0,"SegmentDetailsToDisplay":"TG  410"},
    {"ReservationRequestItemID":0,"SegmentDetailsToDisplay":"ET  619"}
     
     ]

     

  2. Bozhidar
    Admin
    Bozhidar avatar
    1189 posts

    Posted 05 Jun 2018 Link to this post

    Hello,

    I tried the described setup and it seems to work as expected on my end. Could you specify what the exact issue is? Perhaps share a screen capture of the problem?

    Regards,
    Bozhidar
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Neeraj
    Neeraj avatar
    127 posts
    Member since:
    May 2015

    Posted 06 Jun 2018 Link to this post

    Hello, Please see attached file for problem. Open .htm file in that zip.  The Exact issue is when i select value from dropdown other values get reseted as shown in video attached.  I also tried giving different name to data-value-field but result is same
  4. Neeraj
    Neeraj avatar
    127 posts
    Member since:
    May 2015

    Posted 06 Jun 2018 Link to this post

    Here is attachment
  5. Bozhidar
    Admin
    Bozhidar avatar
    1189 posts

    Posted 06 Jun 2018 Link to this post

    Hello,

    I've isolated a sample in our online dojo, and it seems to be working as expected. Could you give it a go, and see if it's working on your side as well:
    https://dojo.telerik.com/ujiGukEv


    Regards,
    Bozhidar
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  6. Luciano Kaesemodel
    Luciano Kaesemodel avatar
    29 posts
    Member since:
    Apr 2007

    Posted 25 Jan Link to this post

    Hello,
    I have a similar problem. In a grid, I'm trying to put two dropdownlist columns with the same data source, when I select a value in one dropdown it's replicating in the other. follows Dojo with example:
    https://dojo.telerik.com/@machado/OvIqAjuD

    thank you.

  7. Bozhidar
    Admin
    Bozhidar avatar
    1189 posts

    Posted 29 Jan Link to this post

    Hi,

    The problem here is that in both templates the value of the DropDownList is bound to the Id field of the Product. To fix this just include a separate template for the second column, bound to the same datasource, but with the correct value-binding. Here's the modified and working dojo sample:
    https://dojo.telerik.com/AlUGEzeb

    Regards,
    Bozhidar
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  8. Luciano Kaesemodel
    Luciano Kaesemodel avatar
    29 posts
    Member since:
    Apr 2007

    Posted 11 Feb in reply to Bozhidar Link to this post

    Thank you Bozhidar, problem solved.
Back to Top