Questions on UI for ASP.NET MVC Forum

5 answers

1.0K+ views

I'm trying to add an upload feature on a Kendo Window which uses forms, so a user can fill in details, attach a file, and press save - which will post to the controller and save the file and associated data and close the window.

After trying to get the upload to work using Ajax.BeginForm (as below),

@using (Ajax.BeginForm("Save", "Manage", null, new AjaxOptions {HttpMethod = "POST"}, new { enctype = "multipart/form-data", @id = "form", target = "_self"  }))

i kept getting a null value (for the file parameter) and came to the conclusion that the upload control only works for Html.BeginForm (as below)

@using (Html.BeginForm("Save", "Manage", FormMethod.Post, new { enctype = "multipart/form-data" }))

and can see the file parameter coming through when i use it.

However, using Html.BeginForm will force a reload of a page (by redirection) which I do not want to happen. Also I do not want asynchronous uploading to happen as saving the file requires some additional data on the form before it can be saved.

The controller looks like this

[HttpPost]

public ActionResult Save (Model model, IEnumerable<HttpPostedFileBase> file)

Currently for any other screen which does not use the Kendo Uploader, I am using Ajax.BeginForm which posts to the controller and use JavaScript to close the Kendo Window.

What is the correct way of adding a Kendo Upload control onto a Kendo Window and to save / upload the file and close the window?

And if not is there a way to emulate the Kendo Upload's async method when saving the form?

Otherwise is there a way to use Html.BeginForm on a window and stop it from redirecting to a different page?

Upload

answered on 21 Sep 2020

1 answer

77 views

Kenod Combo virtualization

Hi Team,

I have implemented Virtualization and its working fine . But in my case there are 2 pages with similar filter section i want to pass same to other page what i have selected in first page and it should pre load with data. Here i problem is how can i pass selected filter params of virtualized combo and i need to set the same to another combo.
We are using sessiongstorage to transfer current selected data into other page. and using the same we are setting default values to the controls.
Preaviously we filling the combo with all data and setting the slectedvalue property in javascript .
Now we need to set DataSourceRequest to fill the Combo with filter options , help me how can get and set this property in javascript or jquery.

Thanks & Regards,
Sp.

ComboBox

answered on 21 Sep 2020

1 answer

109 views

Grid Filtering / Missing Records

Hello,

I'm currently experiencing issues with a grid control not showing all the records that should be available for a search term.

The method supplying the dataset:

1.return this.Context.Orders.OrderByDescending(record => record.OrderId).Select(

2. record => new OrderDtoModel

3. {

4. Id = record.OrderId.ToString(),

5. EdiNumber = record.EDICustomerReference ?? string.Empty,

6. Due = record.DueDate,

7. Status = record.OrderStatu.StatusName

8. }).ToDataSourceResultAsync(request);

DTO Model:

01.public class OrderDtoModel

02.{

03. public string Id { get; set; }

04.

05. public string EdiNumber { get; set; }

06.

07. public DateTime? Due { get; set; }

08.

09. public string DueDate

10. {

11. get

12. {

13. return this.Due.HasValue ? this.Due.Value.ToString(CultureInfo.InvariantCulture) : string.Empty;

14. }

15. }

16.

17. public string Status { get; set; }

18.}

And finally the grid definition:

01.@(Html.Kendo().Grid<OrderDtoModel>().Name("order_grid").Columns(col =>

02.{

03. col.Bound(o => o.Id).Width(150);

04. col.Bound(o => o.EdiNumber).Width(150);

05. col.Bound(o => o.Status).Width(150);

06. col.Command(o => o.Custom("Manage").Click("manage_order"));

07.}).ToolBar(toolbar =>

08.{

09. toolbar.Search();

10.}).Sortable()

11. .Pageable()

12. .Scrollable()

13. .Groupable()

14. .ClientDetailTemplateId("detail-template")

15. .HtmlAttributes(new{ style="height:750px"})

16. .DataSource(source => source.Ajax()

17. .PageSize(45)

18. .Read(read => read.Action("GetOrderDtos", "Order")))

19. .Events(events => events.DataBound("on_bind"))

20. )

