Questions on Kendo UI for jQuery Forum

1 answer

489 views

MVVM and binding events to Kendo UI Web Widgets

Hi, how can I bind some simple event like 'change' on MVVM to any of KendoUI widgets?
Example:

<input type="text" id="txtHours" class="kendoNumeric input-mini" data-bind="value: hours, change: hoursChange" />

And this is exception in web browser:
Uncaught Error: The change binding is not supported by the NumericTextBox widget

Binding events in similar matter for any other non-Kendo widget or controls works just fine.
Am I doing something wrong or binding just doesn't work for Kendo controls?

MVVM

answered on 29 May 2012

0 answers

97 views

Cant Load Grid

Im trying this in jsfidler, but it doesnt work...

$("#grid").kendoGrid({
  dataSource: {
  type: "odata",
  transport: {
  read: {
  //using jsfiddle echo service to simulate JSON endpoint
  url: "http://www.letsdokaraoke.com/api/Artists?format=json",
  dataType: "json"
  }
  },
  schema: {
  data: 'artists'
  }
  },
  height: 250,
  columns: [
  {
  field: "ID"},
  {
  field: "Name"}

  ]
});

Any Ideas?

Data Source

asked on 29 May 2012

1 answer

110 views

Slider is not working with the latest commercial version

We’re developing a mobile application where we must use some sliders to update the value of one gauge. We were using your trial version and everything works great. However when we switch to your commercial version we got a huge bug: the slider doesn’t work, we cannot slide the slider from the web or any Mobile.

Slider

answered on 29 May 2012

0 answers

91 views

schema object - parsing issues in different mobile views

I have a datasource for messages and list a snippet of all the messages on one mobile view and view the full message in another mobile view. I use the schema: parse function to make a snippet of the message on the list messages page. This appears to be working well, however I do get an error message, "message is undefined" whenever I update the datasource.

I also have a similar error "rawDate.split is not a function", which is also initiated from the schema and again, only occurs when the datasource is updated.

Anyone any ideas why this is and what I can do to fix it?

var messageDataSource = new kendo.data.DataSource({

transport: {

read: "/messages/data",

dataType: "json",

update: {

url: function() {

var url = "/messages/markasread/" + message_id + "/" + message_read;

if (message_read == 0){

if(unread_messages != 0){

var new_unread_messages = unread_messages-1;

} else {

var new_unread_messages = unread_messages;

}

} else if (message_read == 1){

var new_unread_messages = unread_messages+1;

}

$("span#unread_messages").html(new_unread_messages);

$("span#unread_messages_hp").html(new_unread_messages);

return url;

},

type: "POST",

dataType: "json"

},

destroy: {

url: function() {

var delurl = "/messages/delete/" + message_id;

return delurl;

},

type: "DELETE",

dataType: "json"

}

},

error: function(e) {

alert(e.responseText);

},

sort: { field: "created", dir: "desc" },

schema: {

model: {

id: "id",

fields: {

message: { type: "string" },

shortMessage:{ type: "string"},

customer_name: { type: "string" },

customer_telephone: { type: "string" },

ip: { type: "string" },

created: { type: "date", parse: parseDate },

formatedCreated: { type: "string"},

shortCreated: { type: "string" },

email: { type: "string" },

isnew: { type: "string" }

}

},

parse : function(data) {

$.each(data, function(i, val){

//reduce text of message if being used for list

var message = val.message;

if (message.length > 100){

var shortText = jQuery.trim(message).substring(0, 100).split(" ").slice(0, -1).join(" ") + "...";

} else {

var shortText = message;

}

val.shortMessage = shortText;

//format the date

var created = parseDate(val.created);

val.shortCreated = formatDate(created);

val.formatedCreated = val.created;

});

return data;

}

});

function parseDate(rawDate) {

var bits = rawDate.split(/[-\s:]/);

var year = bits[2];

var month = bits[1]-1;

var day = bits[0];

var hour = bits[3];

var minute = bits[4];

var validDate = new Date( year, month, day, hour, minute );

return validDate;

}

Data Source

asked on 29 May 2012

8 answers

212 views

Append on sub-item not show the image right-arrow

Hi,
I use the example of this page http://piyushbhatt.blogspot.it/2011/12/kendoui-adding-menu-using-web-service.html,
but if want add a sub-menu i use parentItem = parentItem.find("li:contains('" + listParent[i] + "')");
The sub menu is add but then image right-arrow not show
Why ?

Thanks

Menu

answered on 29 May 2012

0 answers

85 views

Filter an expanded table

Hi

I have creatred an oData feed that has two tables, Product and ProductAttributes. Given that ProductAttributes is a child table of Products how would I filter the oData via this table. Can this be achieved as follows: (proposed filter in [bold])

    var products = new kendo.data.DataSource({
        type: "odata",
        transport: {
            read: {
                url: "http://odata.com/DataService.svc/Products",
                data: {
                    expand: "ProductAttributes",
                    filter: [{ field: "AttributeType", operator: "contains", value: "Range"},
                               {...},
                               {...}]
                }
            },
        },
        pageSize: 30,
        serverFiltering: true,
        serverPaging: true,
        serverGrouping: true,
        serverSorting: true,
        aggregate: [{ field: "Price", aggregate: "max" }, { field: "Price", aggregate: "min"}]
});

Data Source

asked on 29 May 2012

2 answers

130 views

TreeView value - jquery help

I have my treeview output as below:-

<div class="k-mid">
<span class="k-icon k-plus"></span>
<span class="k-in k-state-hover">
<span categoryId="11">TestNameHere</span>
</span>
</div>

When I select a node from the treeview I can alert(treeview.text(e.node)) to get the text - but I need access to the categoryId value, anyone know how I can get this?

Thanks

TreeView

answered on 29 May 2012

1 answer

151 views

disabled certain days

hello
I have a datepicker which I disabled certain days.
as this can be done?

regards

Date/Time Pickers

answered on 29 May 2012

4 answers

229 views

Custom editor - small issue

I have the following function for a custom editor:

function myEditor(container, options) {
$('<input data-text-field="name" data-value-field="id" data-bind="value:' + options.field + '"/>')
.appendTo(container)
.kendoDropDownList({
autoBind: true,
dataSource: {
type: "json",
transport: {
read: "http://myurl"
}
}
});
}

My data source has two properties, "id" and "name", The "name" is shown in the dropdown and the "id" is submitted to my database.
Everything works fine and my data is sent as I intend it to be. The problem is that my grid then shows the "id" property of my data after the item is added, instead of the "name" property. If I refresh, the data is read from my database via the main grid datasource definition and everything shows correctly.

How can I make my grid show the "Name" property without synching the data source?

Any help appreciated, thanks.

Grid

answered on 29 May 2012

2 answers

1.4K+ views

Default grouping column

Is there a way to set a default grouping column so that the grid is grouped on loading?

Grid

answered on 29 May 2012