Questions on UI for ASP.NET MVC Forum

1 answer

455 views

I have some comboboxes that cascade from one to the other. I would also like to be able to filter based on partial text entered into the combobox. This isn't working out of the box, so I'm working on coding it server-side. It appears that the text is being posted to the servers, but I can't find a server-side object to bind to the post. Here's what's being posted. In my case "Value" is the value of the parent combobox this combobox is cascading from.

filter[logic]:

and
filter[filters][0][field]:

Value
filter[filters][0][operator]:

eq
filter[filters][0][value]:

2
filter[filters][1][value]:

purity
filter[filters][1][field]:

Text
filter[filters][1][operator]:

contains
filter[filters][1][ignoreCase]:

true

I took a look at IFilterDescriptor, FilterDescriptor, and CompositeFilterDescriptor. They seem to have similar fields to those shown above, but they aren't binding when I try to use them as input to my Action method. I haven't had any luck finding a similar thread or any documentation around this.

Again, my end goal is to have cascading comboboxes without losing the ability to filter by text entered, so if there's any advise there, I'm all ears. Also, any advice on how to bind the posted filter info is welcome.
Thanks,
--Evan

Also, here's the definition of my comboboxes as a side note:
<tr>
<td class="formTableLabel">Price Publisher: </td>
<td>
@(Html.Kendo().ComboBox()
.Name("PricePublisherId")
.DataValueField("Value")
.DataTextField("Text")
.BindTo(Model.ReferenceData.PricePublisherList)
.Filter(FilterType.Contains)
.HtmlAttributes(new { required = "required", validationMessage = "Please select an option." }))
</td>
</tr>
<tr>
<td class="formTableLabel">Price Instrument: </td>
<td>
@(Html.Kendo().ComboBox()
.Name("PriceInstrumentId")
.DataValueField("Value")
.DataTextField("Text")
.Placeholder("(Empty)")
.DataSource(source =>
{
source.Read(read =>
{
read.Action("GetPriceInstrumentList", "TradeEntry").Data("priceInstrumentListJSON").Type(HttpVerbs.Post);
})
.ServerFiltering(true);
})
.Enable(false)
.AutoBind(false)
.CascadeFrom("PricePublisherId")
.Filter(FilterType.Contains)
.HtmlAttributes(new { required = "required", validationMessage = "Please select an option." }))
</td>
</tr>

General Discussions

answered on 30 Jan 2013

2 answers

209 views

[Solved] Inserted Item Moves To Top After Save Or Another Add

I have a question about Kendo Grid for ASP.NET MVC. It's probably something that I'm not doing incorrectly.

When I add a new item to the grid, I'm using the solution described on this forum post to move the inserted <tr> to the bottom of the grid. That part works fine. However, when I save the changes to the grid or add a new item, the inserted item is moved to the top of the grid, even if that breaks the currently applied sort order.

I have attached a simple project that demonstrates this. To repro what I'm talking about, do the following:

Run the app
Note that the grid is currently sorting on the Id column in ascending order
Go to the last page
Click the "Add New Item"
Set the Id to 550 and enter First Name, Last Name, and Position
Click "Save Changes" or "Add New Item"
The inserted row that was at the bottom of the grid has been moved to the top, ignoring the sort order

Can anyone point out what I'm doing wrong?

Thanks

Grid

answered on 30 Jan 2013

3 answers

90 views

Table with One Column That is the Primary ID

I am using a grid to edit a table that is one column and that column is the primary ID. Therefore, I cannot edit the column. I want to allow adds and deletes (with checks in the background). There are two problems. I do not see the Add or Delete button in line. If I use the pop-up option, I can only add but the pop-up button states that I am editing, which would be confusing to the users. How do I get the grid to add and delete properly?

This is what I have:

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

.Name("NatureOfStudyGrid")

.Columns(columns =>

{

columns.Bound(item => item.NatureOfStudy);

})

.DataSource(ds => ds

.Ajax()

.Model(model =>

{

model.Id(m => m.NatureOfStudy);

})

.Read(read => read.Action("NatureOfStudyDataSource", "Lists"))

.Create(create => create.Action("NatureOfStudyCreate","Lists"))

.Destroy(destroy => destroy.Action("NatureOfStudyDelete","Lists"))

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

)

.Pageable()

.ToolBar(commands => commands.Create())

.Editable(edit => edit.Mode(GridEditMode.PopUp))

)

Grid

answered on 30 Jan 2013

1 answer

95 views

Adding grid to existing edit page is not working

I have an MVC4 app and I'm trying to evaluate the trial version of Kendo for MVC. I want to add a grid to an existing edit page for on of my views. We are using entity framework and views were made using the Razor view engine. On this edit view page the data that is editable is from a tabled called Agency. I want to add a grid to this razor view that will contain records from a tabled called Institute.

I have tried the AJAX binding example and the server binding example located here: http://docs.kendoui.com/getting-started/using-kendo-with/aspnet-mvc/helpers/grid/ajax-binding but neither of these seem to work in my existing application.

How do I accomplish this?

Grid

answered on 29 Jan 2013

2 answers

541 views

Can I attach event to piechart area click

Hi, I would like to show relevant expanded data in a grid when user clicks on pie chart. Does charts provide any built in client events that get raised when chart area is clicked or do I have to hook it manually in jquery.

Chart

answered on 29 Jan 2013

1 answer

170 views

DropDownList not opening with many items (~15000)

Hi,

I have a DropDownList which is populated with many items (around 15000). I know this is a lot, but it is needed for this application.

Unfortunately, the DropDownList does not open anymore, when there are that many items. The open Animation is shown but the Dropdown is closed immediately. I'm using the Version 2012.3.1114.

