Telerik Forums
Kendo UI for jQuery Forum
2 answers
114 views

How can I populate this combobox with items from the controller onPage Load? The following is not working

 

<input id="CodeList" placeholder="Select" style="width: 100%;" />

<script>
    $(document).ready(function () {
        $("#CodeList").kendoComboBox({
            index: 0,
            dataTextField: "text",
            dataValueField: "value",
            filter: "contains",
            dataSource: {

                 transport: {

                        read: {

                            dataType: "json",

                            url: '@Url.Action("CompanyIDChanged", "Login")',

                         }

               }

            }
        });
    });
</script>

 

Controller:

Function LoanCodeCombo() As ActionResult
            Dim CodeList= New LoginModel With {.Items = {
                New SelectListItem() With {.Text = ""},
                New SelectListItem() With {.Text = "A"},
                New SelectListItem() With {.Text = "B"},
                New SelectListItem() With {.Text = "C"},
                New SelectListItem() With {.Text = "S"},
                New SelectListItem() With {.Text = "T"},
                New SelectListItem() With {.Text = "U"},
                New SelectListItem() With {.Text = "7"},
                New SelectListItem() With {.Text = "8"},
                New SelectListItem() With {.Text = "9"},
                New SelectListItem() With {.Text = "0"}
                }
            }
            Return Json(CodeList, JsonRequestBehavior.AllowGet)
        End Function

Joshua
Top achievements
Rank 1
Veteran
 answered on 14 Oct 2020
4 answers
217 views
Hi there,

I have 2 cascading comboboxes in my form: CompanyId --> TaskId

When I select a company and there are no tasks linked to it the TaskId combobox should become disabled.
Just like it becomes disabled when I clear the CompanyId combobox.

This is what I do in the controller action:
       
01.public JsonResult Autocomplete(string query, int companyId) {
02.           var ret = Dao.Task.GetMany(i => i.CompanyId == companyId);
03. 
04.           if (!string.IsNullOrEmpty(query)) {
05.               query = query.ToLower();
06.               ret = ret.Where(i => i.Subject.ToLower().Contains(query));
07.           }
08. 
09.           var res = ret.Select(i => new {
10.               id = i.Id,
11.               name = i.Subject
12.           });
13. 
14.           return Json(res, JsonRequestBehavior.AllowGet);
15. 
16.       }


How can I do that?

many thanks,
Chris
Ingerid
Top achievements
Rank 1
Veteran
 answered on 21 Sep 2020
2 answers
45 views

This my Editor

function userNameAutoCompleteEditor(container) {
 
    $('<input id="UserId" name="UserId">')
        .appendTo(container)
        .kendoComboBox({
            autoBind: false,
            dataTextField: "UserName",
            dataValueField: "UserId",
            filter: "contains",
            minLength: 3,
            valuePrimitive: true,
            dataSource: new kendo.data.DataSource({            
                contentType: "application/json; charset=utf-8",
                serverFiltering: true,
                transport: {
                    read: {                       
                        url: '../Warehouse/SearchUser' ,
                        data: function () {
                            debugger;
                            UserSearcText:"asd"
 
                        }
                        
                    }
                },
            }),
        });
}

 

///Mvar grid = new BaseGrid('grdWarehouse_OnWarehouseUserRelation');
    grid._batch = false;
    grid._dataSourceAutoSync = false;
    grid._toolbar = ['create'/*, 'save', 'cancel'*/];
    grid._editable = {
        mode: "inline",
        create: true,
        update: true,
        destroy: true,

    };
    grid._autoBind = false;
    grid._schemaMethod = {
        model: {
            id: 'Id',
            fields: {
                Id: { editable: false },
                //User: { defaultValue: { UserId: '', UserName: '' } },
                
            }
        }
    };
    grid._columns.push(grid.GridColumn('Id', null, '200px', null, null, null, null, null, null, null, true));
    //grid._columns.push(grid.GridColumn('User', 'User', '200px', null, "#=User.UserName#", null, null, null, null, null, null, null, null, null, userNameAutoCompleteEditor));
    grid._columns.push(grid.GridColumn('UserId', 'User', '200px', null,'#=modelName(this)#', null, null, null, null, null, null, null, null, null, userNameAutoCompleteEditor));
    grid._columns.push(grid.GridColumn(null, '&nbsp;', '200px', { style: 'text-align:right' }, null, null, null, null, null, null, null, null, null, ['edit', 'destroy']));

    grid._cancelMethod = function (e) {
        var uid = $("#grdWarehouse_OnWarehouseUserRelation").data("kendoGrid").dataItem($(e.container).closest("tr")).uid
        dataSource = $("#grdWarehouse_OnWarehouseUserRelation").data("kendoGrid").dataSource
        var item = dataSource.getByUid(uid);
        dataSource.cancelChanges(item);
    };

