Questions on Kendo UI for jQuery Forum

0 answers

172 views

Hello,

I'm evaluating KendoUI for a project. One of the needs is to be able to dynamically update the text of the items in a DropDownList. With traditional HTML / JQuery, I can do the following:

<select id="myOptions">

<option value="0">Some Text</option>

<option value="1">Some Other Text</option>

<option value="2">Third Option Text</option>

</select>

...

$("#myOptions option[value='0']").text(getUpdatedText(0));

$("#myOptions option[value='1']").text(getUpdatedText(1));

$("#myOptions option[value='2']").text(getUpdatedText(2));

This works exactly as desired. I've tried something similar in Kendo, however, I haven't had any success. My most recent attempt looks like this:

<select id="myOptions">

<option value="0">Some Text</option>

<option value="1">Some Other Text</option>

<option value="2">Third Option Text</option>

</select>

...

$("#myOptions").kendoDropDownList();

$("#myOptions option[value='0']").text(getUpdatedText(0));

$("#myOptions option[value='1']").text(getUpdatedText(1));

$("#myOptions option[value='2']").text(getUpdatedText(2));

$("#myOptions").data("kendoDropDownList").refresh();

Unfortunately, the text of the options never updates. The reason I need to do this is because I need to update the text of the options on a regular interval. Can someone please tell me what I'm doing wrong?

Thank you!

DropDownList

asked on 21 Mar 2012

3 answers

257 views

grid remote data json

hi all;
im use grid for remote jsp return json data,for example:

[{title: "Star Wars: A New Hope", year: 1977}, {title: "Star Wars: The Empire Strikes Back", year: 1980}]

grid

<script type="text/javascript" >

