Questions on Kendo UI for jQuery Forum

1 answer

89 views

loosing my mind

Hello ..
need some help before my brain explodes..
cant seem to understand what im doing wrong

have a quite simple autocomplete.

$(document).ready(function () {

var data =new kendo.data.DataSource({

serverFiltering: true,

transport: {

read: "data/output.txt"

}

});

$("#input").kendoAutoComplete({

dataSource: data

});

But no matter how hard i try i dont get the result i want, just the list with one letter vertical..?
I dont know how am the external file supposed to look? as now it just is:
"value1",
"value2",
"value3"

AutoComplete

answered on 30 Nov 2012

1 answer

235 views

Need help mapping with remote Json

I am not sure how I should map this data to get it to the datasource. I have read the docs but am not sure how to map this data. If I change the url back to the demo.kedoui.com/service the data: event fires and binds ok. With my url I get error event with msg error, but I do not see any data returned or how to fix this so the data is mapped correctly and the data event fires using my url json service.

Thanks

Data:

{"__entityModel":"People","__COUNT":3,"__SENT":3,"__FIRST":0,"__ENTITIES":[{"__KEY":"27","__STAMP":11,"ID":27,"firstName":"dan","lastName":"qqqq"},{"__KEY":"26","__STAMP":14,"ID":26,"firstName":"dan","lastName":"rrrr"},{"__KEY":"25","__STAMP":13,"ID":25,"firstName":"dan","lastName":"eeee"}]}

Code:

$(document).ready(function () {

//var crudServiceBaseUrl = "http://demos.kendoui.com/service",

// var crudServiceBaseUrl = "http://127.0.0.1:8081/rest",

var dataSource = new kendo.data.DataSource({

transport: {

read: {

url: "http://127.0.0.1:8081/rest/People",

type: "POST",

contentType: "application/json; charset=utf-8",

dataType: "json"

}

},

schema: {

data: function (data) {

alert("got data")

alert(data); /*Data Return Successfully*/

return data;

}

},

error: function (e) {

debugger;

alert("Error");

},

change: function (e) {

alert("Change");

},

requestStart: function (e) {

debugger;

alert("Request Start");

}

});

$("#grid").kendoGrid({

dataSource: dataSource,

pageable: true,

height: 400,

toolbar: ["create"],

columns: [

"firstName",

"lastName",

{ command: ["edit", "destroy"], title: " ", width: "210px" }],

editable: "inline"

});

Data Source

answered on 30 Nov 2012

1 answer

154 views

Programmatic ButtonGroup Items

Is there away to either bind a ButtonGroup to a model or programmatically modify it's collection?

Thanks,

Bron

ButtonGroup

answered on 30 Nov 2012

1 answer

405 views

Kendo MVC Grid with conditional area in ClientRowTemplate

Hi,

I am using the Kendo Grid with the MVC helpers, and want to make a conditional area in ClientRowTemplate.
Currently I have the following ClientRowTemplate:

.ClientRowTemplate("<tr

>" +

"<td

>" +

                           "${ FirstName} " +

"</td

>" +

"<td>

" +

                           "${ LastName} " +

" </td

>" +

"</tr

>" +

"${optionalNotes(Notes)}")

and this JavaScript:

function optionalNotes(t) {

if (t.length > 0) {

return "<tr><td colspan='2'>" + t + "</td></tr>";

} else {

return "";

}

This works partially. My JavaScript is being fired, but the result is escaped before it is being added into the grid. So, instead of getting an optional tablerow with Notes, I get the html displayed.
Is there any way to indicate to Kendo to treat the JavaScript output as raw HTML in this context?
Thanks,
Ewald

Grid

answered on 30 Nov 2012

1 answer

226 views

Multiple check boxes in Kendo UI Grid

How to add multiple check boxes in Kendo grid column. I am using trial version of kendo grid in SharePoint.

Please advice.

Grid

answered on 30 Nov 2012

1 answer

174 views

[Solved] Send kendo.data.Model object back to ASP.MVC

How do I send the object constructed using kendo.data.Model back to ASP.MVC?

For example, a person object is create using the kendo.data.Model using the code below

var Person = kendo.data.Model.define( {

id: "personId", // the identifier of the model

fields: {

"name": {

type: "string"

},

"age": {

type: "number"

}

});

var person = new Person( {

name: "John Doe",

age: 42

});

My first question - How do I use a $.Ajax() to send the object back to my ASP MVC action (e.g AddPerson)?

function addPerson(person) {

$.ajax({

url: "/Person/Add/"

});

}

My second question - How do i bind the receive model on the server side code?

[AcceptVerbs(HttpVerbs.Post)]

public ActionResult Add([DataSourceRequest] DataSourceRequest request, Person person)

{

// Code to add person to database.

}

Grid

answered on 30 Nov 2012

1 answer

326 views

PanelBar DataSource usage

The PanelBar's usage of the DataSource is different than that of the DropDownList's. Is there a specific reason for this?

It would be nice to have the same API between controls for modifying data.

$('#element').data('kendoPanelBar').dataSource; // undefined

PanelBar

answered on 30 Nov 2012

3 answers

138 views

Filtering of columns not working

i have downloaded trial version of Kendo UI Grid. The filtering of the grid column is working only for the 2 to 3 columns, not for all columns (i have 7 to 8 column). Is there any restriction on the number of column can filter on the grid?

please advice.

kalpesh.

Grid

answered on 30 Nov 2012

1 answer

138 views

Application Example Missing Files

I am trying to get started using Kendo UI Mobile and I want to play around with the application example from the trial download but it only has the index.html file and is missing the play-music.html and music-store.html files. The online example on your web site shows displays these pages but also does not show the code from these pages. It would be nice to see these since I intend to build a multi view mobile site and seeing some actual code that works would help me get moving forward quicker. Can someone point me to where these files are?

Thanks

Application

answered on 30 Nov 2012

4 answers

251 views

JS kendoGrid applied to MVC grid, problem.

Hi:

I am trying the following approach:

@model IEnumerable<Mvc3App.Models.Employee>

@{

ViewBag.Title = "Index";

}

<script type="text/javascript">

$(document).ready(function () {

alert('stopped');

$("#kjsimpleGrid").kendoGrid({

groupable: true,

scrollable: true,

sortable: true,

pageable: true

});

</script>

<p>

@Html.ActionLink("Add", "Create")

</p>

<table id="kjsimpleGrid">

<thead>

<tr>

<th></th>

<th>Id</th>

<th>Last</th>

<th>First</th>

<th>Title</th>

<th>City</th>

<th>Region</th>

<th></th>

</tr>

</thead>

<tbody>

@foreach (var item in Model) {

<tr>

<td>

@Html.ActionLink("Edit", "Edit", new { id=item.EmployeeID }) |

@Html.ActionLink("Details", "Details", new { id=item.EmployeeID })

</td>

<td>@Html.DisplayFor(modelItem => item.EmployeeID)</td>

<td>@Html.DisplayFor(modelItem => item.LastName)</td>

<td>@Html.DisplayFor(modelItem => item.FirstName)</td>

<td>@Html.DisplayFor(modelItem => item.Title)</td>

<td>@Html.DisplayFor(modelItem => item.City)</td>

<td>@Html.DisplayFor(modelItem => item.Region)</td>

<td>@Html.ActionLink("Delete", "Delete", new { id=item.EmployeeID })</td>

</tr>

}

</tbody>

</table>

And I am getting the following js error:
Microsoft JScript runtime error: Invalid template:

I would like to use as much js as possible and not depend on helper extension methods.

Phil
The error message is:
Microsoft JScript runtime error: Invalid template:'<tr data-uid="#=uid#"><td>#=#</td><td>#=Id#</td><td>#=Last#</td><td>#=First#</td><td>#=Title#</td><td>#=City#</td><td>#=Region#</td><td>#=#</td></tr>' Generated code:'var o,e=kendo.htmlEncode;with(data){o='<tr data-uid="'+(uid)+'"><td>'+()+'</td><td>'+(Id)+'</td><td>'+(Last)+'</td><td>'+(First)+'</td><td>'+(Title)+'</td><td>'+(City)+'</td><td>'+(Region)+'</td><td>'+()+'</td></tr>';}return o;'

Grid

answered on 30 Nov 2012