Questions on Kendo UI for jQuery Forum

2 answers

130 views

Are there ways to also use native things in your apps such as ad frameworks? Or even any other native functionality... This could be a deal breaking on my ability to use Kendo if not:(

General Discussions

answered on 17 Oct 2012

2 answers

724 views

DataSource Group by multiple fields remotely

Hi,

I would like to group data by multiple fields remotely on server. What is the data format for the grouping and grouped items ? For eg.,

I have a list of employees as follows :

Employee[] empList = new Employee[6];

empList[0] = new Employee() { Name = "CA", State = "A", Department = "xyz" };

empList[1] = new Employee() { Name = "ZP", State = "B", Department = "xyz" };

empList[2] = new Employee() { Name = "AC", State = "B", Department = "xyz" };

empList[3] = new Employee() { Name = "AA", State = "A", Department = "xyz" };

empList[4] = new Employee() { Name = "A2", State = "A", Department = "pqr" };

empList[5] = new Employee() { Name = "BA", State = "B", Department = "pqr" };

I would like to group the employee list by State and then by Department.   So my groupings and grouped items would be :
A - XYZ
    - EMP[0], EMP[3]
A - PQR
   - EMP[4]
B- XYZ
- EMP[1], EMP[2]
B - PQR
- EMP[5]

What is the format in which datasource requires these groupings and grouped items ? I saw this post http://www.kendoui.com/forums/framework/data-source/datasource-remote-grouping.aspx    but could not figure out how to present multiple key values.

Thanks

Data Source

answered on 17 Oct 2012

8 answers

4.2K+ views

How do you default a TreeView to expanded on initialization?

Hello,

I'm attempting to build a Kendo TreeView that is fully expanded by default.

My data structure is a simple un-ordered list similar to this:

<ul id="treeView">

<li>1

<ul>

<li>1.1</li>

</ul>

</li>

<li>2

<ul>

<li>2.1

<ul>

<li>2.1.1</li>

</ul>

</li>

</ul>

</li>

</ul>

Then on document.ready():

$(document).ready(function () {

$("#treeView").kendoTreeView();

});

Any suggestions?

Thanks,
Daniel

TreeView

answered on 17 Oct 2012

3 answers

855 views

Grey-out a row in Kendo grid

I have a kendo grid with one of the columns as check boxes. I want to achieve the following:

1. Select a row using check box, click on delete button external to grid and get that row deleted. (looking out for bulk delete also)
2. Select a row using check box, click on a button to grey-out / disable ( row should still be present in the grid) that row.

I could able to achieve first task. I need help for the second task.

Any quick help with sample code will be appreciated. I'm new to kendo.

is this the right way to get a column with check boxes?

checkBox is an empty string ( "" ) which i'm getting from controller

columns.Bound(p => p.checkBox).ClientTemplate("<input type= 'checkbox' id= 'chkbox' onchange= 'chkchnage()' />").Title("");

columns.Bound(p => p.frontOffice).Title("Rule Description").HeaderHtmlAttributes(new { style = "text-align:center" });

.

.DataSource(dataSource => dataSource

.Ajax()

.ServerOperation(false)

.Model(model => model.Id(m => m.checkBox))  //not sure why I added this.Model id is mandatory it seems

.PageSize(20)

)

.Selectable(selectable => selectable.Mode(GridSelectionMode.Multiple))

.Resizable(resize => resize.Columns(true))

.Editable(editing => editing.DisplayDeleteConfirmation(true))

.Navigatable()

.Pageable()

.Sortable().Render();

Grid

answered on 17 Oct 2012

0 answers

110 views

Display tabs on the right side instead of the left

How can I make the tabs appear to the right instead of to the left?

TIA

TabStrip

asked on 17 Oct 2012

4 answers

254 views

Window Drag Event

What is the recommended way to have a kendoWindow listen for the dragEnd event?

Window

answered on 16 Oct 2012

1 answer

149 views

Menu/Grid z-index bug

See html source below. When I put a menu and a grid control below it inside a window, dropping the menu causes it to display underneath the grid. But when the menu and grid are not inside a window, it displays as it should. It does this is all browsers.

<!doctype html>
<html>
<head>
<link href="styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="styles/kendo.default.min.css" rel="stylesheet" type="text/css" />
<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/kendo.web.min.js" type="text/javascript"></script>
<script>
    $(document).ready(function() {
      $(".myWindow").kendoWindow();
      $(".myMenu").kendoMenu();
      $(".myGrid").kendoGrid();
    });
</script>
</head>
<body>

<ul class="myMenu">
    <li>Menu
      <ul>
        <li>Item 1</li>
        <li>Item 2</li>
        <li>Item 3</li>
        <li>Item 4</li>
      </ul>
    </li>
</ul>

<table class="myGrid">
    <thead>
      <tr>
        <th>Col 1</th>
        <th>Col 2</th>
        <th>Col 3</th>
      </tr>
    </thead>
</table>

<div class="myWindow">

    <ul class="myMenu">
      <li>Menu
        <ul>
          <li>Item 1</li>
          <li>Item 2</li>
          <li>Item 3</li>
          <li>Item 4</li>
        </ul>
      </li>
    </ul>

    <table class="myGrid">
      <thead>
        <tr>
          <th>Col 1</th>
          <th>Col 2</th>
          <th>Col 3</th>
        </tr>
      </thead>
    </table>

</div>

</body>
</html>

Menu

answered on 16 Oct 2012

1 answer

224 views

Hierarchy Grid with Local Data

Hi,

I'm trying to create an Hierarchy Grid with Local Data and I can't manage to pass the father ID to the Client Detail Template

for example

@(Html.Kendo().Grid(Model.Employees)
.Name("Employees")
.Columns(columns =>
{
columns.Bound(e => e.FirstName).Width(140);
columns.Bound(e => e.LastName).Width(140);
columns.Bound(e => e.Title).Width(200);
columns.Bound(e => e.Country).Width(200);
columns.Bound(e => e.City);
})
.ClientDetailTemplateId("employeesTemplate")
.Pageable()
.DataSource(dataSource => dataSource
.Ajax()
.ServerOperation(false)
)
.Sortable()
)

<script id="employeesTemplate" type="text/kendo-tmpl">
@(Html.Kendo().Grid(Model.Orders.Where(o=>o.employeeID == "#=EmployeeID#" ) )
//************* NOT WORKING *************
.Name("Orders_#=EmployeeID#")
.Columns(columns =>
{
columns.Bound(o => o.OrderID).Width(101);
columns.Bound(o => o.ShipCountry).Width(140);
columns.Bound(o => o.ShipAddress).Width(200);
columns.Bound(o => o.ShipName).Width(200);
})
.DataSource(dataSource => dataSource
.Ajax()
.ServerOperation(false)
)
.Pageable()
.Sortable()
.ToClientTemplate()
)
</script>

Please Help

Grid

answered on 16 Oct 2012

0 answers

112 views

Need To Double Click KendoUpload Button

I have a rather simple kendoUpload button and it mostly works fine,
but in IE9 the user needs to double click the button to get the file
browser window to display.

Also, the user can only click on the button label - clicking (or double
clicking) on the larger button image has no effect.

Here's the code:

<a href="javascript:void(0)">

<input id="FileName" name="FileName" type="file" />

<script>

jQuery(function () {

jQuery("#FileName").kendoUpload();

</a>

asked on 16 Oct 2012

1 answer

1.3K+ views

Need to change "Filter" icon in grid columns

Hi,
Does any one know, how can I change the "Filter" icon that comes on grid columns when filtering is enabled ?
I have tried to change it but it appears that image is displayed dynamically by kendo during grid rendering.

Thanks

Grid

answered on 16 Oct 2012