Questions on Kendo UI for jQuery Forum

2 answers

544 views

Prompt to save changes when in batch editing mode

Hi,

I'm using the grid in an MVC 4 application, utilising the batch editing. I have two problems with the grid that I cannot work out.

1) If the user tries to navigate away from the page while there are dirty models I wish to prompt them appropriately. I tried the script below, however the data collection is of zero length and hasChanges returns false. Could you advise on the best way of providing this functionality please.

window.onbeforeunload = confirmLeavePage();

function confirmLeavePage() {

debugger;

var dataSource = $("#ValuesGrid").data("kendoGrid").dataSource;

var data = dataSource.data();

var hasChanges = dataSource.hasChanges();

for (var loop = 0; loop < data.length; loop++) {

if (data[loop].dirty) {

hasChanges = true;

break;

}

if (hasChanges) {

return

"You have made changes to the current values. The changes will be lost if you leave this page without clicking the save button"

;

}

2) If the grid is paged and you make changes in page 1 you correctly get the red indicator to show the changes, however if you navigate to page 2 and then back to page 1 the red indicator is no longer visible.

Grid

answered on 30 Jul 2013

1 answer

230 views

[Solved] Titles with double-quotes (") seem to break the tooltips.

During testing my titles were ["This is a test"] and this resulted in the tool tip rendering as "(9:00AM to 9:30AM) ["

Scheduler

answered on 30 Jul 2013

3 answers

144 views

All lists loading

Hello,

I'm implementing cascading dropdown lists in my web app. I currently have three lists and have them set up following the example listed on your site. However, when I make a selection in the first dropdown, the other two will then read in their data and become enabled. It doesn't cascade down properly like in the example. I don't see any difference between the example and how I have things coded, so perhaps someone here can see what I'm doing wrong. I want my lists to cascade properly. Thanks for any and all help. Code sample listed below.

<p>

<label class="searchLabel" for="state">State:</label>

@(Html.Kendo().DropDownList()

.Name("state")

.HtmlAttributes(new { style = "width:275px" })

.OptionLabel("Select state...")

.DataTextField("StateName")

.DataValueField("StateAbbr")

.DataSource(source => source.Read(read => read.Action("GetStates", "Home")))

)

</p>

<p>

<label class="searchLabel" for="county">County:</label>

@(Html.Kendo().DropDownList()

.Name("county")

.HtmlAttributes(new { style = "width:275px" })

.OptionLabel("Select county...")

.DataTextField("CountyName")

.DataValueField("CountyName")

.DataSource(source => source.Read(read => read.Action("GetCounties", "Home").Data("filterCounties"))

.ServerFiltering(true))

.Enable(false)

.AutoBind(false)

.CascadeFrom("state")

)

</p>

<p>

<label class="searchLabel" for="city">City:</label>

@(Html.Kendo().DropDownList()

.Name("city")

.HtmlAttributes(new { style = "width:275px" })

.OptionLabel("Select city...")

.DataTextField("CityName")

.DataValueField("CityName")

.DataSource(source => source.Read(read => read.Action("GetCities", "Home").Data("filterCities"))

.ServerFiltering(true))

.Enable(false)

.AutoBind(false)

.CascadeFrom("county")

)

</p>

<script>

function filterCounties() {

return {

state: $("#state").val()

};

}

function filterCities() {

return {

state: $("#state").val(),

county: $("#county").val()

};

}

$(document).ready(function() {

$("#state").data("kendoDropDownList");

$("#county").data("kendoDropDownList");

$("#city").data("kendoDropDownList");

});

</script>

DropDownList

answered on 30 Jul 2013

1 answer

163 views

Grid Sorting,paging,filtering,expand child,collapse child,refresh handles via button click

dear all,

i've the kendo grid which i need to manually enable the grid properties like sorting,filtering,paging,grouping via button click to the grid

i.e it is like a toolbar for the grid to enable or disable the sorting,filtering,paging,grouping,refresh when button click event occurs

this is my sample code to enable the properties

$("#grouping").click(function () {

$("#grid").data("kendoGrid").groupable(true);

});

$("#removegrouping").click(function () {

$("#grid").data("kendoGrid").groupable(false);

});

 $("#sorting").click(function () {

               $("#grid").data("kendoGrid").sorting(true);

            });

but it shows the error
may any one help for this thread
thanks in advance

Grid

answered on 30 Jul 2013

2 answers

118 views

Split view navigation using Action Sheet

I am having trouble navigating the main-pane of a split view off of an action sheet on the left-pane.

http://jsbin.com/uguwug/1/edit

Is there something I am missing ?

Thanks

Robin

SplitView

answered on 30 Jul 2013

1 answer

227 views

Editor keeps growing instead of scrolling on iPad

When we enter or view text in the Kendo Editor using an iPad, the editor appears to grow indefinitely instead of scrolling. When very long text is viewed, this means there is no way to get to the bottom of the text, since there is no scrollbar. This happens even when we view the editor demo (http://demos.kendoui.com/web/editor/index.html) on an iPad. We need to set a maximum height on the Editor so that iPad scrolling is available, and the editor does not grow. How can we constrain the height of the editor in this way? Setting HtmlAttributes with a max-height doesn't appear to do anything.

Editor

answered on 30 Jul 2013

1 answer

106 views

scroll splitter on iPad

Hi ,
I developed a single page application using kendo splitter for the whole page layout (one horizontal splitter on the top and two vertical on the middle).
I have a kendoGrid inside one of my splitter too (since maybe its related to Grid ,however I disabled scroll for grid scrollable: false). Although I get the scroll for my whole page and also inside splitters on PC , I don't get them on iPad.
I read most of the threads about scroll in iPad and I included all these files too but no success. (I managed to get scroll on android chrome browser but its too slower than normal pages)

.Include("~/scripts/kendoui/kendo.web.min.js")
.Include("~/scripts/kendoui/kendo.mobile.min.js")
.Include("~/scripts/kendoui/kendo.mobile.core.min.js")
.Include("~/scripts/kendoui/kendo.mobile.scroller.min.js")

I would appreciate any help on this issue,
Regards,
Atiyeh

Splitter

answered on 30 Jul 2013

1 answer

275 views

[Solved] How to update and delete current array item

Hi,
I have a master/detail scenario where I am trying to access the "current" array item and either update or delete it. The update/delete buttons are outside of the template so I am not sure how to accomplish this.

I have prepared a jsbin that has an array of names that can be added to and edited, but I cant update or delete. Any help would be appreciated!

http://jsbin.com/aligem/241/edit

Thank you,
David A.

MVVM

answered on 30 Jul 2013

2 answers

234 views

Connect to a JSON Web Service

Hello,
I am trying to connect to ASMX Web Service that returns JSON. Service receives strUser and strPassword as a parameter, and returns array of SomeEvents. SomeEvent has two fields: eventID and eventName.
I am getting internal server error, and I believe it has something to do with the format of the data I'm sending/receiving. I would be grateful if you take a look and tell me how to solve this:

var eventsModel = (function () {

var eventModel = {

id: 'eventID',
fields: {
Text: {
field: 'eventName',
defaultValue: ''
}
}
};
var eventsDataSource = new kendo.data.DataSource({
schema: {
model: eventModel
},
transport: {
read: {
url: ASMX + "GetOrganizerEventsJSON",
type: "POST",
data: { strUser: "someUsername", strPasswort: "somePassword" },
contentType: "application/json; charset=utf-8",
dataType: "json",
}
}
});
return {
events: eventsDataSource,
};
}());

Web method looks like this:
<WebMethod()> _
<ScriptMethod(ResponseFormat:=ResponseFormat.JSON)> _
Public Function getOrganizerEventsJSON(ByVal strUser As String, ByVal strPasswort As String) As SomeEvent()

General Discussions

answered on 30 Jul 2013

5 answers

705 views

Grid DetailExpand on selection

I've implemented a way to expand the detail view of a grid by selecting a row in the grid, but in doing so I noticed the expand arrow no longer works. Note that if the details are already expanded, the arrow will still cause the details to collapse. I've created a jsfiddle illustrating the problem here:

http://jsfiddle.net/RaRXg/

Is there another way to achieve the desired effect (expand by row selection) which still allows the arrow to expand the selection?

Thanks.

Grid

answered on 30 Jul 2013