Questions on Kendo UI for jQuery Forum

6 answers

1.1K+ views

[Solved] When using iframe, how to get instance of self window?

Open a window using an iframe.

How, using jQuery, would you get a reference to the window (from within the window) so you can close it?

Window

answered on 27 Dec 2012

16 answers

349 views

A Kendo Mobile question

I posted here since there is no forum for mobile apps yet. I have some simple questions.
1. If I build a simple one or two page Kendo web app, approximately how much of it can be moved to a native style Android app without major re-work?
2. I assume my server side data service will be the same for both. Correct?
3. Please briefly enlighten us on the differences and similarities.

I would like to start a Kendo app in about 2 weeks and deploy it on Android in February 2012. Making it a web app first would help with the testing and give us some leeway on when the mobile version is ready for prime time.

As an FYI to other developers. We are seeing several useful apps for pocket sized android devices and tablets for a large manufacturiing facility. Think: supervisors having notifications and live data in their pocket as needed and inspectors and maintenance people having always current procedures in their hands or pocket. The pricing makes android devices more attractive than traditional industrial devices.

I'm a .Net web and windows programmer and Kendo looks like the easiest way for me to get into mobile by leveraging my html and javascript skills.

Thanks,
Steve F

General Discussions

answered on 27 Dec 2012

1 answer

360 views

Multiple TabStrip Color Change

Hi,

Im using Kendo UI in my project i have 2 tabstip in my page i want to have different color for the 2 tabstip
1st tabstip in gray color
2nd tabstip in blue color
how to change the css of that ?

TabStrip

answered on 27 Dec 2012

1 answer

146 views

Pagination is not in sink in Listview

Hi All,

I have taken listboxes with button count 4. One of the listbox has more records when compare with second one. In this case, pagination was not in sink. Regardless of number of records(more/less), pagination look should be same & page button count, items per page,number of items should inline. I have tried in different ways. Nothing is working. How we can do that? Immediate help wolud be appreciated. I am attaching the screen shot also.

Regards,
Partha.

ListView

answered on 27 Dec 2012

1 answer

127 views

[Press to load more] button is highly UN-responsive on iPad/Pod

'ListView / Press to load more' example http://demos.kendoui.com/mobile/listview/press-to-load-more.html - [Press to load more] button is highly UN-responsive on iPad v6.0.1 (and elsewhere).

Here is example running out of the box: http://jsfiddle.net/jmucci/AKuGu/

I am unable to get the [Press to load more] button to respond to taps except on very few occasions.

ListView (Mobile)

answered on 26 Dec 2012

3 answers

833 views

ListView Template trying to add a partial View

I am trying to use a Partial View as a Template for the listView.

are there any exapmples?

The Template gives an error.

If I try to create a Script is does not pass ITEM that is in a loop in the listview.

<script type="text/x-kendo-tmpl" id="template">
<div class="item-box">
@Html.Partial("_ProductBox", item)
</div>
</script>

@(Html.Kendo().ListView<ProductOverviewModel>(Model.Products)
.Name("listView")
.TagName("div")
.ClientTemplate(@<text><div class="item-box">
@Html.Partial("_ProductBox", item)
</div></text>))
//.ClientTemplateId("template")
.DataSource(dataSource => {
dataSource.Read(read => read.Action("HomepageProducts", "Catalog"));
dataSource.PageSize(12);

})
.Pageable()
)

Templates

answered on 26 Dec 2012

3 answers

633 views

How to best access view model properties

In all of the examples I've seen, view model properties are accessed using the "this" keyword. For example:

this.get("name")

This is not always possible. Consider the following example:

I have a ListView (mobile, btw) and above it I have a search text box that does an "instant search" of sorts while the user types. The text box looks something like this:

<input type="text"
data-value-update="keyup"
data-bind="value: searchText, events: { keyup: searchForItem }" />