Is there a better way to filter the results provided to the grid? Like how am I supposed to limit records returned in a meaningful way? How can I determine why the records I'm not seeing aren't showing up? Running a simple SQL query gets my results and the records do not have anything different than normal records from surface inspection.

Grid

answered on 21 Sep 2020

2 answers

81 views

Kenod Combo virtualization

Hi Team,

I have implemented Virtualization and its working fine . But in my case there are 2 pages with similar filter section i want to pass same to other page what i have selected in first page and it should pre load with data. Here i problem is how can i pass selected filter params of virtualized combo and i need to set the same to another combo.

We are using sessiongstorage to transfer current selected data into other page. and using the same we are setting default values to the controls.

Preaviously we filling the combo with all data and setting the slectedvalue property in javascript .

Now we need to set DataSourceRequest to fill the Combo with filter options , help me how can get and set this property in javascript or jquery.

Thanks & Regards,

Sp.

Grid

answered on 21 Sep 2020

1 answer

83 views

Broken editors in parent-child grid configuration

Hi guys,

I have a problem with editors in child grid. It seems that they cannot be initialized when clicking on them.
I've attached a video which is showing how are the grid cells behaving. I've isolated only 3 columns, but it is behaving like this for all columns even these with simple text.
Here is my grid configuration:

@(Html.Kendo()

.Grid<DiscountViewModel>()

.Name("resources")

.HtmlAttributes(new { @class = "fullscreen-grid" })

.AutoBind(false)

.Columns(columns =>

{

columns.Bound(p => p.ResID)

.Title(R.ID)

.Width(70)

.Filterable(true);

columns.Bound(p => p.ResPrice.UnitPriceUnit)

.Width(145)

.Title(R.UnitPriceUOM);

columns.Bound(p => p.PriceEffectiveDate)

.EditorTemplateName("DatePrice")

.Format("{0:" + formatWithoutTime + "}")

.Width(150)

.Title(R.PriceEffective);

})

.Editable(editable => editable.Mode(GridEditMode.InCell).Enabled(!locked))

.NoRecords()

.Sortable()

.Scrollable(s => s.Height("auto"))

.Pageable(x =>

{

x.Enabled(true);

x.PageSizes(defaultGridPageSizes);

x.PreviousNext(true);

x.Refresh(true);

})

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

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

.Reorderable(reorder => reorder.Columns(true))

.DataSource(dataSource => dataSource

.Ajax()

.Batch(true)

.ServerOperation(true)

.PageSize(defaultGridPageSize)

.Model(model =>

{

model.Id(p => p.ResourceID);

})

.Read(read => read.Action("Read", "RController").Data("filterPrice"))

.Update(x => x.Action("Update", "RController").Data("updateResourceFixDates"))

)

.ClientDetailTemplateId("resourceTemplate")

)

<script type="text/kendo" id="resourceTemplate">

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

.Name("res_#=PriceID#")

.HtmlAttributes(new { @class = "hiddenHeaderRow " })

.Columns(columns =>

{

columns.Bound(p => p.ResID)

.Title("ID")

.Width(60);

columns.Bound(p => p.ResPrice.UnitPriceUnit)

.Width(145)

.Title(R.UnitPriceUOM);

columns.Bound(p => p.PriceEffectiveDate)

.EditorTemplateName("DatePrice")

.Title(R.PriceEffective)

.Format("{0:" + formatWithoutTime + "}")

.Width(150);

})

.Editable(editable => editable.Mode(GridEditMode.InCell).Enabled(!locked))

.Sortable()

.Scrollable(scrollable => scrollable.Height(120))

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

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

