Questions on Kendo UI for jQuery Forum

3 answers

319 views

I am having an issue at work right now (in fact it's not just this control) I think that I am doing something wrong, as no one else seems to have this issue..

basically put I am using a jquery click event from an HTML button, then what happens in that area is code gets append (with .append()) but any code in that area I cannot seem to actually access via the kendo upload initializer thing

$('#upload_content').click(function () { $('#sideRight').append('<div class="fileupload" style="position:absolute;left:5%; top:35%;"><input id="file_upload" name="file_upload" type="file"></div>'

so would I actually initialize a proper upload control with that input field. I don't get any errors in Firefox, but any time I dynamically append any content (say on successful return of an ajax request) with the append function I cannot use any kendo controls (uploadify actually)

i know the code does work if I add an input control in just plain HTML in the body (without appending it with jquery) it works fine.

what am I DNA wrong? It's not like I am trying to use multiple upload controls, I will actually be using at least 3 on the page however, appended to 3 different click events, so in theory there will be multiple ones on the page..lol any help would be greatly appreciated

Upload

answered on 13 Dec 2012

1 answer

130 views

App samples

Hi.
Do you have any additional app samples besides the Sushi app?

thx

General Discussions

answered on 13 Dec 2012

3 answers

1.2K+ views

look and feel change of kendo dropdown selected value and text

Hi team,

i am pleases to use this kendo UI .. i am customizing the kendo UI drop downlist.

i want to make color picker using Kedo Dropdown.

i am able to append new elements to the dropdown, want to change the Hover color for selected Item and after selecting i want to show color pallet and Text side by side.Can any one help me in this context.

i am attaching a screen shot that will explains much better...

DropDownList

answered on 13 Dec 2012

2 answers

1.1K+ views

Filterable not working when grid is Sortable (MVC)

I'm working on a MVC 4 project and bumped in to a problem with the Kendo Grid.

I try to use both the Sortable() and Filterable() properties of the grid, but only sorting is applied. The filter icons are visible in the columns but only triggers sorting. The Filterable() property works fine when Sortable() is removed though.

Below is the code for the grid (slightly edited for cleaner presentation)

@(Html.Kendo().Grid<TaskViewModel>()

.Name("UserTasksGrid")

.Columns(column =>

{

column.Bound(task => task.Title);

column.Bound(task => task.IsCompleted)

.ClientTemplate("<input type=\"checkbox\" #= (IsCompleted === true) ? checked='checked' : '' # disabled=\"true\"")

column.Bound(task => task.TaskType)

column.Bound(task => task.DueDate).Format("{0:yyyy-MM-dd}")

column.Bound(task => task.CompletedOn)

.ClientTemplate("#= (IsCompleted == false) ? '' : kendo.toString(CompletedOn, 'yyyy-MM-dd') #")

column.Template(model => model).ClientTemplate("<a href='/production/index?productionId=#=ProductionId#' style=\"width:\">Gå till produktionssida</a>");

})

.Filterable()

.Sortable()

.Scrollable(scroll => scroll.Height(300))

.Pageable()

.DataSource(dataSource => dataSource

.Ajax()

.PageSize(20)

.ServerOperation(false)

.Model(model => model.Id(m=> m.Id))

.Sort(sort => sort.Add(task => task.IsCompleted))

.Read(read => read.Action("UserTasks_Read", "Task"))

)

I've also tried with the ColumnMenu() property based on your demo http://demos.kendoui.com/web/grid/column-menu.html
but the problem remains (ie the column menu icon can not be clicked).

Furthermore, when I set sortable in the ColumnMenu (like below), the options for "Sort ascending" and "Sort descending" are not displayed in the menu.

.ColumnMenu(menu => menu.Sortable(true))

It would be great if I could get both filtering and sorting working on the grid.

Thanks,
Andreas

Grid

answered on 13 Dec 2012

2 answers

737 views

Id of node when clicked on tree and pass it as parameter to grid!

How do I get the ID of a node in a Kendo treeview from a remote JSON and put it as a variable to use in a grid's remote datasource url as parameter?

Here is the code for tree:

<script id="treeview-template" type="text/kendo-ui-template">

#: item.Name #

</script>

<script>

var meterid = 1179;

var treeurl = 'treeview_remote_url';

var datatree = new kendo.data.HierarchicalDataSource({

transport: {

read: {

url: treeurl,

dataType: "json",

cache: true

}

},

schema:

{

model:

{

children: "Children",

fields:

{

id: { type: "number" },

Name: { type: "string" }

}

});

function onSelect(e) {

var treeview = $("#treeview").kendoTreeView({

select: function () {

meterid = ($(this).text());

}

});

$("#grid").data("kendoGrid").dataSource.read();

}

$(document).ready(function () {

$("#treeview").kendoTreeView(

{

template: kendo.template($("#treeview-template").html()),

dataSource: datatree,

dataTextField: "id"

});

var treeview = $("#treeview"),

kendoTreeView = treeview.data("kendoTreeView");

treeview.on("click", ".k-in", function (e) {

kendoTreeView.toggle($(e.target).closest(".k-item"));

onSelect();

});

... and here is the code for grid:

<script>

var dateRegExp = /^\/Date$(.*?)$\/$/;

function toDate(value) {

var date = dateRegExp.exec(value);

return new Date(parseInt(date[1]));

}

sourceUrl = "grid_remote_url... &id=" + meterid;

$(document).ready(function () {

$("#grid").kendoGrid({

dataSource: {

type: "json",

transport: {

read: sourceUrl

},

refresh: true,

serverSorting: true,

scrollable: true

},

height: '100%',

scrollable: {

virtual: false

},

columns: [

{ field: "data", title: "Date/Time", template: '#= kendo.toString(toDate(data), "dd/MM/yyyy HH:ss")#', width: '10%' },

{ field: "valoare", title: "Energy (MWh)", template: '#= kendo.toString(valoare, "n5")#' },

{ field: "valoare", title: "Energy (MWh)", template: '#= kendo.toString(valoare, "n5")#' }

]

});

</script>

Any help will be apreciated. Thanks!

TreeView

answered on 13 Dec 2012

2 answers

94 views

[Solved] Problem with Selectable rows behavior on iOS

When I turn on the "selectable" property of a Kendo grid, I get an interesting (undesirable) behavior on iOS browsers. When you use a single swipe gesture to scroll the content of the grid, all the rows in the entire grid become selected.

So far I have confirmed this happens on Safari on iOS 5 and 6 as well as Chrome 23.0.1271.91 also on iOS 6. I have published a standalone file to demonstrate this issue:

http://hst11.homeschooltracker.com/demo/grid.html

I look forward to any recommendations that will make it so that scrolling on these platforms does not select rows the user did not mean to select.

Grid

answered on 13 Dec 2012

1 answer

104 views

Can I tell if the view is being shown because the user went back in the show event?

We've run into a situation where we need to be able to tell if a view is being shown because the user clicked 'back' (whether via an HTML button, or the back button on their device/browser). Is there any way to do this from within the view's show event?

Thanks,
Jonathan

General Discussions

answered on 12 Dec 2012

4 answers

313 views

XML Datasource with Treeview COntrol

Hi,
We are trying to load a Kendo Tree view control with XML document as datasource. But we can't fnd any code samples for the same. We are struck here. Can anyone help us by providing some sampe code?

General Discussions

answered on 12 Dec 2012

2 answers

123 views

Grid Binding

how to get the ID(Primary key) of the ProjectGroup model ? when i want to use that ID in the method like DataServiceFactory.AdminService.GetUsersForProjectGroup(ID) , i cant bind it , just for now to check, i passed ID as "1" in the below code . can any one help how to bind the "ID "

@(Html.Kendo().Grid(Model.ProjectGroups)
    .Name("Grid")
    .Columns(columns =>
                 {
                     columns.Template(@<div><h4>@item.Name</h4><small>@item.Description</small></div>).Title("Name");
                     List<User> users = DataServiceFactory.AdminService.GetUsersForProjectGroup(1);
                     columns.Template(
                         @<div>
                         @foreach(var user in users){<p>@user.FullName</p>}</div>).Title("Members");
                     List<Partition> partitions = DataServiceFactory.AdminService.GetAccessedPartitionForProjectGroup(1);
                     columns.Template(
                         @<div>
                         @foreach (var partition in partitions)
                         {<p>@partition.Name</p>}</div>).Title("Partitions");

                     columns.Template(@<a href="@Url.Action("EditGroup", new { ID = item.ID })"><i class="icon-pencil"></i></a>);

                 })
                 .Pageable()
                 .Sortable()
    )

Grid

answered on 12 Dec 2012

4 answers

176 views

Direct link to view with params not working.

If I navigate directly to a view in my app, without parameters, my views show as they should:
http://localhost:34991/MobileNew/Account/Dashboard/#clientSearchByLastNameView

If I add parameters, it will 'reset' the app, and start on the first/initial view:
http://localhost:34991/MobileNew/Account/Dashboard/#clientSearchResultsView?SearchLastName=Smith

I should add, when I say "navigate", I don't mean app.navigate. I mean a direct link from the browser's address bar.

Is this a known issue, and what is the workaround?

General Discussions

answered on 12 Dec 2012