Questions on Kendo UI for jQuery Forum

2 answers

148 views

DropDownLists bind the first time but not on subsequent binding

Using the dropdownlist (3) in a mobile web app, using a tabstrip and 3 views. The dropdowns are populated based on data returned after a user enters a value in a textbox. The onblur calls a function which fetches data via Ajax and then populates the dropdowns and a few textboxes. The ajax calls returns all the data needed, there is not a separate call for each dropdown.

My problem is that it always works correctly on the first binding but never on subsequent bindings. I've confirmed that the subsequent ajax calls are returning data and I've also wired up an alert message to the dataBound event for each dropdown and that also fires.

After seeing this problem I thought that maybe clearing the dropdowns before binding might solve the problem but it does not, still have the same issue. I assume there is one small piece I am missing but not sure what that might be.

I don't think this is a browser related issue because it happens in Chrome, Safari, IE, Safari for iPhone and the Android browser.

DropDownList

answered on 14 Jul 2012

3 answers

411 views

Loading Datasources

Hi,

today i have tried to read the data out of a datasource....

i have just seen this post: http://www.kendoui.com/forums/framework/mvvm/mvvm-source-binding-to-datasource.aspx

which is bascially what i have been trying to do all day.

tho trying the answer doesn't work, when using kendo.bind($("#container"), a); it Never hits the controller action method (using MVC3) leading me to believe that the datasource never calls the server.

VIEW:

@section ViewModel

{

<script type="text/javascript">

$(function () {

var a = kendo.observable({

theList: new kendo.data.DataSource({

transport: {

read: "/home/zaza",

dataType: "json",

type: "POST"

},

schema: {

model: {

id: "ID",

fields: {

ID: {

editable: false,

nullable: false

},

Name: {

editable: true,

nullable: true

}

})

});

kendo.bind($("#container"), a);

});

</script>

}

<h2>@ViewBag.Message</h2>

<div id="container">

<ul data-role="listview" data-template="ul-template" data-bind="source: theList">

</ul>

</div>

<script id="ul-template" type="text/x-kendo-template">

<li>

id: <span data-bind="text: ID"></span>

name: <span data-bind="text: Name"></span>

</li>

</script>

HOME - CONTROLLER:

public class Place

{

public int ID { get; set; }

public string Name { get; set; }

}

[HttpPost]

public JsonResult zaza()

{

List<Place> plases = new List<Place>();

plases.Add(new Place() { ID = 0, Name = "Larocque" });

plases.Add(new Place() { ID = 1, Name = "St-Louis" });

plases.Add(new Place() { ID = 2, Name = "Dorval" });

plases.Add(new Place() { ID = 3, Name = "St-Pierre" });

return Json(plases, JsonRequestBehavior.DenyGet);

}

I have had limited success creating a datasource and calling read() on it, but could never get the data out afterwards.

what im trying to do:

1) define #view with binding templates
2) read remote datasource
3) bind that data array (from item 2) to a viewModel property (viewModel.Groups = data???)
4) bind the viewModel to the view (using kendo.bind($("#view"), viewModel);)

I have foudn this very hard to do...

I should say im a Noob to javascript so maybe im making a basic silly mistake... but for the life of me i can figure out what.

Thank you in advance

Rhys Walden

Data Source

answered on 14 Jul 2012

2 answers

269 views

Can't get selectedItem in DataGrid when using rowTemplate

Hi guis, thx before everything:

I'd like to use the amazing Kendo's Grid to take soma advantages like paging, filtering through DataSource and more.
As I show up in ths fiddle http://jsfiddle.net/dsubiros/5fXZq/ , I can't get selectedItem when I'm using a rowTemplate.

In this example if I change the attribute columns by " columns: ['OrderID', 'ShipName'] ", and comment out the rowTemplate attribute, grid works as expected, but I need to be able to use a template, and still get grid's selected row.

$("#grid").kendoGrid({
dataSource: dataSource,
pageable: true,
selectable: true,
rowTemplate: kendo.template($("#rowTemplate").html()),
columns: [''],
change: function() {
var id = this.select().data("id");
$("#log").html("LOG: selected id = " + id);
}
});

Please help me out.

Grid

answered on 13 Jul 2012

0 answers

123 views

Command buttons styles?

Hello, is there a way to change the style of the command buttons like in telerik ? To only text, text + image or just an image ?

Thanks!

Grid

