Questions on UI for ASP.NET MVC Forum

1 answer

199 views

Specifying hasChildren and id fields when using DataSource

When configuring a Treeview with the MVC extensions I don't see an option to specify the id or hasChildren fields.

I have to make sure my returned Json has exactly "id" and "hasChildren" for it to work.

Am I missing something?

TreeView

answered on 30 Aug 2012

5 answers

1.2K+ views

RAZOR Page with Kendo Grid

Here is my problem, I have a Razor page with a <table>Kendo.Grid</table> tag the page will duplicate my database headers (the first set headers has no data the second set has data) however my page 2 on the grid will pull correct record 11-19 and display them for page 2 so the paging works. If I remove the <table></table> tag my headers are no longer duplicated however my 2 page does not pull any records and the page number just shows a 0.... has anyone seen this before?
with <table></table>
Header1    Header2    Header3

Header1    Header2    Header3
data            data            data
data            data            data

without <table></table>
Page one
Header1    Header2    Header3
data            data            data
data            data            data        1-10 records

Page2
Header1    Header2    Header3

Grid

answered on 30 Aug 2012

3 answers

839 views

[Solved] Wrong format

Although i set the culture to germany [ kendo.culture("de-DE") ] the format of the datetime is not correct, it is still default "en-US".
I have to set additionally the format like this

[Javascript]

jQuery(function(){jQuery("\#start").kendoDateTimePicker({format:kendo.culture().calendar.patterns.g,min:new Date(1899,11,31,0,0,0,0),max:new Date(2100,0,1,0,0,0,0),interval:30});});

or this

[Razor]

@(Html.Kendo().DateTimePicker()

.Name("start")

.Format("dd.MM.yyyy HH:mm")

.Value(DateTime.Now)

)

The format/values of date and time in both dropdowns of the datetimepicker are correct, only the format in the input field is wrong.

But the format of time-values in the dropdownlist of a normal timepicker is not correct too, it is not like the format of the current culture, it is still default "en-US" but without "AM" & "PM".

List of format failure:
Culture set to "de-DE"

DateTimePicker:
format of values (date&time) in the inputfield: wrong
format of date in dropdown: correct
format of time in dropdown: correct

TimePicker:
format of values in the inputfield: wrong
format of time in dropdown: wrong

DatePicker:
format of values in the inputfield: wrong
format of date in dropdown: correct

DatePicker

answered on 30 Aug 2012

3 answers

1.8K+ views

Grid ajax/jquery refresh

Is it possible to reload the grid through jQuery?
In Telerik Grid this could be done by firing the $("#grid").data("tGrid").AjaxRequest(), and all filters and sortings would stay as they were, but the records would be refreshed.
This would help my out tremendously, thanks!

Grid

answered on 29 Aug 2012

0 answers

154 views

Grid mvc with 2 linked dropdown

Hi,

I have 2 dropdowns. A drop-down list and society people who work for the company selected. Change of the company, I want a filter for people who work for this company.

@(Html.Kendo().Grid((IEnumerable<EntrepriseViewModel>)ViewBag.Data)

.Name("Grid")

.Columns(columns =>

{

columns.Bound(p => p.Id).Visible(false);

columns.ForeignKey(p => p.IdCompany, (System.Collections.IEnumerable)ViewBag.CompanyList, "IdCompany", "CompanyName").HtmlAttributes(new { id = "CompanyDdl" });

columns.ForeignKey(p => p.IdEmploye, (System.Collections.IEnumerable)ViewBag.EmployeList, "IdEmploye", "EmployeName").HtmlAttributes(new { id = "EmployeDdl" });

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

})

.DataSource(dataSource => dataSource

.Ajax()

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

.Read(read => read.Action("Company_JSON_Read", "Home", new { id = Model.id }))

.Update(update => update.Action("Company_JSON_Update", "Home"))

)

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

)

IdEmployeList must change after IdCompany change but how ?

Thanks

Grid

asked on 29 Aug 2012

1 answer

177 views

Grid performance issues on low-end machines