//My problem  ı need filter text to send the controller.But  I cant catch searc text CAN YOU HELP ME!!!!??????????

This my grid

01.var grid = new BaseGrid('grdWarehouse_OnWarehouseUserRelation');
02.    grid._batch = false;
03.    grid._dataSourceAutoSync = false;
04.    grid._toolbar = ['create'/*, 'save', 'cancel'*/];
05.    grid._editable = {
06.        mode: "inline",
07.        create: true,
08.        update: true,
09.        destroy: true,
10. 
11.    };
12.    grid._autoBind = false;
13.    grid._schemaMethod = {
14.        model: {
15.            id: 'Id',
16.            fields: {
17.                Id: { editable: false },
18.                //User: { defaultValue: { UserId: '', UserName: '' } },
19.                 
20.            }
21.        }
22.    };
23.    grid._columns.push(grid.GridColumn('Id', null, '200px', null, null, null, null, null, null, null, true));
24.    //grid._columns.push(grid.GridColumn('User', 'User', '200px', null, "#=User.UserName#", null, null, null, null, null, null, null, null, null, userNameAutoCompleteEditor));
25.    grid._columns.push(grid.GridColumn('UserId', 'User', '200px', null,'#=modelName(this)#', null, null, null, null, null, null, null, null, null, userNameAutoCompleteEditor));
26.    grid._columns.push(grid.GridColumn(null, ' ', '200px', { style: 'text-align:right' }, null, null, null, null, null, null, null, null, null, ['edit', 'destroy']));
27. 
28.    grid._cancelMethod = function (e) {
29.        var uid = $("#grdWarehouse_OnWarehouseUserRelation").data("kendoGrid").dataItem($(e.container).closest("tr")).uid
30.        dataSource = $("#grdWarehouse_OnWarehouseUserRelation").data("kendoGrid").dataSource
31.        var item = dataSource.getByUid(uid);
32.        dataSource.cancelChanges(item);
33.    };

 

 

 

 

 

 

Merve
Top achievements
Rank 1
Veteran
 answered on 28 Aug 2020
2 answers
77 views

Hello.

I have a Combobox widget that loads a ton of data using paging. Each element of the combobox has a DisplayName and an Id property.

The DisplayName propery is displayed on the input (UI) as an element is selected, the ID is the value that we use on our application's logic.

The problem starts when I select a value that it's not in the first page and the save the data. When we open the widget again, the ID value is displayed on the UI until I scroll to through the combobox elements and it loads the selected value.

I'm guessing that the id property it's being displayed there because it's the only property saved by us and the DisplayName is not loaded yet.

 

Is there any way to get the selected element using the saved Id ?

Neli
Telerik team
 answered on 20 Jul 2020
1 answer
403 views
The code below throws a Javascript error that the function filter can not be found. Its defined right below the control. Why can't it be found?


                        @(Html.Kendo().ComboBoxFor(m=>m.childId)
                            .HtmlAttributes(new { style = "width:100%;" })
                            .Placeholder("Select ...")
                            .DataTextField("description")
                            .DataValueField("id")
                            .DataSource(source =>
                            {
                                source.Read(read =>
                                {
                                    read.Action("getData", "controller1")
                                    .Type(HttpVerbs.Get)
                                    .Data("filter");
                                })
                                .ServerFiltering(true);
                            })

                            .AutoBind(true)
                        )           
                        <script>
                            function filter() {
                                return {
                                    id: $("#Id").data("kendoComboBox").value()
                                }
                            }
                        </script>
