In this case, I've got a 'vendor' dropdown that cascades off of a 'companies' dropdown. Within the datasource, it is possible for the vendor query to return no results for a selected company.
If I select a company that is associated with vendors, the vendor dropdown gets populated with the applicable values. If I then click on the vendor dropdown i can select values. This behavior is perfect.
If I select a company that has no vendors, I would expect the vendors dropdown to have no choices (or a default choice). However in this case, the vendor dropdown request it's data (/Vendors/Get?companyCode=33), gets no records and then posts a second time to the endpoint. Also the vendor dropdown remains stale, containing any items from a previous cascade operation. Furthermore, if I click on the Vendors dropdown, it initializes two more requests to the data (causing the spinning indicator to appear twice quickly) and stops.
Has anyone run into this double posting on no records issue? See source code below.
If I select a company that is associated with vendors, the vendor dropdown gets populated with the applicable values. If I then click on the vendor dropdown i can select values. This behavior is perfect.
If I select a company that has no vendors, I would expect the vendors dropdown to have no choices (or a default choice). However in this case, the vendor dropdown request it's data (/Vendors/Get?companyCode=33), gets no records and then posts a second time to the endpoint. Also the vendor dropdown remains stale, containing any items from a previous cascade operation. Furthermore, if I click on the Vendors dropdown, it initializes two more requests to the data (causing the spinning indicator to appear twice quickly) and stops.
Has anyone run into this double posting on no records issue? See source code below.
<input id=
"CompanyCode"
data-textfield=
"ItemText"
data-valuefield=
"ItemValue"
data-endpoint=
"http://localhost:8888/Customers/Get"
data-selected=
"40"
/>
<input id=
"VendorId"
data-textfield=
"ItemText"
data-valuefield=
"ItemValue"
data-endpoint=
"http://localhost:8888/Vendors/Get"
data-cascade=
"CompanyCode"
/>
<script src=
"Content/js/jquery.min.js"
></script>
<script src=
"Content/js/kendo.all.min.js"
></script>
<script>
$(
function
(){
$(
'#CompanyCode'
).each(
function
(){
var
target = $(
this
);
var
options = {
dataTextField: target.data(
'textfield'
),
dataValueField: target.data(
'valuefield'
),
dataSource: {
transport: {
read: target.data(
'endpoint'
)
}
}
}
target.kendoDropDownList(options);
});
$(
'#VendorId'
).each(
function
(){
var
target = $(
this
);
target.kendoDropDownList( {
dataTextField: target.data(
'textfield'
),
dataValueField: target.data(
'valuefield'
),
dataSource: {
transport: {
read: target.data(
'endpoint'
),
parameterMap:
function
(options, operation) {
return
{
companyCode: options.filter.filters[0].value
}
}
},
serverFiltering:
true
},
cascadeFrom: target.data(
'cascade'
),
autoBind:
false
});
});
});
</script>