I am having an issue with the data source not being accessed. The webservice executes it's query and firebug shows the return string but I don't get the features of the autocomplete list.
$("#txtCriteria").kendoAutoComplete({
minLength: 1,
suggest: true,
filter: "startswith",
dataTextField: "ACName",
select: function (e) {
var dataItem = this.dataItem(e.item.index());
//output selected dataItem
document.getElementsByName("hdfldSelect")[0].value = dataItem.ACCode;
$("#txtCriteria").kendoAutoComplete();
var autocomplete = $("#txtCriteria").data("kendoAutoComplete");
autocomplete.destroy();
},
dataSource: new kendo.data.DataSource({
serverFiltering: true,
transport: {
read: {
url: "../DAL/Reports/wsReports.asmx/AutoComplete",
dataType: "json",
type: "GET",
},
parameterMap: function (data, action) {
var newParams = {
Type: Type,
filter: data.filter.filters[0].value
};//var
return newParams;
},//parameter
}//trans2
})//data
});
Thank you for any assistance
Going along the fact that your endpoint returns the expected data set, you could try adding a 'schema' to your kendo-datasource.
dataSource: new kendo.data.DataSource({
schema: {
data: function (e) {
return e.Results
},
model: {
fields: {
Id: { type: "number" },
Name: { type: "string" }
}
}
},
serverFiltering: true,
transport: {
read: {
url: "../DAL/Reports/wsReports.asmx/AutoComplete",
dataType: "json",
type: "GET",
},
parameterMap: function (data, action) {
var newParams = {
Type: Type,
filter: data.filter.filters[0].value
};//var
return newParams;
},//parameter
}//trans2
})//data
Related
My kendo grid is not showing data after successfully calling a web method and seeing data being returned in the ajax request.
$(document).ready(function () {
var filterSource = new kendo.data.DataSource({
transport: {
read: function (options) {
$.ajax({
type: "GET",
url: "DoJo.aspx/GetProjects",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (msg) {
// msg.d has the json data
}
});
}
},
schema: {
model: {
fields: {
ProjNum: {type: "string"},
Stat: {type: "string"}
}
},
data: "d"
},
change: function (e) {
// e.items is empty
}
});
$("#grid").kendoGrid({
dataSource: filterSource,
columns: [
{
field: "ProjNum", title: "Project Number", width: "130px", filterable: {
multi: true,
dataSource: filterSource
}
},
{
field: "Stat", title: "Status", filterable: {
multi: true,
dataSource: filterSource
}
}
]
});
})
The JSON below is in an array format.
[{"ProjNum":"12345","Stat":null,"ProjTitle":"Test Title","ClientName":"Test Client","ClientContactName":"Test Name","ClientFacilityLocation":"Test Location","SourceOfContact":"Test Contact","ProjManager":"Test Manager","Department":"Test Department"}]
Why is change callback returning an empty e.items? If I remove data: "d" it returns e.Items with the JSON data.
When you set dataSource.transport.read to a function and invoke the ajax call yourself, you need to pass the result (or error) back into the dataSource, like so:
var filterSource = new kendo.data.DataSource({
transport: {
read: function (options) {
$.ajax({
type: "GET",
url: "DoJo.aspx/GetProjects",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (msg) {
// msg.d has the json data
// notify the data source that the request succeeded
options.success(msg);
},
error: function(msg) {
// notify the data source that the request failed
options.error(msg);
}
});
}
},
schema: {
model: {
fields: {
ProjNum: { type: "string" },
Stat: { type: "string" }
}
},
data: "d"
},
change: function (e) {
// e.items is empty
}
});
See the documentation for more information.
I want to populate a Kendo dropdownlist with data from a database.
That's what I call the "frwMantenimientoEmpresas.aspx / SelectProvincias" method.
My problem is that the value "undefined" after making the call, in the dropdownlist appears ...
dataSource1 = new kendo.data.DataSource({
serverFiltering: true,
transport: {
read: {
beforeSend: function (req) {
//alert("");
},
async: false,
url: "frwMantenimientoEmpresas.aspx/SelectProvincias",
type: "POST",
dataType: "json",
contentType: "application/json; charset=utf-8"
}
},
schema: {
model: {
fields: {
UIDProvincia: { type: "int" },
Nombre: { type: "string" }
}
}
}
});
$("#dropProv").kendoDropDownList({
dataSource:dataSource1,
dataTextField: "Nombre",
dataValueField: "UIDProvincia",
autoBind: true,
});
The read method calls the server SelectProvincias method correctly..
At this point dropDownList = undefined??
I am working on kendo ui listvie with paging. In this everytime I move to next page it will call datasource. In my scenario if I select 4th page it is calling datasource 4times times.
below is the code
function InitiateContactList() {
var RouteDataSource = null;
RouteDataSource = new kendo.data.DataSource({
serverPaging: true,
type: "aspnetmvc-ajax",
create: {
contentType: "application/json"
},
transport: {
read: {
url: '#Url.Content("~/Partner/GetPartnerContacts")',
data: { lPartnerId: $("#hdnPartnerId").val() },
dataType: "json",
type: "get",
}
},
serverFiltering: true,
pageSize: 2,
schema: {
data: "Data",
total: "Total"
}
});
$("#copyRoutelistdata").kendoListView({
autoBind: false,
dataSource: RouteDataSource,
template: kendo.template($("#Contactstemplate").html()),
//selectable: "single",
//pageable: true,
change: function (e) {
var index = this.select().index();
dataItem = this.dataSource.view()[index];
if (dataItem != null && dataItem.RouteId != null) {
//CopyRoute(dataItem.RouteId);
//HideWindow('MdCopyRouteSearch');
}
},
dataBound: function (e) {
$("#RoutelistPager").kendoPager({
autoBind:false,
dataSource: RouteDataSource
});
}
});
RouteDataSource.read();
}
Thanks in advance.
I am getting this error every time i update any row.
The update itself is successful in the database, but when i trigger the success method for kendo it seems to be bothered, at the beginning i thought it could be that the object i return from the database is different, but its exactly the same one as the one i submit.
Thanks in advance
Uncaught SyntaxError: Unexpected identifier
yt.setter
lt.extend._set
Ut.extend.accept
lt.extend._accept
(anonymous function)
(anonymous function)
j
k.fireWith
e.(anonymous function)
o.(anonymous
function).call.X.success
$.ajax.success
j
k.fireWith
x
b
Here is the code:
dataSource = new kendo.data.DataSource({
transport: {
read: function(options) {
$.ajax( {
url: crudServiceBaseUrl + "?serviceType=students&serviceFunction=getStudentLists&type=2",
dataType: "json",
success: function(result) {
var data = _.flatten(result);
options.success(data);
}
});
},
update: function(options) {
$.ajax( {
type: 'POST',
url: "/tools.php?id=ajaxstudentlist",
dataType: "json",
data: {data:options.data.models},
success: function(result) {
var arr = [];
arr.push(result);
var data = _.flatten(arr);
options.success();
}
});
},
parameterMap: function(options, operation) {
if (operation !== "read" && options.models) {
return {models: kendo.stringify(options.models)};
}
}
},
batch: true,
pageSize: 70,
schema: {
model: {
id: "studystatusid",
fields: {
studystatusid : { type: 'number', editable: false, nullable: true },
studentid : { type: 'string', editable: false, nullable: false},
lastname : { type: 'string', editable: false, },
firstname : { type: 'string', editable: false, },
spnumber : { type: 'string', editable: false, },
status : { type: 'string', editable: false, },
begin_date: { type: "date", validation: { required: true } },
end_date: { type: "date" }
}
},
parse : function(data) {
for (var i = data.length - 1; i >= 0; i--) {
data[i].studentid = addZeros(data[i].studentid);
if(data[i].begin_date !== '0'){
data[i].begin_date = new Date(parseInt(data[i].begin_date+ '000'));
}
if(data[i].end_date){
data[i].end_date = new Date(parseInt(data[i].end_date+ '000'));
}
}
return data;
}
}
});
Your Datasource Update
update: function(options) {
$.ajax( {
type: 'POST',
url: "/tools.php?id=ajaxstudentlist",
dataType: "json",
data: {data:options.data.models},
success: function(result) {
var arr = [];
arr.push(result);
var data = _.flatten(arr);
options.success();
}
});
},
the above ajax call is expecting a JSON result back , you should return a JSON result back as a success , Its Better to return the updated row back.
why are are you calling ajax inside Kendo?
Should be like the following code. Try this and update the status I will modify the code if it not get succeeded.
dataSource = new kendo.data.DataSource({
transport: {
read: {
url: crudServiceBaseUrl + "?serviceType=students&serviceFunction=getStudentLists&type=2",
dataType: "json",
success: function (data) {
console.log(data);
}
},
update: {
url: "/tools.php?id=ajaxstudentlist",
dataType: "json",
data:{inputParam:inputvalue},
success: function(result) {
console.log(data);
}
},
parameterMap: function(options, operation) {
if (operation !== "read" && options.models) {
return {models: kendo.stringify(options.models)};
}
}
},
batch: true,
pageSize: 20,
schema: {
model: {
id: "studystatusid",
fields: {
studystatusid : { type: 'number', editable: false, nullable: true },
studentid : { type: 'string', editable: false, nullable: false},
lastname : { type: 'string', editable: false, },
firstname : { type: 'string', editable: false, },
spnumber : { type: 'string', editable: false, },
status : { type: 'string', editable: false, },
begin_date: { type: "date", validation: { required: true } },
end_date: { type: "date" }
}
}
}
});
code:
var dataSource = new kendo.data.DataSource({
transport: {
read: {
url: "http://search.twitter.com/search.json",
dataType: "jsonp",
data: {
q: "kendoui"
}
}
},
schema: {
data: "results",
total: function(response) {
return response.results.length;
}
},
pageSize: 4
});
here i have to set the page size 4 from client side
public JsonResult GetSettings()
{
return Json(new { count = Service.GetSettings<UserSetting>(AuthenticatedUser) }, JsonRequestBehavior.AllowGet);
}
var settingsDataSource = new kendo.data.DataSource({
transport: {
read: {
url: '#Url.Action("GetSetting")',
dataType: "json",
type: "GET"
}
},
schema: {
parse: function (data) {
resultCount = data.count;
return data;
}
},
change: function () {
Grid();
}
});
settingsDataSource.read();
function Grid() {
mainGridDataSource = new kendo.data.DataSource({
transport: {
read: {
url: '#Url.Action("GetDetails")',
dataType: "json",
type: "POST",
contentType: "application/json; charset=utf-8"
},
parameterMap: function (options) {
return JSON.stringify({ filter: options, isPrimary: options.isPrimary });
}
},
schema: {
model: {
fields: {
Status: { type: "string" },
Name: { type: "string" }
}
},
data: function (data) {
return data.data;
},
total: function (data) {
return data.totalCount;
}
},
pageSize: resultCount,
serverFiltering: true,
serverPaging: true
});