Is there a fix to this?

Greets

DropDownList

answered on 29 Jan 2013

1 answer

228 views

DataTable aggregete functions

Specs

Kendo: 2012.3.1114
Net: 4.5
MVC: 4.0

Problem
I am binding my grid using a DataTable as the Model and need to have aggregate values. I have to use the datatable as I have a lot of data that is being sent over from the web service. If wrapped as XML it was over 55 MB for 21 columns and 14,400 rows so we converted the SQL DataTable to CSV and then sent the string over. That resulted in a file around 5MB.

The data that I a getting has no model as there can easily be 200+ columns depending on the query so making a data model is sadly out of the question.

If I use the snippet below as my base (taken from the Kendo UI Code Library) there seems to be no way to set up the aggregate functions

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

.Name("Grid")

.Columns(columns => {

foreach (System.Data.DataColumn column in Model.Columns)

{

columns.Bound(column.DataType, column.ColumnName);

}

})

.Pageable()

.Sortable()

.Scrollable()

.Filterable()

.Groupable()

.DataSource(dataSource => dataSource

.Ajax()

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

)

Back in the days of the Telerik MVC controls I could set up the aggregate function you could setup the aggregate while adding the bound column but in the Kendo UI wrapper that has been moved down to be inside of the DataSource.

Telerik Grid:

columns.Bound("ColumnName").Aggregate(aggregates => aggregates.Count().Min().Max())

If I try and set up the agregate down in the DataSource I get a lovely exception "'count' is undefined" which is a bit vague.

if (column.ColumnName == "ProductID")

{

columns

.Bound(column.DataType, column.ColumnName)

.ClientFooterTemplate("Count: #=count#");

}

...

.Aggregates(aggregates =>

{

aggregates.Add(a => "ProductID").Count();

})

Is there any way to get around the aggregate problem?

Grid

answered on 29 Jan 2013

1 answer

76 views

IE8 : Grid Popup Add not working for Text and DateTime input in IE8

Hi,

In Grid MVC Server Wrapper for Kendo UI, popup save values are not binding to grid for input text box. Same is happening for Date time selector, it works okay if a Date is selected but doesn't work consistently if someone manually types in a Date

Please see attached file for visual description

This only happens on IE8

Please suggest a solution

Thanks,

Taha

Grid

answered on 29 Jan 2013

1 answer

1.2K+ views

Numeric Textbox in Grid

I've got a grid that I'm creating using the MVC wrapper. I have fields defined as numeric but when I edit the fields they show a large textbox (not sure why they are so large) and never a numeric box. I have found that when I add a client template that is a numeric text box the box shows up but doesn't appear with proper styling. When I edit and cancel the box suddenly shows proper formatting. I've looked at the HTML document and it seems that the wrapper objects are not being added. I'm not sure what I'm doing wrong.

Here is my MVC view code:

@(Html.Kendo().Grid<eLuminate.Radar.Web.Provider.Model.Procedures.Price>().Name("prices").Columns(columns =>

{

columns.Bound(c => c.Name).Width(250);

columns.Bound(c => c.RelatedProviderName).Title(Model.IsFacility ? "Professional" : "Facility").Width(150);

columns.Bound(c => c.High).Format("{0:C0}").Groupable(false).Filterable(false).Width(75).Hidden();

columns.Bound(c => c.Low).Format("{0:C0}").Groupable(false).Filterable(false).Width(75).Hidden();

columns.Bound(c => c.Average).Format("{0:C0}").Groupable(false).Filterable(false).Width(75);

columns.Bound(c => c.MyPrice).Format("{0:C0}").Filterable(false).Width(125)

.ClientTemplate(Html.Kendo().NumericTextBox().Name("mp_#=ID#").Min(0).HtmlAttributes(new { value = "#=MyPrice#", style = "width: 100px;" }).ToClientTemplate().ToHtmlString());

columns.Command(command => { command.Edit(); command.Destroy(); }).Width(200);

})

.ToolBar(toolbar => toolbar.Create())

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

.Filterable()

.ColumnMenu()

.DataSource(dataSource => dataSource

.Ajax()

.Batch(false)

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

.Model(m =>

{

m.Id(p => p.ID);

m.Field(p => p.Name).Editable(false);

m.Field(p => p.RelatedProviderName).Editable(false);

m.Field(p => p.High).Editable(false);

m.Field(p => p.Low).Editable(false);

m.Field(p => p.Average).Editable(false);

})

.Update(update => update.Action("UpdatePrice", "Procedures", new { id = Model.ID }))

.Read(read => read.Action("ReadPrice", "Procedures", new { id = Model.ID }))

.Destroy(destroy => destroy.Action("DeletePrice", "Procedures", new { id = Model.ID }))

.Create(create => create.Action("AddPrice", "Procedures", new { id = Model.ID }))

)

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

.Selectable()

.ClientDetailTemplateId("analytics")

.Groupable()

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

Grid

answered on 29 Jan 2013

2 answers

241 views

[Solved] Initial value of list not bound

I've got several dropdown lists in an editor template, for use with a grids pop-up edit window.

They are displayed fine, and if a value other than the default one is selected, data is returned to the controller.

However, if the user leaves the default values as presented, null values are returned to the controller.

The definition is:

@(Html.Kendo().DropDownListFor(c=>c.Site)

.Name("Site")

.DataTextField("SiteDescription")

.DataValueField("Site")

.DataSource(source=>source

.Read(read=>read.Action("GetSiteLookUpList","ManualData"))))

@Html.ValidationMessageFor(c => c.Site )

Do I need to set anything else so the default value is posted back?

DropDownList