Questions on Kendo UI for jQuery Forum

3 answers

359 views

Date column shows null/empty in kendo grid

Here is my Model

model: {
id: "MSOrderNumber",
fields: {
OrderNumber: { type: "number" },
OrderDate: { type: "date" },
},
},

The grid source's model is
public class Result
{
public string OrderNumber { get; set; }
public DateTime OrderDate { get; set; }
}

The OrderNumber is bound properly but the OrderDate field shows up empty and also there is filter on this Date column, it should work on date filter.
Am I missing something here ? Any extra definition or anything like that required ?

Grid

answered on 27 Nov 2013

5 answers

580 views

Initial Text for ComboBox with Remote DataSource

I have a combox where the choices are driven by a remote datasource as follows:

input.kendoComboBox({

dataTextField: 'label',

dataValueField: 'id',

dataSource: {

type: "json",

serverFiltering: true,

transport: {

read: {

url: 'api/getchoices,

data: {

filter: function(){

return input.val();

}

});

The comboxbox is also bound to a view model

<input data-role="combobox" data-bind="value: id"/>

My problem is that when the page initially loads, the combobox shows the value of the id field and not the label that corresponds to that id. This is not an issue if I use a local array as the datasource, but the remote datasource is filtered based on user input and not designed to look up label based on id.

In code (in the viewmodel actually) I have the value of the label corresponding to this id, and I would like it to appear when the form is loaded.

I was thinking to possibly append an additional item (current id/label) onto the datasource list of choices, but I also don't want to query the remote datasource unless the user interacts with the control.

What is a good way to have the combobox display the label when the page loads, but also not disturb the id value which is stored in the view model unless the user actually changes the control value?

Also, can anyone comment the use of input.val() to feed my remote query. I do want to use the value that the user has typed in, but am wondering if combobox has some built-in alternative to using input.val().

ComboBox

answered on 27 Nov 2013

3 answers

104 views

[Solved] IOS7 Safari Footer Problem

I know there's been quite a bit of discussion about IOS7 problems and content being obscured, but I couldn't find any help for my issue specifically. I apologize if there is already forum on this...

I'm not looking for help with an app or phonegap, just want my mobile web app to display properly in Safari on IOS7. My problem is with the footer, the bottom Safari toolbar is obscuring my content. I've seen with other websites that the footer bar disappears when you scroll, but that doesn't happen with my Kendo app, scrolling up and down doesn't change anything - it's always blocking the bottom of my content. Since this is a mobile website that isn't just for IOS7, I'm hoping to not have to add a margin to the bottom of my page.

Here's a couple screenshots to illustrate what I mean, this is when the user has scrolled all the way down to the bottom of the page. There is a button at the very bottom that is hidden in behind the Safari toolbar that the user can't see or click on.

I read somewhere that Safari refuses to hide this bottom toolbar if the body height is set to 100%, which it looks like Kendo Mobile does. Trying to override the body height doesn't look like a good idea :-)

Anyone else run into this issue, or can point me at another blog or forum post with a solution?

General Discussions

answered on 26 Nov 2013

1 answer

139 views

Badge: Issues (1 of 2)

ISSUE #1:

I tested and found you can not apply a badge with value of 0 (zero).
I can understand the original logic why - however it is problematic with dynamic updates of the value via jQuery. Instead of it disappearing it does nothing and leaves the old value.

<div id="foo" data-role="view">

<a data-role="button" data-badge="1" data-click="resetClicks">Reset Badge Count</a>

</div>

<script>

var app = new kendo.mobile.Application();

function resetClicks() {

this.badge(0); //set new badge value

}

</script>

You might consider adding another option flag: data-badge-showzeros to handle all possibilites of user needs. Some may want to show Zero values and other not.

Button (Mobile)

answered on 26 Nov 2013

1 answer

215 views

[Solved] Event Template height

I dont need to see all events, I only need to ensure that I can set the height of an event template, to allow for say 2 lines of a title to show up. the current issue I am having is that I cant seem to add any CSS styling on top of my event to ensure that the event template renders using say height auto, or even just height: 45px

just a random number, but my point is still valid, I need to know how to expand the height of an individual event to at least show two lines.

attached is a screen shot from a project I am working on, as you can see the events are only one lined and cuts off the rest of the title.

suggestions?

Scheduler

answered on 26 Nov 2013

1 answer

126 views

Checkbox Delay on tap

Hi,

In the Q2 and Q3 release either flat or native Os when you add a checkbox to a listview and trying to tap it there's a huge delay for the checkbox to be checked or the other way around which is unchecked.

that wasn't their in Q1

General Discussions

answered on 26 Nov 2013

1 answer

227 views

Problems selecting node - dataSource.read() not working

Hi

I have a treeview bound to a hierarchial data source from a database and use the requestEnd event to expand all nodes which works fine.

When I add a node via an ajax call it adds the data to the database correctly and I call dataSource.read() to refresh the treeview as part of my ajax success function:

success: function () {

foundItem = false;

$("#tree").data("kendoTreeView").dataSource.read();

}

I then use the following code to find the item added (the unique name of which is stored in toSelectText) when the read function binds the tree, select it and display the details:

function onBound(e) {

if (toSelectText != null && !foundItem) {

var treeview = $("#tree").data("kendoTreeView");

var selectitem = treeview.findByText(toSelectText);

if (treeview.text(selectitem) == toSelectText) {

treeview.select(selectitem);

treeview.trigger("select", { node: selectitem });

foundItem = true;

}

};

The foundItem variable is used because the call to this function is made many times as the read builds up the child data for each node.

For the first item that is added it works perfectly but for the second and subsequent items the dataSource.read() is not fired and the tree is not updated and the added item is not therefore selected.

Am I going about this the right way? Why would it work for the first item added but not subsequent items?

Many thanks in advance

TreeView

answered on 26 Nov 2013

5 answers

1.3K+ views

Remember expanded details row on read/refresh.

I have a scenario with grid within grid implemented using the detailInit method. Here when user makes edit, i do some calculations that will change the data in the both parent and child. and then to refresh data, i will call the datasource.read to render data. this works and the data is displayed, however any detail grid which are expanded will be collapsed, is there any way i can prevent this from happening.

Regards,
Pramod
SyneITY

Grid

answered on 26 Nov 2013

3 answers

262 views

Menu sub-menu rendering "bouncing" issue

This is a very difficult issue to explain so I'm going to give you some instructions on how to replicate it and see it for yourself.

1. Go to the Kendo menu demonstration page demonstrating the possible directions.
2. Hover over the "Girl's" menu.
3. Hover over any sub-menu.

When you do this you should see that all the arrows seem to "bounce" when the sub-menu opens. If you move the mouse up and down the "Girl's" sub-menu items you can clearly see all the arrows within that menu bounce. This does not happen in any other menu (except when it is the third or greater menu option along and I've checked the CSS, it does not appear to be that which is causing this; I suspect it is a scripting issue.

This also happens on the Orientation demo page, and it even happens with you change the orientation to vertical.

I've attached a screencast in case it is just my browser, but I'm using the latest version of Chrome (v. 31.0.1650.48 m).

Menu

answered on 26 Nov 2013

2 answers

217 views

[Solved] Listview Indexing Problem

ListView Definition

var carriers = $("#carrierList").kendoListView({
dataSource: t94StragglerCarriers,
selectable: true,
pageable : true ,
change: onChange,
dataBound: onDataBound,
dataBinding : onDataBinding ,
template : kendo.template($("#carrierTemplate").html())
}).data("kendoListView");

Template Definition

DataSource Definition

var t94StragglerCarriers = new kendo.data.DataSource({
transport: {
read: {
url: "/MenuTrain/T94StragglerCarriers",
dataType: "json"
},
schema: {
model: {
id: "id",
fields: {
id: {type : "string"} ,
val: {type : "string"}
}
}
},
pageSize: 5,
serverPaging : true
}
});

I've tried several variations for the datasource. From not specifying the schema to just specifying the id.

OnChange Event Handler Definition

function onChange() {
var listView = $("#carrierList").data("kendoListView");
var index = listView.select().index();
var item = listView.dataSource.view()[index];
console.log("Item " + index + " selected. Text = " + item.id);
}

Here is the json string returned from my controller's action method:

[{"id":"10eac72a-d62d-434f-8505-4869cdb27b04","val":"CHTT"},{"id":"10eac72a-d62d-434f-8505-4869cdb27b04","val":"CMO "},{"id":"10eac72a-d62d-434f-8505-4869cdb27b04","val":"CTCX"},{"id":"10eac72a-d62d-434f-8505-4869cdb27b04","val":"DBUX"},{"id":"10eac72a-d62d-434f-8505-4869cdb27b04","val":"GATX"},{"id":"10eac72a-d62d-434f-8505-4869cdb27b04","val":"MWCX"},{"id":"10eac72a-d62d-434f-8505-4869cdb27b04","val":"NDYX"},{"id":"10eac72a-d62d-434f-8505-4869cdb27b04","val":"PLMX"},{"id":"10eac72a-d62d-434f-8505-4869cdb27b04","val":"TAEX"},{"id":"10eac72a-d62d-434f-8505-4869cdb27b04","val":"TCIX"},{"id":"10eac72a-d62d-434f-8505-4869cdb27b04","val":"TEIX"},{"id":"10eac72a-d62d-434f-8505-4869cdb27b04","val":"TILX"},{"id":"10eac72a-d62d-434f-8505-4869cdb27b04","val":"UP "},{"id":"ffbcdb6c-4d3a-45f6-8ef6-ada5f28ba44b","val":"MDXx"}]

The listview renders correctly. But it's as if the listview's select().index() methods are treating each field as an item. For example , the first object's id field is index 0, the first object's val field is index 1, and so on.

What am i doing wrong here?

ListView

answered on 26 Nov 2013