Questions on UI for ASP.NET MVC Forum

1 answer

118 views

The AJAX grid is capable of displaying an always visible filter row in the header (see http://demos.telerik.com/aspnet-ajax/grid/examples/programming/filteringtemplatecolumns/defaultcs.aspx for an example).

Is there any setting that would make the MVC grid behave the same (rather than the drop-downs in the header)?

Grid

answered on 21 May 2013

7 answers

318 views

Package Installation Error

I just opened VS2012, created a new Kendo UI MVC Project, followed the wizard steps and was slapped with this (see image at Screen Shot - also attached file). It appears I am missing a ton of jQuery, Modenizr, OAuth, knockout.js, razor packages and more. Is this normal? Do I need to track down each of these packages? Once I do, will they be available for the next new project I create?

TIA

Keith

Installer and VS Extensions

answered on 21 May 2013

1 answer

155 views

Getting generated query from Kendo UI Grid MVC

Hello,

Is there a way to get the generated query from the Kendo UI Grid? I would like to get this query that has anything the user selected such as sorting, grouping, filtering, ordering, etc.

What I'm trying to do is have a business layer do validation first to see if the query can be performed. Then if it passes with the search criteria let the query that was generated by the grid perform the search.

I'm using Entity framework so it would be nice if there is a way to get the query or linq generated without trying to scrape the DataSourceRequest object.

Thank you,

Daniel

Grid

answered on 21 May 2013

6 answers

838 views

Binding to Model, then cascade

Hi,

I have a scenario, where I have two drop-downs that I want to cascade. This is working to an extent, but when I want to expand the functionality to bind intially to a model list, then select a value on page load, I can't think of a way to make this happen.

These are the two drop-downs:

Html.Kendo().DropDownListFor(c => c.SelectedGroup)

.BindTo(Model.Groups)

.Value(Model.SelectedGroup.Value.ToString())

.HtmlAttributes(new { style = "width: 250px" })

.Render();

And

@(Html.Kendo().DropDownListFor(t => t.AuthorisedByExtraID)
                        .DataTextField("Name")
                        .DataValueField("ExtraUserID")
                        .DataSource(source =>
                            source.Read(read => read.Action("SearchAutocompleteEmployees", "Search")
                                                        .Data("onAutoCompleteAdditional")
                                                        .Type(HttpVerbs.Post))
                                    .ServerFiltering(true))
                              .HtmlAttributes(new { style = "width: 250px" })
                              .Enable(false)
                              .AutoBind(true)
                              .BindTo(Model.GroupEmployees)
                              .Value(Model.AuthorisedByExtraID.HasValue ? Model.AuthorisedByExtraID.Value.ToString() : "0")
                      .CascadeFrom("SelectedGroup")
    )

How can I enable the second drop-down to bind to Model.AuthorisedByExtraID when it exists, then when group changes, 
to load the contents via ajax? 

Thanks,
Gabor

DropDownList

answered on 21 May 2013

1 answer

124 views

IE 8 Rendering

We have a standard Kendo UI for ASP.Net project that was upgraded to 2013.1.514. After the upgrade, the DropDownList objects now display a text "sel" under the down arrow when run under IE 8. Under Chrome, no problem. Using Visual Studio 2010.

Screenshot enclosed as well as sample project.

DropDownList

answered on 21 May 2013

1 answer

165 views

Grid datasource rebind on treeview onSelect

Hi,
Currently I have a treeview control and a grid control.
I added a onSelect javascript, when treeview is selected, the grid control will be re-bind.
but I don't know how to pass the parameter to Grid control.

function onSelect(e)
{
var grid = $("#Grid").data("kendoGrid");
grid.dataSource.read()
}

.Read(read => read.Action("GetGridData","Home"))

public ActionResult GetGridData(string treeviewItem, [DataSourceRequest]DataSourceRequest request)
{
}
Can you advise how should I pass the parameter to Grid so the grid can call to controller to return data?

Grid

answered on 20 May 2013

2 answers

162 views

[Solved] Kendo with SSL

I have a site that is http but the lock only shows on pages where I am not using kendo controls. This happens in IE9 and IE10, not sure about previous verisons of IE. Images attached showing my url is https and the lock is not showing. Any ideas?

General Discussions

answered on 20 May 2013

5 answers

610 views

[Solved] Calculated Cells

Hi,

I have a simple grid with Quantity, Unit Price and Total columns and a few others. The grid is set as GridEditMode.InLine. When I click on the Edit button of a row I can change the Quantity value. Once changed, when I click on the Update button I'd like the Total column to reflect the changes: Total = Qty * UPrice.

Here's the grid:

@(Html.Kendo().Grid(Model.Products)

.Name("FabricGrid")

.Columns(columns =>

{

columns.Bound(p => p.Fabric);

columns.Bound(p => p.Pattern);

columns.Bound(p => p.Description);

columns.Bound(p => p.UPrice);

columns.Bound(p => p.Qty).Width(150);

columns.Bound(p => p.Total);

columns.Command(command => command.Edit()).Width(110);

columns.Command(command => command.Destroy()).Width(110);

})

.Scrollable()

.Sortable()

.Editable(editable => editable.Mode(GridEditMode.InLine))

.DataSource(dataSource => dataSource

.Ajax()

.ServerOperation(false)

.Model(model => model.Id(p => p.ProductId))

.Events(events => events.Error("error_handler"))

.Update(update => update.Action("Product_Update", "ShoppingCart"))

.Destroy(destroy => destroy.Action("Product_Delete", "ShoppingCart"))

)

I tried to update the ModelState but the display doesn't change.

Thanks for your help.

Grid

answered on 20 May 2013

1 answer

347 views

[Solved] Handle Edit/Delete in MVC Action

Hi there,

I am using the KendoUI grid control on two MVC views where the user needs the ability to edit the data on each grid. The proposed solution is to redirect to an "Edit" and "Delete" view if the user clicks on the "Edit" or "Delete" buttons.

I currently have this working for one of the grids, but the second grid only allows me to edit the data inline. The definition of the grids are identical (apart from the columns, model, and actions).

How can I disable the inline editing of the second grid so that it redirects to an MVC view instead?

This code works as expected and redirects to the "Edit" and "Delete" views.

<%:Html.Kendo().Grid(Model)

.Name("players")

.Columns(columns =>

{

columns.Bound(p => p.FullName);

columns.Bound(p => p.MobilePhone);

columns.Bound(p => p.EmailAddress);

columns.Command(command =>

{

command.Edit();

command.Destroy();

}).Width(200);

})

.DataSource(dataSource => dataSource

.Ajax()

.PageSize(20)

.Model(model => model.Id(p => p.PlayerId))

.Read(read => read.Action("Edit", "Player"))

.Update(update => update.Action("Edit", "Player"))

.Destroy(update => update.Action("Delete", "Player")))

%>

This code DOES NOT work as expected and performs an in-line edit

<%:Html.Kendo().Grid(Model)

    .Name("articles")

    .Columns(columns =>

    {

        columns.Bound(a => a.Date);

        columns.Bound(a => a.Title);

        columns.Command(command =>

        {

            command.Edit();

            command.Destroy();

        }).Width(200);

    })

    .DataSource(dataSource => dataSource

        .Ajax()

        .PageSize(20)

        .Model(model => model.Id(a => a.ArticleId))

        .Read(read => read.Action("Edit", "Article"))

        .Update(update => update.Action("Edit", "Article"))

        .Destroy(destroy => destroy.Action("Delete", "Article")))

%>

Grid

answered on 19 May 2013

1 answer

154 views

Bind bulletchart to datatable

I'm relatively new to MVC and Kendo controls, so please bear with me.
I have a datatable with one row and five values (columns). How can I bind this datatable to the mmHg bulletchart in the dataviz chart demo?
My HomeController.cs looks like this. How would my complete index.schtml look like?

namespace RfPrMvcKendo.Controllers

{

public class HomeController : Controller

{

//

// GET: /Home/

public ActionResult Index()

{

DataTable table = new DataTable();

table.Columns.AddRange(new DataColumn[] {

new DataColumn("Counter1", typeof(int)),

new DataColumn("Counter2", typeof(int)),