Telerik Forums
Kendo UI for jQuery Forum
2 answers
330 views

Hi,

when I use trigger select in combobox it is fired twice and the second time it is fired the item property comes to null.

Has anyone had a similar problem and can you help me?

Thank you.

BR,

MCosta

 

Marco
Top achievements
Rank 1
 answered on 09 Jan 2018
2 answers
475 views

Hi we have a problem with a combobox

We need this combobox to have a lot of record (around 1000-2000) and to paginate results for performance. We also need it to have virtualization cause sometimes we have to use the value method to programmatically select an element that may not be in the current pagination.

We then added a button at the left side. It opens a dialog that permits to add an element to the database, reread the combobox datasource and select the new element.

// on confirm, call our add element rest api

    // on call completed, datasource.read

         // on read promise completed, combobox.value( id of the new element )

         // combobox.trigger('change')

 

the value( id ) method starts rereading the datasource non stop, doing infinite ajax get calls to the server. We are having troubles understanding what may cause this.

in the console we read the warning i attached

this is most of the code, tell me if you need other parts: https://jsfiddle.net/mhqw922q/?utm_source=website&utm_medium=embed&utm_campaign=mhqw922q

Veselin Tsvetanov
Telerik team
 answered on 04 Dec 2017
1 answer
193 views

I have a grid with a filter row in the top. When zooming in, borders disappear. 

I could also repro it with your own demos of the combobox: http://demos.telerik.com/kendo-ui/combobox/index. When I zoom in to 90%, I see a missing top border for t-shirt size (see attached). When I zoom in further other borders disappear and appear.

I use Chrome Version 62.0.3202.94

Dimitar
Telerik team
 answered on 28 Nov 2017
4 answers
1.2K+ views
Hi I have States  Kendo Combox set up like below on a template ;which opens up on Grid Edit popup template.

1) For some reason even if placeholder is setup ; Combobox shows first item as Object.

2)Trying to achieve to clear the box when invalid text is entered other than in the data source.

Getstates() returns a list of states as Name and Code fields.

Template:
<tr>
     <td>
          <label for="State" class="required">State:</label>
     </td>
     <td>
          <input id="State" class="k-input k-textbox" name="State" data-bind="value:State" placeholder="State" required="required" validationMessage="State.." style="width:172px;" /> 
    
     </td>
 </tr>