$(document).ready(function(){

var sharableDataSource = new kendo.data.DataSource({

transport: {

read: {

url:"contract/test.jsp",

dataType: "json"

}

});

$("#grid").kendoGrid({

dataSource: sharableDataSource,

columns: [

{ title: "title", field: "title", width: 130},

{ title: "year", field: "year",width: 100},],

height: 550,

groupable: false,

scrollable: true,

sortable: true,

pageable: true

});

</script>

but grid empty,no any,pls help me ,thanks.

Grid

answered on 21 Mar 2012

0 answers

156 views

Kendo Chart & Knockout MVVM

Hi,

I am trying to find out whether its possible to associate a knockout view-model to chart data. The sample shows how to create chart using local data and remote data. But I couldn't find a way to tie the data of the chart to a view model. Can anyone please help me with this.

Thanks
Guru

Charts

asked on 21 Mar 2012

0 answers

73 views

Grid grouping not working on grid second initialisation

Hi,

I've run into a bit of an issue with the Grid on a second refresh of data.

I'm trying to do something a bit different as per the examples, and displaying the Grid through a different dataSource after every search on my site as it matches my coding structure better.

so I have:

Search -> Display grid + assign data source -> search again -> empty grid div (using $('#grid').empty()) -> display grid + assign data source.

This all works completely fine, other than it losing the actual grouping feature, the groupable panel shows but the grouping function no longer works.

Are there any workarounds for this?

Grid

asked on 21 Mar 2012

1 answer

268 views

How to show Threshold value in KendoUi Bar chart

Hi telerik team,

Is it possible to display threshold value line in the bar charts. As my requirements is to show the threshold value as a vertical line on the bar chart, so that the user can easily able to find which are out of limits..?

Thanks,
Rajesh

Charts

answered on 21 Mar 2012

1 answer

79 views

ShowConnectors property for bar graphs

Hi telerik team,

How to show visualized lines between the data points and the labels for bar graphs.

Thanks,
Rajesh

Charts

answered on 21 Mar 2012

1 answer

366 views

Datepickers in Grid

I have a very odd problem, my editable grid has a date field (ExpiryDate), so there is one in every line (row).
If i edit a row and i change the contents of the datefield, i 'lose' the variable ExpiryDate from my POST vars completely. (if i dont edit the date field, but i edit other fields (text) my code works perfectly.)
According to Firebug, the parameter called ExpiryDate is not even in the Post values (unless of course i didnt trigger the date picker flyout.
Obviously there is something i'm doing wrong. Please could someone take a look.
This happens if i edit inline, popup or incell.
Maybe i should be initializing the datepicker evertime i use it? but where?
Please help?

(i have a php/mysql datasoure and CRUD setup)


           $("#grid").kendoGrid({
               dataSource: {
                   transport: {
                       read: "data/users.php",
                       update: {
                           url: "data/users.php",
                           type: "POST"
                       },
                       destroy: {
                           url: "data/users.php",
                           type: "DELETE"
                       },
                       create: {
                           url: "data/users.php",
                           type: "PUT"
                       }
                   },
                   error: function(e) {
                       alert(e.responseText);
                   },
                   schema: {
                       data: "data",
                       model: {
                           id: "ID",
                           fields: {
                               EmailAddress: { validation: { required: true}, type: "string" },
                               FirstName: { validation: { required: true}, type: "string" },
                               SecondName: { validation: { required: true}, type: "string" },
                               AdvertType: { validation: { required: true}, type: "string"},
                               SubscriptionType: { validation: { required: true}, type: "string" },
                               ActivationCode: { validation: { required: true}, type: "string" },
                               ExpiryDate: { editable: true, type: "date", parse: function(value) { return kendo.toString(value) } }
                           }
                       }
                   }
               },

               pageable: true,
               height: 400,
               toolbar: ["create"],
               columns: [
                   { field: "EmailAddress", width: "250px" },
                   { field: "FirstName", width: "150px" },
                   { field: "SecondName", width: "150px" },
                   { field: "AdvertType", width: "100px" }, //, editor: advertTypeEditor },
                   { field: "SubscriptionType", width: "100px" },
                   { field: "ActivationCode", width: "150px" },
                   { field: "ExpiryDate", width: "150px", format: "{0:dd-MM-yyyy}" },
                   { command: ["edit", "destroy"], title: " ", width: "200px" }
               ],
               //editable: "popup",
               editable: "incell",
               detailTemplate: kendo.template($("#template").html()),
                detailInit: detailInit,
                        toolbar: ["create", "save", "cancel"],

           });

Grid

answered on 21 Mar 2012

1 answer

240 views

DropDownList in in-line editing

Hi,
I have a grid that uses in-line editing.
i need to add a dropdownlist (with datasource) to one of the columns when it's being edited.

Has anyone done this yet?
Please help me out.
I've tried a few ways.

I thought this would work:

in my column definitions:

               columns: [
                   ...
                   { field: "AdvertType", width: "100px", editor: advertTypeEditor },

later:
               function advertTypeEditor(container, options) {
                               $('<input name="' + options.field + '" id="Adverttypes" >').appendTo(container);
                            }

and then this:

           $(".Adverttypes").kendoDropDownList({
               dataTextField: "Adverttype",
               dataValueField: "ID",
               dataSource: {
                   transport: {
                       read: "data/adverttypesfordropdowns.php"
                   },
                   schema: {
                       data: "data"
                   }
               }

           });

But it's not working.

Please advise me....

Thanks,
Vauneen

Grid

answered on 21 Mar 2012

0 answers

164 views

Datepicker shows two months

Hi,

I have a filter in the grid. And that filter is on column of type : date. When i click on the calendar icon the datepicker is displayed. Now when i move to other month on clicking the next or previous arrow, it shows two months. I mean it shows the other month below the current month. but once it has moved to next month, it becomes alright. What is the issue here? Attaching the screen shot. Please help.

DatePicker

asked on 21 Mar 2012

0 answers

149 views

Grid width - scrollbar

I have a grid inside a jquery UI tab, and I'd like to have a horizontal scrollbar in the Grid.
I don't understand how it should work, it seems nothing change when I set the grid columns width.

see the problem in the picture attached

Thanks in advance

Grid

asked on 21 Mar 2012