Search code examples
model-view-controllerkendo-uitelerik

Passing data between 2 MVC widgets


I've got created a widget(combobox) with data from an external server. I just want the value that I select from that combobox see into the label from another widget.

Source of the widget from the combobox:

<div id="exampleCombo">
        <div class="demo-section k-content">
            <h4>Facility</h4>
            <input id="fac" style="width: 30%;" />
        </div>
    <script>
        $(document).ready(function (user) {
            $("#fac").kendoComboBox({
                dataTextField: "client",
                dataValueField: "client",
                order: "ascending",
                height: 400,
                dataSource: {
                    // type: "odata",
                    type: "json",
                    transport: {

                        read: "/mvc/controllers/UserfacilitiesCombo/get/" + user
                    },
                    group: { field: "facility" }
                },
            });

        });

Source of the widget with the label on it:

 <div id="exampleLabel">
        <div class="demo-section k-content">
            <ul class="forms">
                <li>
                    <label>FacilityName</label>
                    <input id="FacPass"  name="FacPass" value="Test" class="k-textbox" style="width: 100%;" />
                </li>
            </ul>
        </div>

Can anybody help me on this?


Solution

  • You can use the change event. Put this after your dataSource and add a class name to your target label

    change: function(e) {
        var value = this.value();
        $('.yourLabelClass').html(value);
      }
    

    Here is some more info about the available events https://docs.telerik.com/kendo-ui/api/javascript/ui/combobox/events/change