Questions on Kendo UI for jQuery Forum

5 answers

502 views

Listview paging - Page change sending two requests

Hello,
I am attempting to use a Listview with serverPaging that has custom filtering applied to it. What I am seeing is when I apply a filter, the intial result set is coming back correct. When I attempt to change the page, I am seeing two dataSource requests. The first request has the correct querystring arguments passed, and the second has no arguments set.

How can I get the desired functionality without the extra datasource request? Code is below.

$("#user-Search").kendoDropDownList({

autobind: false,

enabled: true,

optionLabel: "All",

dataTextField: "text",

dataValueField: "value",

dataSource: userDataSource,

edit: function (e) {

var ddl = e.container.find('[data-role=dropdownlist]').data('kendoDropDownList');

if (ddl) {

ddl.open();

}

},

change: function () {

initGrid();

}

});

function initGrid() {

var ds = getDataSource();

var History = $("#listView").kendoListView({

dataSource: ds,

template: kendo.template($("#template").html()),

autoBind: false,

pageable: true

});

$("#pager").kendoPager({

dataSource: ds,

empty: "No Items to Display",

autoBind: false

});

}

function getDataSource() {

var dataSource = new kendo.data.DataSource({

transport: {

read: {

url: "/Services/TitleHistory.ashx?publishedid=" + $("#SearchHistory")[0].value + "&startDate=" + $("#datestart")[0].value + "&endDate=" + $("#dateend")[0].value + "&filterUser=" + $("#user-Search")[0].value,

dataType: "jsonp"

},

serverOperation:false

},

serverPaging: true,

schema: {

total: function (response) {

if (response[0]) {

return response[0].total;

}

else {

return 0;

}

},

model: {

id: "EventType",

fields: {

EventType: { editable: false, nullable: true },

Details: { editable: false, nullable: true },

Comment: { editable: false, validation: { required: true } },

User: { editable: false, validation: { required: true } },

EventDate: { validation: { required: true }, type: "date", format: "{0:MM-dd-yyyy}" }, editable: false,

Title: { editable: false, nullable: false },

UserId: { editable: false, nullable: false },

PublishedId: { editable: false, nullable: false, }

},

}

},

pageSize: 5

});

dataSource.fetch();

return dataSource;

}

ListView

answered on 12 Sep 2013

1 answer

135 views

Tooltip data-width not working with MVVM

Using the data-role attribute and setting the width option via html attributes doesn't seem to work.

The below code will not set the width option.
<span data-role="tooltip" data-width="200"></span>

I've found that this is because the width property is not set in the tooltip default options. I've temporarily fixed this using:
kendo.ui.Tooltip.fn.options.width = "";

This has been tested in v2013.2.716

ToolTip

answered on 12 Sep 2013

1 answer

85 views

Dirty icon not displayed when row template is used

I have a kendo grid which is having a row template specified. I have enabled 'incel' editing on it. It's displaying the dirty icon correctly when a cell is edited only when I'm not using the row template.
jsFiddle

Grid

answered on 12 Sep 2013

3 answers

94 views

Handling navigation exceptions in Kendo Mobile

Say for example a navigation times out (quite likely in a mobile situation where reception can be patchy) or the the request fails for another reason (due to a server-side exception for example). Currently this will cause the who app to freeze.

Is there a way to handle this exception and show a friendly message to the user and keep the app up and running? jQuery Mobile does quite a good job of this out of the box if ajax navigation or form posting fails and I'd like to do something similar with Kendo.

Application

answered on 12 Sep 2013

1 answer

235 views

Tree nodes with multiple links

We need a tree where each node has the form “some text a link more text a second link more text [bitmap]”. And we need an event when the user clicks on either link or the bitmap, letting us know which node in the tree and which link was clicked. Is it possible to create a tree like this using your system?

When the user clicks on of those links, at the point of the click we need to create an edit box with a drop-down tree (not list).
Can your system identify where the link was click to place a control there.
Is it possible to create an edit box with a drop-down tree. (If an element in the tree is clicked, it then populates the edit box with its text value.)
Is it possible to place this edit/tree control over the tree at that point?

And if so, how?
thanks - dave

TreeView

answered on 12 Sep 2013

5 answers

207 views

ListView Pager Template

I need to customize LiistView pager, how can I do it and where can I read about it?
I'm using MVC wrapper.

ListView

answered on 12 Sep 2013

1 answer

53 views

StockChart Navigator - can I use this independently?

I have a need for just the navigator functionality of the stockchart, the "bottom half" of it from the demo.

Is there anything that will allow me to break this out? Is it made using a different set of Kendo tools? any tips on recreating it, if so? Thanks -

General Discussions

answered on 12 Sep 2013

1 answer

186 views

How to set Height of the Stock Chart's Navigator

Hi,

I have to reduce Height of the Navigator area of Stock chart. Please help me in this regard.
Pleas find the screen shot of my current implementation in which I have highlighted navigator portion whose height has to be reduced.
Below is the view code.

@(Html.Kendo().StockChart<Nalco.enVision.Web.Areas.ServiceModule.Models.SensorChartModel>()

.Name("stockChart")

//.Legend(true)

//.Title(Model.ChartTitle)

.DataSource(ds => ds

.Read(read =>

read.Action("GetChartData", "Charts"))

.ServerOperation(true)

)

.DateField("MeasureDate")

.CategoryAxis(axis => axis.Name("dateAxis")

// .Labels(l => l.Rotation(90))

//.Title(Model.XAxisTitle)

.Title(t => t.Font("10px Arial"))

)

.ValueAxis(axis => axis.Numeric("valueAxis")

.Labels(l => l.Format("{0:n}"))

.Title(Model.YAxisTitle)

.Title(t => t.Font("10px Arial"))

)

.Series(series =>

{

series.Line(s => s.Value).Axis("valueAxis")

.Color("#3493D5")

.Tooltip(tooltip => tooltip.Format("{0:n}"))

.Tooltip(tooltip => tooltip.Template("Date:#= kendo.toString(category,'G') # <br/>Value: #= value #"));

}

)

.Navigator(nav => nav

//.DataSource(ds => ds.Read(read => read.Action("GetChartData", "Charts")))

//.DateField("MeasureDate")

.Series(series =>

{

series.Area(s => s.Value)

.Color("#3493D5");

})

)

.Events(e => e.SelectEnd("onSelectEnd"))

.HtmlAttributes(new { style = "height:" + Model.Height + "px;width:" + Model.Width + "px;" })

)

.

General Discussions

answered on 12 Sep 2013

1 answer

51 views

FX PageTurn Duration

Hi,
I'd like to change the pageTurn effect duration but i havn't find a property or a method to do that.
there's some way to achieve my purpose?

thanks
Fabio.

General Discussions

answered on 12 Sep 2013

2 answers

69 views

Cut and Paste from Word loose characters

I'm using a french version of Word, and when we write a text with an aposthrophe, Word won't use the real aphostrophe. There is two apostrophe in Word, here is the two samples :

This the wrong apostrophe :

L’Aventure

This is the right one :

L'aventure

Since our datebase is ASCII, Kendo editor will remove the first apostrophe, and replace it with a blank.

We will l have to escape / Unescape the text, and replace the wrong aposthrophe with thew right one.

I was wondering if the a better way around built in Kendo Editor.

The wrong aposthophe is a Unicode character, but the surely more other that will be removed.

Thanks

Editor

answered on 12 Sep 2013