CODEWITHSUNDEEP
javascripthtmlkendo-ui
ckv
ckv

Reputation: 10830

Getting KENDO UI autocomplete entries as arrays in controller

I have a view cshtml file in which I use KENDO UI Autocomplete widget. I use it for getting the days in the week like monday, tuesday etc...

Now in my model I have an array of strings bound to this control. When I enter multiple values in the autocomplete text box, I would like them to be poppulated in the model as different array entries each entry having one value from the autocomplete text box. To be more clear, say I Type Monday, Tuesday in the text box, then i am expecting an array of 2 elements with first element having value Monday, and second element having value Tuesday.

How can we achieve this? Now I am getting the array with only one element as Monday,Tuesday. Below are the codes of the model and the view.

var daysofweek = [
                            "Monday",
                            "Tuesday",
                            "Wednesday",
                            "Thursday",
                            "Friday",
                            "Saturday",
                            "Sunday",
            ];
$("#daysofweek").kendoAutoComplete({
                dataSource: daysofweek,

                placeholder: "Select days of week...",
                separator: ", "
            });
<label for="daysofweek">Select Days of Week</label>
        <input type="text" id="daysofweek" name="DaysofWeek" /><br />

Model Code

public class Holiday
    {
        public string Name { get; set; }
        public string Description { get; set; }
        public DateTime Date { get; set; }
        public short Type { get; set; }
        public bool AllYears { get; set; }
        public string[] Days { get; set; }
        public string[] DaysofWeek { get; set; }
        public string[] Months { get; set; }
    }

Upvotes: 0

Views: 523

Answers (1)

U.P
U.P

Reputation: 7442

One way to accomplish this is to use 

 public string DaysofWeek { get; set; }

to receive comma separated values from client and then on the server split the values based on , like

DaysOfWeekArray = DaysofWeek.split(',');

Update:

Another, a bit ugly, way is to hook submit event and make some changes to the form element before posting

$('form').submit(function () {
    var val = $('input[name="DaysofWeek"]', this).val(); // getting comma seperated values
    var valArray = val.split(','); // creating array
    for (var i = 0; i < valArray.length; i++) {
        // creating dynamic elements with names[i] and value[i]
        $('input').attr('name', 'DaysofWeek[' + i + ']').val(valArray[i]).appendTo(this);
    }
    //removing original element
    $('input[name="DaysofWeek"]', this).remove();
});

Upvotes: 2

Related Questions