This is a migrated thread and some comments may be shown as answers.

Binding Form Values To DropDownList

3 Answers 144 Views
MVVM
This is a migrated thread and some comments may be shown as answers.
Vincent
Top achievements
Rank 1
Vincent asked on 22 Jul 2015, 07:20 PM

 

 I am trying to bind a form to a dropdown list using Kendo's MVVM.  For example I have a dropdownlist that is hydrated with objects from the server. In the form, I have multiple input fields that should be bound to the current selected item of the dropdown.

 I.E. If I have selected Breakfast in the dropdown list, then my form should reflect the changes. If I select Lunch from the dropdown list then the form should select those values. 

My Code is Below:

 <form id="frmDailyEntry">

     <div>
            <label for="ServingPeriods">Serving Periods :</label>
            <select id="servingPeriods" data-text-field="ServingPeriod"
                    data-value-field="AdmServingPeriodId"
                    data-value-primitive="true"
                    data-autobind="true"
                    data-role="dropdownlist"
                    data-bind="source: DailyEntries, value: SelectedItem"></select>
        </div>

<!-- FULL PAY -->
                <div>
                    <label for="fullPay">Full Pay :</label>
                    <input type="text" name="fullPay" id="fullPay" data-bind="value: SelectedItem.FullPayDebit" />
                    <input type="text" name="fullPayTotal" id="fullPayTotal" disabled>
                </div>

                <!-- PREPAID -->
                <div>
                    <label for="prepaidfullPay">Prepaid Full Pay :</label>
                    <input type="text" name="prepaidfullPay" id="prepaidfullPay" data-bind="value: PrepaidFullPay" />
                </div>‚Äč

</form>

 

 

 

3 Answers, 1 is accepted

Sort by
0
Plamen
Telerik team
answered on 24 Jul 2015, 08:45 AM
Hi Vincent,

Here is a sample dojo page where the text from the selected item in the DropDownList is used in the input by using MVVM.

Regards,
Plamen
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Vincent
Top achievements
Rank 1
answered on 24 Jul 2015, 08:22 PM

Thanks alot!

 

I only tweaked it a little to get the results needed. It can be seen here at the dojo http://dojo.telerik.com/oRoVi.

0
Vincent
Top achievements
Rank 1
answered on 30 Jul 2015, 07:50 PM
Thanks!
Tags
MVVM
Asked by
Vincent
Top achievements
Rank 1
Answers by
Plamen
Telerik team
Vincent
Top achievements
Rank 1
Share this question
or