searchForItem makes an async ajax call and the success callback updates the ListView. The trouble is that "this" does not refer to the view model in the call back. What is the right way to access the view model and it's properties in this type of situation? The only way I seem to be able to do this is to make all the view models available from the global name space. For example:

//app is global

app.viewmodels.carsViewModel.get(

"cars").push(car);

This seems to work but is there a better or more elegant approach? Not to mention that I am using require.js to organize my project and would prefer to have nothing in the global namespace.

BTW, I am running into the same problem with declarative binding. Since I am using require.js it seems like the only way I can reference tthe view model is something like this:

<div id="carsView"

data-role="view"

data-model="app.viewmodels.carsViewModel">

Thanks!

MVVM

answered on 26 Dec 2012

3 answers

287 views

BeforeChange or Selectable=False

I have a master details setup where all of my items are in a listview that uses a template to show a summary of their details. Once an item is selected, another template is renderend that shows an editable form for the selected item. I am not using the Edit functionality of the listview. I would like to prevent the user from selecting a different item if the currently selected item isDirty.
My question is, would it be best to set Selectable=False when the current item has changes and then to True after changes have been saved/cancelled or is there a better way to handle this scenario? Would changing the Selectable value even work or is this something that can only be set during initialization?
Based on similar posts, there seems to be many requests for an event to cancel the Change event of the listView. I hate to ask, but are there any plans to implement this functionality?

I am also experiencing an issue where the uid of the selected listview item seems to change when cancelChanges is called on the underlying datasource. Is this expected behavior?

thanks,

ListView

answered on 26 Dec 2012

18 answers

1.5K+ views

Destroy command in toolbar

When I set the toolbar to display a delete button, nothing happens when I click on it.
But it works when I add a destroy column. Should I do something special to active the delete button in toolbar?

here is my code:

$("#grid").kendoGrid({

dataSource: _ds,

height: 350,

scrollable: false,

pageable: true,

sortable: false,

//selectable: "multiple, row",

navigatable: true,

columns: [

//{title: "Id", field: "Id", width: 150},

{title: "Name", field: "Name", width: 150},

{title: "Description", field: "Description", width: 300}

],

toolbar: ["create", "destroy", "save", "cancel"],

editable: true

});

_ds = new kendo.data.DataSource({

type: "json",

serverPaging: true,

serverSorting: true,

pageSize: 15,

batch: false,

transport: {

read: {

url: "@Url.Action("GetRoles", "Role", new { area = "UserManagement"})"

},

update: {

url: "@Url.Action("UpdateRole", "Role", new { area = "UserManagement" })"

},

destroy: {

url: "@Url.Action("DeleteRole", "Role", new { area = "UserManagement" })"

},

create: {

url: "@Url.Action("CreateRole", "Role", new { area = "UserManagement" })"

}

},

schema: {

data: function(data) {

return data.result;

},

total: function(data) {

return data.totalCount;

},

model: {

id: "Id",

fields: {

Id: { editable: false, nullable: false },

Name: { editable: true, validation: { required: true } },

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

}

},

error: function (e) {

var json = jQuery.parseJSON(e.responseText);

alert("An error has occured: " + json.Message);

}

});

Grid

answered on 26 Dec 2012

1 answer

701 views

Chart ValueAxis positioning

Hi, wondering if there is a way to position the valueaxis labels to the right side of the chart. I know you can mirror the labels, but I was wondering if we can position them on right side. I can only find an API for mirror.
thanks
Marty

    @(Html.Kendo().Chart()
        .Name("chart")
        .Title("Trend (30 Days)")
        .HtmlAttributes(new { style = "height:240px;" })
        .SeriesDefaults(seriesDefaults =>
            seriesDefaults
            .Line()
            .Stack(true)
            .Width(1)
            .MissingValues(ChartLineMissingValues.Interpolate)
            .Markers(false))
        .ValueAxis(v=>v.Numeric().Labels(l=>l.Mirror(true)))

Charts

answered on 26 Dec 2012