.Reorderable(reorder => reorder.Columns(true))

.DataSource(dataSource => dataSource

.Ajax()

.Batch(true)

.ServerOperation(true)

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

.Model(model =>

{

model.Id(p => p.ResourceID);

})

.Read(read => read.Action("Read", "RController", new { }))

.Update(update => update.Action("Update", "RController").Data("updateResourceFixDates"))

).ToClientTemplate()

)

</script>

Grid

answered on 21 Sep 2020

1 answer

459 views

Grid Filter options in Alphabetical order

Hi Team,

How can we set Grid filters in alphabetical order?

Thanks & Regards,

Sp.

Grid

answered on 21 Sep 2020

3 answers

400 views

Badges overlaying icons

Trying to find a simple example of a badge where it is overlaying an icon, not next to a button etc. A badge example similar to every other "badge" on the web. Even on this Telerik site, the shopping cart with the "0" items badge overlaid on top.

Badge

answered on 18 Sep 2020

5 answers

968 views

Paging for a detail grid with local data

In my case, the main grid retrieves its data via an Ajax datasource

@(Html.Kendo().Grid<ViewModels.IconViewModel>()

.Name("Icons")

.Columns(columns =>

{

...

})

.Pageable()

.Scrollable(s => s.Height("auto"))

.Navigatable()

.Selectable(s => s.Mode(GridSelectionMode.Single))

.DataSource(dataSource => dataSource

.Ajax()

.PageSize((int)Model.RowsPerPage)

.Read(read => read.Action("GetIcons", "API")

.Type(HttpVerbs.Get)))

.Events(e => e.DetailInit("detailInit"))

.ClientDetailTemplateId("inner-grid-template")

.AutoBind(true)

)

and the detail template is defined as

<script id="inner-grid-template" type="text/kendo-tmpl">

@(Html.Kendo().Grid<ViewModels.IconReferenceViewModel>()

.Name("IconReferences_#=Id#")

.Columns(columns =>

{

columns.Bound(o => o.ClassName).Filterable(false);

columns.Bound(o => o.SubclassName).Filterable(false);

})

.ToClientTemplate()

)

</script>

In the detailInit event, the data source of the detail grid is set to a property of the model. This property holds an array of items.

function detailInit(e) {

var grid = $("#IconReferences_" + e.data.Id).data("kendoGrid");

var data = e.data.References;

grid.dataSource.data(data);

}

So far so good. The data is shown in the grid as intended. But I want the detailed grid to be pageable. I played around with:

Setting .Pageable() in the detail template
Adding a datasource in the detail template in order to set the pagesize (Ajax/Custom?)
Setting grid.dataSource.pageSize (and other properties like serverPageable) in the detailInit() event.

This usually resulted in a brief flicker of the complete detail list or the page reloading or the complete list with a paging control (showing 1-10 of 20, but showing the complete list; using the paging control refreshed the main grid).

So what is the correct way of getting this done?

Grid

answered on 18 Sep 2020

1 answer

344 views

Get and apply grid filters to a chart

I have a grid that shows a detailed list of items. Below that, I show a number of pie charts that show the breakdown of the list category totals, so the grid and the charts use different data sources/ queries since i need grouped totals for the charts.

However, when filtering the grid, I would like to be able to get and apply the same filters to my pie chart data sources. This way they will show the correct totals based on the filtered grid.

What is the best way to apply the same filters from the grid on to the pie charts on the grid filter event?

Filter

answered on 15 Sep 2020

1 answer

490 views

How to add a Column to Agenda View ?

Hello,

I am trying to add another Column to Agenda View, where the Type of each Event will be shown.

So additional to the Date, Time and Names of Events i need to show Type or State or . . . . maybe end up adding more than one Column :-)

I searched for days but I found nothing. !

So I'll be thankful if i get any Help ..

Thanks in advance.

Blackout

Scheduler

answered on 11 Sep 2020