I am evaluating several UI solutions (Kendo UI, Dhtmlx, ExtJs, jqGrid, etc.) so I created an example page to compare the performance of each solution. The page contains tabs, form fields and three grids.

Here's the example page using Kendo UI.

I've found Kendo UI to be very fast except for the grids. On my beefy dev machine, this page renders in about 1.3 seconds. On a low end machine (Win XP, IE 8, 1.86 GHz, 1 GB RAM), this page can take 5-8 seconds. All of the other solutions are much faster than this. I was quite surprised by my findings especially since you tout the performance of these controls.

Here is my grid configuration:

@(Html.Kendo().Grid(Website.Prototype.Helpers.GetGridData(20))
                            .Name("Grid1")
                            .Columns(columns =>
                            {
                                columns.AutoGenerate(true);
                            })
                            .Sortable()
                            .Scrollable() 
                            .Filterable()    
                            .DataSource(dataSource => dataSource        
                                .Ajax()
                                .ServerOperation(false)        
                             )
                        )

I have a few questions:

Am I doing something wrong that would cause the performance issues?
I thought using the MVC wrapper would give Kendo UI a leg up on the competition because the html needed to render the grid is generated on the server. However, it seems that it is being regenerated on the client. Is that correct?
The grids are empty in Chrome and Firefox. It is populated in IE. Why is that?

Grid

answered on 29 Aug 2012

0 answers

124 views

How to create a grid in my Controller rather than in Javascript in the View?

Please disregard...

Grid

asked on 29 Aug 2012

2 answers

1.1K+ views

How to set the Combo box Value

Hi,

I'm new to Kendo controls. We are replacing the existing MVC controls with Kendo Controls.

The existing MVC controls looks like below
@Html.DropDownListFor(model => model.value, new SelectList(ViewBag.list, "id", "label"))

I can able to load the data but not able to set the value like above. Please suggest to set the value. Below is my Kendo control. It has the Value property but doesn't allow model values in it.

@(Html.Kendo().ComboBox()
.Name("ComboBox")
.DataTextField("label")
.DataValueField("id")
.BindTo(@ViewBag.list
)

ComboBox

answered on 29 Aug 2012

0 answers

282 views

Selects drop-down list item and sets the value and the text of the combobox

Hi

I have a grid and a 5 kendoComboBox combobox on a form
When the user selects an item from the grid, I am setting the value of kendo Combobox based on the values that were in the grid row.

i tried

// selects item if its text is equal to "test" using predicate function
combobox.select(function(dataItem) {
    return dataItem.text === "test";
});

with no result
here is my code
        var urlcountry = '@Url.Action("GetGeoGroupCountry", "GeoGroupPostalCode")';
        $.ajax({
            url: urlcountry,

            success: function (result) {
                debugger;

                var countryCombo = $("#GeoGroupCountryId").data("kendoComboBox");
                countryCombo.dataSource.add(result);

                countryCombo.select(function (dataItem) {
                    //dataItem argument is a ComboBox data item.
                    return dataItem.Text === e.sender.dataSource._data[0].GeoGroupCountryName;
                });
// e.sender.dataSource._data[0].GeoGroupCountryName) is 'United States of America'

The same no result

//                $.each(countryCombo.dataSource._data, function (key, value) {
//                    if (value.Text == e.sender.dataSource._data[0].GeoGroupCountryName) {
//                        countryCombo.select(key);
//                       return;
//                    }
//                });

            },
Thanks

DropDownList

asked on 29 Aug 2012

1 answer

138 views

[Solved] Use Grid as the datasource for a Chart

Is there a way to bind the datasource of a Chart to a Grid on the same page? I am using MVC4 (Html Helpers) and right now have two partial views that take the same IEnumerable<T> so the both render the same data initially, but I am thinking about allowing sort and filter on the grid and it would be great if I can have the chart reflect those changes.

Perhaps it would be more easily accomplished if I was using JS to create the grid and chart, but doing it with the Html helpers is so nice and clean.

Any assistance is greatly appreciated.

Grid

answered on 28 Aug 2012