Questions on Kendo UI for jQuery Forum

3 answers

144 views

I need to set useNativeScrolling = true on a particular view (for Android only) and can't seem to figure it out. I assumed it would be as easy as:

if (device.platform === "iOS")

//        {

console.log("ios");

    app.view().useNativeScrolling = false;

}

But that doesn't seem to do anything. I'm sure it's simple.

View

answered on 01 Dec 2015

1 answer

671 views

Export multiple data sources into one excel file

I am trying to export multiple data sources into one excel file, each data source has their own sheet in the excel.
I notice that If I move the following code out from the datasource.fetch() cluster, no data from the data source will be inserted.

var workbook =new kendo.ooxml.Workbook( {
sheets: [
{
columns: [
// Column settings (width)
{ autoWidth: true },
{ autoWidth: true },
{ autoWidth: true },
{ autoWidth: true },
{ autoWidth: true }
],
// Title of the sheet
title: "Orders",
// Rows of the sheet
rows: rows
},
{
columns: [
// Column settings (width)
{ autoWidth: true },
{ autoWidth: true },
{ autoWidth: true },
{ autoWidth: true },
{ autoWidth: true }
],
// Title of the sheet
title: "Orders2",
// Rows of the sheet
rows: rows
}
]
});

//save the file as Excel file with extension xlsx
kendo.saveAs({dataURI: workbook.toDataURL(), fileName: "Test.xlsx"});

The problem is datasource.fetch() are skipped or temporary ignored, the above code will be executed before datasource.fetch() are execute.
To overcome that problem, I have to put a timeout function() at the setTimeout(function(){kendo.saveAs({dataURI: workbook.toDataURL(), fileName: "Test.xlsx"});},20000);. By doing this way, the exported excel file will contain data from the data source which I find it is not a very appropriate way of doing it.

Here is the snippets code of that I used from the sample provided by telerik with some code modification.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Kendo UI Snippet</title>

<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.1111/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.1111/styles/kendo.rtl.min.css">
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.1111/styles/kendo.default.min.css">
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.1111/styles/kendo.dataviz.min.css">
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.1111/styles/kendo.dataviz.default.min.css">
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.1111/styles/kendo.mobile.all.min.css">

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2015.3.1111/js/jszip.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2015.3.1111/js/kendo.all.min.js"></script>
</script>
</head>
<body>

<script>
var ds = new kendo.data.DataSource({
type: "odata",
transport: {
read: "http://demos.telerik.com/kendo-ui/service/Northwind.svc/Orders"
},
schema: {
model: {
fields: {
OrderID: { type: "number" },
Freight: { type: "number" },
ShipName: { type: "string" },
OrderDate: { type: "date" },
ShipCity: { type: "string" }
}
}
}
});

var rows = [{
cells: [
// First cell
{ value: "OrderID" },
// Second cell
{ value: "Freight" },
// Third cell
{ value: "ShipName" },
// Fourth cell
{ value: "OrderDate" },
// Fifth cell
{ value: "ShipCity" }
]
}];

//using fetch, so we can process the data when the request is successfully completed
ds.fetch(function(){
var data = this.data();
for (var i = 0; i < data.length; i++){
//push single row for every record
rows.push({
cells: [
{ value: data[i].OrderID },
{ value: data[i].Freight },
{ value: data[i].ShipName },
{ value: data[i].OrderDate },
{ value: data[i].ShipCity }
]
})
}
});

var workbook =new kendo.ooxml.Workbook( {
sheets: [
{
columns: [
// Column settings (width)
{ autoWidth: true },
{ autoWidth: true },
{ autoWidth: true },
{ autoWidth: true },
{ autoWidth: true }
],
// Title of the sheet
title: "Orders",
// Rows of the sheet
rows: rows
},
{
columns: [
// Column settings (width)
{ autoWidth: true },
{ autoWidth: true },
{ autoWidth: true },
{ autoWidth: true },
{ autoWidth: true }
],
// Title of the sheet
title: "Orders2",
// Rows of the sheet
rows: rows
}
]
});

//save the file as Excel file with extension xlsx
setTimeout(function(){kendo.saveAs({dataURI: workbook.toDataURL(), fileName: "Test.xlsx"});},20000);
</script>
</body>
</html>

Currently I am showing the code exporting the same data source into different sheet in the excel file, just to keep the code short. Or you can access it from here,http://dojo.telerik.com/Otahe/3
It will be much appreciated if there is a better solutions to do this.

Data Source

answered on 01 Dec 2015

4 answers

475 views

dataSource not reading remote data

I am trying to read json data from a remote service and its not working.

my code:

var schema = {

data: "data",

model: {}

};

var warmup = new kendo.data.DataSource({

schema: schema,

transport: {

read: function(options) {

$.ajax( {

url: kendo.toString(baseUrl + wkdayID),

success: function(result) {

console.log(kendo.toString(baseUrl + wkdayId));

options.success(result);

}

});

}

},

filter: { field: "IS_WARMUP", operator: "eq", value: "1" },

error: function() {

console.log(arguments); }

});

warmup.fetch();

however when I modify the url portion to a string and add it to the baseUrl like this:

url: kendo.toString(baseUrl + "21")

it works for some reason. does anyone know whats going on? I would like to be able to set that "21" dynamically.

Data Source

answered on 01 Dec 2015

2 answers

575 views