Ivan Danchev
Telerik team
 answered on 26 Jun 2020
1 answer
321 views
I cannot use most of my combobox's on my page due to the fact that when I try to select a value by clicking the combobox, it triggers page scroll to top of my page. These combobox's are quite low on my page and therefor I cannot access the values due to this auto scrolling. Please help.
Ivan Danchev
Telerik team
 answered on 15 Apr 2020
1 answer
77 views
I have multiple combobox's. One for each detailRow headerTemplate. When I expand new detail Row tabs the combobox clear button "X" keeps appending more "X" s and Im not sure why this is happening or if there is a work around?
Ivan Danchev
Telerik team
 answered on 15 Apr 2020
9 answers
1.2K+ views

I have a kendoComboBox that I have configured with Server filtering. (autocomplete like functionality)

When a certain action occurs, I want to have the combobox select an item that I supply in code.  i.e. I want to set the text AND the selected value of the combobox, and then disable the combobox.

I know I can set the text with widget.text("something").  However, the value function also sets the text.  (widget.value("1111");)

So my next attempt was to set the datasource of the combobox to the object, and then call widget.select(0).

widget.setDataSource(new kendo.data.DataSource({
  data: [{
    itemID: '1111',
    name: 'Some Item'
  }]
}));
widget.select(0);
widget.trigger("change");
widget.enable(false);

 

However, this doesn't seem to do anything.  (except disable the widget)  The dataSource is getting set, but underlying value and the text are not changing.  Also, the dropdown is empty. (if I don't disable it)   

dataTextField is set to "name", and dataValueField is set to "itemID".

Any help would be appreciated.  Thanks.

Ivan Danchev
Telerik team
 answered on 11 Feb 2020
1 answer
50 views

  I have a kendoComboBox, with an associated dataSource that has more items than the PageSize. This comboBox is bound to one my columns in the grid. When creating a new record, i can access the items for this comboBox, that are not in the first 'pageSize items', by using the comboBox's filter and suggestion features, so i start typing, and can access a previously unloaded item. My problem occurs after i have created a record, and selected an item in this comboBox, that was not loaded at first on the dataSource, that is, an item greater than the PageSize. When i open the popup, and try to edit such a record, the comboBox is unable to find the previously selected item and, only displays the item's value field, instead of it's text field. From what I understand, because the item is not loaded in the dataSource by default, since it is greater than the PageSize, the comboBox's dataSource is unable to find the dataItem an assign it to the comboBox. So, what i would like to know, is if there is a way to load items that are larger than the dataSource's pageSize, when editing a record that already has these items selected on their comboBoxes.

  

Ivan Danchev
Telerik team
 answered on 28 Oct 2019
1 answer
811 views

The default functionality of kendo jquery combobox is that whenever we search something and hit tab it selects the item and in the next tab hit, the focus goes to the next input . However I want to combine these two steps, so that only one tab hit should select and move the focus to the next element. (e.g in devexpress https://demos.devexpress.com/MVCxDataEditorsDemos/Editors/ComboBox  if you search in the combobox and press tab it selects the drop-down item and focuses on next input immediately). Is it possible to do in kendo combobox?

Dimitar
Telerik team
 answered on 16 Jul 2019
Narrow your results
Selected tags
Tags
+? more
Top users last month
Mark
Top achievements
Rank 1
Yurii
Top achievements
Rank 1
Leland
Top achievements
Rank 2
Iron
Iron
Iron
Hon
Top achievements
Rank 1
Iron
Deltaohm
Top achievements
Rank 3
Bronze
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Mark
Top achievements
Rank 1
Yurii
Top achievements
Rank 1
Leland
Top achievements
Rank 2
Iron
Iron
Iron
Hon
Top achievements
Rank 1
Iron
Deltaohm
Top achievements
Rank 3
Bronze
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?