asked on 13 Jul 2012

2 answers

369 views

Configure the Kendo UI DataSource, so it would issue requests only for specific (displayed) fields?

In my instance, a Kendo UI grid is bound to a OData service. The service exposes a table with many (200+) fields. The app allows users to configure displayed field set of the Grid, set initial filters and sort parameters. The app configures the Grid, which then goes off and queries OData service.

The grid kendo.Data.DataSource is defined as:

var gridDataSource = new kendo.data.DataSource({
type: "odata",
transport: {
read: {
url: "@Url.Content(dynDataSource.Url)",
contentType: "application/json; charset=utf-8",
type: "GET",
dataType: "json"
}
},
pageSize: @Model.MaxPageSize,
serverPaging: true,
serverFiltering: true,
serverSorting: true,
filter: ...
}

Here's a sample request issued by the Grid (captured by Firebug):
http://localhost:22411/Data/Comp?%24inlinecount=allpages&%24top=1000&%24filter=DistrictCode+eq+%27460800%27

This returns all the fields of the table, which is a problem. The fields need to be limited by selecting only the required fields, the request for which would look like:
http://localhost:22411/Data/Comp?%24inlinecount=allpages&%24top=1000&%24filter=DistrictCode+eq+%27460800%27&%24select=DistrictCode,DistrictName,DistrictNumber

Again, how to configure the grid for this to happen?

Data Source

answered on 13 Jul 2012

5 answers

109 views

Tooltip isn't be read

Hello everyone

I have a little problem with my last column ´s tooltip; it isn´t be read.
I do not want that the scroll (horizontal) appears on the page;

I tried with the CSS property overflow-x: hidden for hide my scroll; but it is worse because now I don´t have chance to see it.

It could be that the tooltip appears to the left of the series?

Regards,
M.

General Discussions

answered on 13 Jul 2012

0 answers

84 views

Change filelist zone destination

Hi

Is it possible to change the destination ul (k-upload-files k-reset) of uploaded files?

Thanks

Upload

asked on 13 Jul 2012

1 answer

170 views

mssql datetime field in json

Hi, I have another question and probably stems from my not accurately reading the documentation. Json gives me a date in the form:

{"ab_Id":"3",
"pr_Nazwa":"Subiekt GT",
"ab_Klucz":"fjo3r-3reft-et3fo-3rtt3-fwef2",
"adr_NazwaPelna":"ABC s.c. Sklep spo\u017cywczy",
"ab_DataDo":{
             "date":"2012-04-04 00:00:00",
             "timezone_type":3,
             "timezone":"UTC"
},
"adr_NIP":"894-56-53-563"},

How do I appeal to the variable $ { ab_DataDo } in the template assumed value of the field "date". Currently, my schema looks like this:

schema: {
                    model: {
                        fields: {
                            ab_Id: { type: "number" },
                            pr_Nazwa: { type: "string" },
                            ab_Klucz: { type: "string" },
                            adr_NazwaPelna: { type: "string" },
                            ab_DataDo: { type: "date" },
                            adr_NIP: { type: "string" }
                        }
                    }
                },

The question is probably pretty damn trivial.

Regards/Pozdrawiam
Paweł Kasztelan

Grid

answered on 13 Jul 2012

1 answer

134 views

Grid remote data that is processed before display?

I want to create a grid where the data for the grid comes from a remote datasource but then is re-packaged by a javascript function after the data arrives but before it is displayed (repackaged means some rows are dropped and only some fields are displayed). The grid needs to show a loading gif (as per usual) while waiting for the remote datasource and javascript function to complete processing. What is the right way to set this up?

This sort of thing (below) for example doesn’t work, because the processData() function completes without waiting for the remote datasource to return its data, plus the grid isn’t aware it needs to invoke its loading.gif.

Grid

answered on 13 Jul 2012

0 answers

233 views

Kendo Window multi-level pop-up opening within parent pop-up

Scenario: We have a page on which there are multilevel kendo window opening in an iframe.
For eg:If i open a window,it might have child windows,ideally the child windows should open as a individual entity,but what is happening my case child pop-pup get's appended to parent pop-up thereby restricting the movement of pop-up inside the parent pop-up.
My requirement is that i require pop-up to take grid as parent and should open as individual entity, so that i can move the pop-up outside the parent pop-up window.

Kindly let me know if there is any way to handle my scenario.

Window

asked on 13 Jul 2012