[Solved] Grid - FilterMenu prevent keydown close filter menu

Hello,

Im trying to create a way to filter the set of available checkboxes in my filter menu. I have created a dropdown list which specifies the operator and a input field which allows the user to enter a value. The filtering part works however I would like to provide a way to filter the checkboxes when the user presses enter in the input field.

The keyup event on the input field seems to close the filter menu automatically. I have tried to search in the kend.ui.filtermenu.fn._keydown events but no luck there.

You can see the behaviour in: http://dojo.telerik.com/IPAgo

Is there a way I could overwrite the keyup event and prevent the filter menu from closing?

It seems like its bind to the k-textbox class because if i remove the class from the textbox it's working as intended.

Thanks in advance!

Grid

answered on 01 Dec 2015

1 answer

161 views

TreeListColumn object TypeScript definition is missing 'editor' property

I am using TypeScript 1.6 and the compiler is complaining that TreeListOptions.columns.editor cannot be set because the TreeListOptions is not expecting the 'editor' property. When I check the kendo.all.d.ts file, this is what I see:

interface TreeListOptions {
name?: string;
autoBind?: boolean;
columns?: TreeListColumn[];
...
}

...

interface TreeListColumn {
attributes?: any;
command?: TreeListColumnCommandItem[];
encoded?: boolean;
expandable?: boolean;
field?: string;
filterable?: TreeListColumnFilterable;
footerTemplate?: any;
format?: string;
headerAttributes?: any;
headerTemplate?: any;
minScreenWidth?: number;
sortable?: TreeListColumnSortable;
template?: any;
title?: string;
width?: any;
hidden?: boolean;
menu?: boolean;
locked?: boolean;
lockable?: boolean;
}

I am using version 2015.2.805, but I verified that this problem exists in the latest version 2015.3.1111 as well.

Michelle

TreeList

answered on 01 Dec 2015

1 answer

169 views

Don't hide submit button when upload fail

I don't want to hide my submit button when my upload fails, im aware there is a retry button, but as my submit button has internacionalization text logic, it will much easy if the submit button just don't disapear.

I already know how to hide the retry button, i just need to keep the submit button there. In addition i will have to make the submit disapear on success.

Very tnks.

Alec Ventura.

Upload

answered on 01 Dec 2015

1 answer

101 views

[Solved] Stacked Chart Remote Data not displayed correctly

Hello,

I used the following snippet:

http://dojo.telerik.com/AnEqA/2

Jun 2015 and Okt 2015 are ok fine because they don't contain stacked values. But I would expect Aug 2015 to display 50 € für Sales and 50 € for Rent.

How can I archive this? I tried to group the datasource but that didn't work out.

Regards

Charts

answered on 01 Dec 2015

2 answers

1.2K+ views

Checkbox not work with validation

Hello ,

I`m trying to create a simple contact form with Kendo validation. Everything works fine ,but if i want to use Kendo default styles , controls have unexpected behavior. You can see demo here: http://dojo.telerik.com/OHiDo/2 , can`t click on chechbox when it has class : k-checkbox and label has class : k-checkbox-label

If remove these styles , everything works fine .. Can you help me with these issue ? I want to use Kendo styles with Kendo validation.

Thanks.

Regards,
Harry.

Validation

answered on 01 Dec 2015

1 answer

159 views

Error in documentation for template

We lost a lot of time trying to use the notification widget by following that code sample:
http://docs.telerik.com/kendo-ui/api/javascript/ui/notification#methods-show

But it's not working.
That configuration:
{templates: { myAlert: "<div>System alert: #= myMessage #</div>"}}

should be:
{templates: [
{ type: "myAlert", template: "<div>System alert: #= myMessage #</div>"}
]}

The "open in dojo" link should display something like that:
http://dojo.telerik.com/ufumo

Notification

answered on 01 Dec 2015

1 answer

554 views

Title() and ClientTemplate() not working when I bind dynamic columns

Function Title(), ClientTemplate() and encode(false) don't work when I bind dynamic columns in a hierarchy grid.

Some columns contains html like <br/>. I tried Encode(false), but it doesn't work.

View:

@(
Html.Kendo().Grid<dynamic>().Name("Grid")
.DataSource(ds => ds.Ajax()
.Model(m =>
{
foreach (System.Data.DataColumn column in Model.AssessmentData.Columns)
{
m.Field(column.ColumnName, column.DataType);

}
})
.Read(r => r.Action("GetStudentResult", "StudentDetail",
new { studentID = "#=StudentID#", headerID = "#=HeaderID#" }))
)
.Name("grid_#=HeaderID#")
.Columns(columns =>
{
foreach (System.Data.DataColumn column in Model.AssessmentData.Columns)
{
var c = columns.Bound(column.ColumnName);
c.Title(column.ColumnName + "_test");
c.ClientTemplate("<div class='test'>#:" + column.ColumnName + "#</div>");

}
})
.Sortable()
.ToClientTemplate()

)

Controller:

public ActionResult GetStudentResult([DataSourceRequest] DataSourceRequest request,
int studentID, int headerID)
{
DataTable dt = this.core.GetAssessResult(studentID, headerID,
this._loginInfo.SchoolID);

string test = JsonConvert.SerializeObject(dt.ToDataSourceResult(request));
return Content(test, "application/json");

}

Grid

answered on 30 Nov 2015