kendo ui multiselect get selected values in jquery

kendo ui multiselect get selected values in jquery

Hello everyone,  I am going to share the code sample for get kendo ui multi selected value using MVC 5 and  jquery scripts.

Table of Contents

1. MultiSelect code sample using MVC 5 and HTML
2. jQuery code sample for get selected value using kendoMultiSelect


MVC 5 Code sample


<div class="multiselect-section">
    <label for="required">Notify me when excess usage reached over</label>
    @(Html.Kendo().MultiSelect()
       .Name("ExcessUsed")
       .BindTo(new List<string>() {
          "40%",
          "45%",
          "50%",
          "55%",
          "60%",
          "65%",
          "70%",
          "75%",
          "80%",
          "85%",
          "90%",
          "95%",
          "100%"
       })
       .Value(new string[] { "70%", "80%", "90%", "100%" })
       )
</div>
<div class="list-group-item" style="height: 50px;">
    <button class="btn btn-primary pull-right" id="btnSave">Save Setting</button>
</div>


jQuery code sample for get multi-selected value

<script type="text/javascript" >
    $(document).ready(function () {
        var used = $("#ExcessUsed").data("kendoMultiSelect");
        $("#btnSave").click(function () {
            var multiSelectedVal = $("#ExcessUsed").data("kendoMultiSelect").value();
            alert("Selected excess used:\n\n " + multiSelectedVal);
        });
    });
</script>




ANIL SINGH

Hey! I'm Anil Singh. I author this blog. I'm Active Blogger, Programmer. I love learning new technologies, programming, blogging and participating the forum discussions more...
http://www.code-sample.com
http://www.code-sample.xyz

You Might Also Like
Post a Comment
www.code-sample.com/. Powered by Blogger.