Change the Value of an Input Based on the Selection in RadioGroup in Form

Environment

Product	Progress® Kendo UI® Form for jQuery
Product	Progress® Kendo UI® RadioGroup for jQuery

Description

How can I change the value in an input field displayed in Kendo UI for jQuery Form based on the selection in RadioGroup?

Solution

Use the items.editorOptions to handle the RadioGroup select event. In the event handler find the needed field and set its value.

  <form id="myForm"></form>

  <script>
    $("#myForm").kendoForm({
      formData: {
        ID: 1,
        Name: "John Doe",
        Address: 3
      },
      items: [{
        field: "Name",
        validation: { required: true }
      }, {
        field: "Address",
        editor: "RadioGroup",
        editorOptions: {
          layout: "horizontal",
          items: ["Insert Procedure", "Update Procedure", "Synchronize Procedure"],
          select:function(e){              
            $("#Name").data('kendoTextBox').value(e.target.val());
          } 
        },
      }],
    });
  </script>

See Also

• Form Overview