Model & Field:
schema: {
      model: { State: "State",
      fields: {State: { defaultValue: { Value: "", Text: "" }, validation: { required: true} }
           }
     }
  
ComboBox:

var crudServiceBaseUrl = window.applicationBaseUrl + 'api/WebApi';
        $("#State").kendoComboBox({
                placeholder: "Select...",
                dataTextField: "Name",
                dataValueField: "Code",
                dataSource: {
                    //severFiltering: true,
                    transport: {
                        read: {
                            url: crudServiceBaseUrl + "/GetStates"
                        }
                    }
                },
                open: function (e) {
                                      valid = false;
                                  },
                select: function (e) {
                                      valid = true;
                                  },
                change: function (e) {
                                      var arrayOfStrings = $.map(this.dataSource.data(), function (val) { return val.dataTextField });
                                      if (arrayOfStrings.indexOf(this.value()) == -1) {
                                          this.value('');
                                      }
                                  },
                filter: "startswith",
                suggest: true,
                index: 0
            });

Data Array:
data: [{ Name: "Alabama, AL", Code: "AL" },{ Name: "Alaska, AK", Code: "AK" },]


Ivan Danchev
Telerik team
 answered on 28 Nov 2017
1 answer
41 views

we built an offline webapp placed on our customer pc

in that webpage there's a combobox listing an inventory of products

our users usually focus the filtering input field and then use their barcode reader to input the barcode of the product they're looking for; the barcode reader returns a Carriage Return at the end of the string, so it immediately selects the first good result

today the user called us for an issue: sometimes using the combobox this way selects another product; We remotely connected to their machine and saw that it was as she said;

what we got right now is:

1- it happens only in kendo combobox, because there's another place where we built a javascript search by text field and everything works there
2- there's apparently nothing wrong with the data call
3- it could depend on the machine; her pc is sensibly slower than our (we even saw the search string appear letter by letter in the text field)
4-the issue never happens if we replicate her installation on one of our machines

Thanks in advance for anysuggestion

Plamen
Telerik team
 answered on 14 Nov 2017
4 answers
155 views

Hello.

 

we are testing the kendo ComboBox as part of our widget system , in order to integrate with angular we included kendo.directive modules.

the Original issue i wanted to solve was how to disable the angular binding on key press up and down .

Our directives are ES6 Classes and we using the kendo combo box directive , the problem here is its seems that the combo-box create another input element on the page and don't copy other attributes we added like angular ng-keydown , when  i used the post compile method to find the new kendo input element then adding the missing properties and then $recompile the input the browser was unresponsive.

 Using the kendo auto-complete directive was good because it's don't replace the original object.

 

 

   _getElementHtml() {
                var mapper = this.mapper;
                var item = mapper ? 'item' : 'item.key';
                var mdId = this.$attrs.mdId + (this.listIndex ? "-" + this.listIndex : "");
                var html = [];

                html.push("<div class='idi-combo-box'>");
                html.push("<span ng-show='$this.filterText'>{{$this.filterText}}</span>");
                var kendoType = this.isServerAutoComplete() ? 'auto-complete' : 'combo-box';

                html.push("<input kendo-" + kendoType + " k-on-open='onOpen(kendoEvent)'  k-options='comboConfig'  k-data-source='comboList'  k-on-select='onSelection(kendoEvent)' ");
                html.push(" type='text' ng-show='!$this.filterText' id='" + mdId + "'");
                html.push(" ng-model='kendoInput' ");
                html.push(" tooltip-placement='bottom' ");
                html.push(" tooltip='{{$this.tooltip}}' ");
                html.push(" ng-keydown='$this._onKeyDown($event)'");
                html.push(" ng-keypress='$this._onKeyPress($event,$this)'");
                html.push(" ui-mask='{{::$this.mask}}'");

                html.push((this.$attrs.readOnly ? 'readonly="readonly" ' : ''));

                html.push("/>");
                html.push("</div>");

                return html.join('');
            }

 

 

thanks in advance,

elad.

Alexander Popov
Telerik team
 answered on 10 Nov 2017
3 answers
164 views
I can't get it to work with a JSON REST services that uses a {"total": 100, "data": [{...}]} format. 
Dimitar
Telerik team
 answered on 02 Nov 2017
2 answers
92 views

Hello, i have a following kendo combobox with angular 1.5 integration. I want to open and close the combobox in my contoller.js. Can you please help me with that.

 

<select id="cmbCostCenter"
                        name="cmbCostCenter"
                        kendo-combo-box
                        class="form-control"
                        k-placeholder="'Cost Center'"
                        k-filter="'contains'"
                        k-min-length="4"
                        k-data-text-field="'costCenterDisplayName'"
                        k-data-value-field="'sapCostCenterID'"
                        k-data-source="costCenters"
                        k-on-change="costCenterOnChange(costCenterForm)"
                        k-ng-model="data.costcenters.selectedCostCenter"
                        ng-disabled="!data.appUser.pluginPermissions.isPluginAdmin"
                        ng-show="showCB"
                        style="width: 100%; background: white;"
                        required></select>

Ranjeeth
Top achievements
Rank 1
 answered on 24 Oct 2017
3 answers
314 views

I basically want my combobox to have the option of searching between two sources, and able to switch between them with a click of a button contained in the footer template. I almost got it working but have some problems. Please see:

 

https://dojo.telerik.com/Esibiy

 

I can switch the data source and get the results to display, however the problems are:

1) Button text does not stay changed, if you comment out the .setDataSource() in switch search, then the button text is preserved and switches between Local and Global. But calling .setDataSource() seems to load the template again, though the span accompanying it does not change. I tried setting the footer template in switchSearch with:

widget.footerTemplate = $("#alternativeTemplate").html(); but that didn't work.

2) If I type Kiwi, which has no result in local search, and click Global search to switch data source, the filtering does not apply, even though I would like it to because I have entered something in the textbox already. 

 

How can I make this work? Thanks.

 

 

Joana
Telerik team
 answered on 05 Oct 2017
2 answers
246 views

I'm trying to create a Comboxbox with server side paging and a custom transport read, i can't get it to work so i made a small ex-sample.

If you run the example it isn't possible to scroll "below" the already loaded items, so there isn't another read to get the next 10 items

https://dojo.telerik.com/eHaJU/5

    $("#orders").kendoComboBox({
            dataTextField: "text",
            dataValueField: "value",
            dataSource: {
        serverPaging: true,
        schema: {
            data: "data",
            total: "total"
        },
        pageSize: 10,
        transport: {
            read: function(options) {
                var data = getData(options.data.page);
                options.success(data);
            }
        },
        update: function() {}
    }
});
 
function getData(page)
{
    var dataArr = [];
    for (var i = 0; i < 10; i++)
        dataArr.push({ text: "Item " + (i + 1) + " on page " + page, value: 1});
     
    return {data: dataArr, total: 100};
}

How can I make this work? Thanks in advance.
Willem-Jan
Top achievements
Rank 1
 answered on 04 Oct 2017
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?