Questions on Kendo UI for jQuery Forum

1 answer

350 views

How do i Bind object in model from dropdownlist ?

public class Country
{
public int Id {get; set;}
  public string Name{ get; set; }
}

public class City
{
public int Id {get; set;}
  public string Name{ get; set; }
public Country Country {get; set;}
}

Controller ....

public ActionResult Create()
{
var model = new City();
ViewBag.Countries= ... //Loading all countries typeof IQuerable<Country>
return View(model);
}

cshtml....

@model Entities.City

   @(Html.Kendo().DropDownListFor(m => m.Country)
.BindTo(ViewBag.Countries)
.DataValueField("Id")
.DataTextField("Name")
.OptionLabel("Please select."))

public ActionResult Create(City model)
{
if (ModelState.IsValid) /// <<== Error here..
{
var _obj = new City()
{
Name= model.Name,
Country = model.Country
};
}

Error is Model state is not valid. Because System.String cannot convert to Entities.Country

DropDownList

answered on 17 Oct 2012

2 answers

93 views

Using ad framework in your kendo app?

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

687 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.0K+ 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

770 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

84 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

203 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

124 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

197 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

93 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>