Questions on UI for ASP.NET MVC Forum

0 answers

147 views

Events Finishing on Day not Appearing in Timeline View

Hi,

We have a scheduler with two views - a week view and a timeline view. When in the week view all events seem to show - however when in the timeline view any event that finishes on the day in question disappears. The start date does not seem to matter. For events that cross days they appear on any day that isnt the end date - so for example if i have an event that starts Monday through to Thursday the event will show on Monday, Tuesday and Wednesday but not Thursday. Navigating to Thursday does display the event briefly but then the event disapears.

The Razor code for the scheduler is:

@(Html.Kendo().Scheduler<F0CUSWeb.Models.PlanningScheduleViewModel>()
                .Name("apptScheduler")
                .AutoBind(true)
                .HtmlAttributes(new { style = "height: 80vh;" })
                .MajorTick(120)
                .Editable(editable =>
                {
                    editable.Destroy(false);
                    editable.Move(false);
                    editable.Resize(false);
                    editable.Confirmation(true);
                })
                .Views(views =>
                {
                    views.TimelineWeekView(timeline =>
                    {
                        timeline.DateHeaderTemplate("<span class='k-link k-nav-day'>#=kendo.toString(date, 'ddd dd MMM yy')#</span>");
                        timeline.MajorTimeHeaderTemplate("<span class='k-link k-nav-day' style='font-size:12px'>#=kendo.toString(date, 'HH:mm')#</span>");
                        timeline.Title("Week View");
                        timeline.ColumnWidth(30);
                        timeline.MajorTick(480);
                        timeline.WorkDayStart(new DateTime(2010, 1, 1, 0, 0, 0));
                        timeline.WorkDayEnd(new DateTime(2010, 1, 1, 23, 59, 59));
                        timeline.ShowWorkHours(false);
                    });
                    views.TimelineView(timeline =>
                    {
                        timeline.DateHeaderTemplate("<span class='k-link k-nav-day'>#=kendo.toString(date, 'ddd dd MMM yy')#</span>");
                        timeline.MajorTimeHeaderTemplate("<span class='k-link k-nav-day' style='font-size:12px'>#=kendo.toString(date, 'HH:mm')#</span>");
                        timeline.Title("Day View");
                        timeline.StartTime(new DateTime(2010, 1, 1, 6, 0, 0));
                        timeline.EndTime(new DateTime(2010, 1, 1, 20, 0, 0));
                        timeline.ColumnWidth(20);
                        timeline.MajorTick(60);
                    });
                })
                    .Events(e =>
                    {
                        e.DataBound("apptSchedulerBound");
                        e.Navigate("onSchedulerNavigate");
                    })
                    .DataSource(ds =>
                    {
                        ds.Events(events =>
                        {
                            events.Error("endAnimation");
                        });
                        ds.Read(read => read.Action("GetSchemeSchedule", "Planning").Data("schemeScheduleString"));
                    })
                    .Group(group => group.Resources("Gang").Orientation(SchedulerGroupOrientation.Vertical))
                    .Resources(resource =>
                    {
                        resource.Add(m => m.Gang)
                            .Title("Gang")
                            .Name("Gang")
                            .DataSource(ds => ds
                                .Custom()
                                .Transport(transport => transport.Read(read => read.Action("GetGangsForSchemePlanning", "Planning")/*.Data("getGangsForAppts")*/))
                                .Schema(s => s
                                    .Data("Data")
                                    .Total("Total")
                                    .Model(m =>
                                    {
                                        m.Id("ID");
                                        m.Field("Name", typeof(string));
                                    })))
                        .Multiple(true)
                        .DataValueField("ID")
                        .DataTextField("Name");
                    })
                    .EventTemplateId("eventTemplate")
            )

Any help would be appreciated as it is driving us mad!

Thanks

Scheduler

asked on 26 Nov 2021

1 answer

173 views

Allow users to download all the data rather than what they see on the grid based on paging.

HI I am using asp.net mvc .net (not core). I have a grid which has paging . Pagig size is 20. Now lets say I have functionality for download excel file and pdf file. When user click on the download I want to download all the data not just what user see on the particular page.

Thanks

Grid

answered on 26 Nov 2021

1 answer

162 views

[Solved] Multi level grid expand button doesn't show

I'm trying to create a 3 level hierarchy grid, but for some reason the second level doesn't show the expand button.

The only reason the 3rd level is expanded in the pic is because of the dataBound script, which expands everything.

How do I make the second level expandable?

Here's the code:

@(Html.Kendo().Grid(Model.SalaryApprovalEmployments)
      .Name("grid")
      .Columns(columns =>
      {
          columns.Bound(e => e.Id).Width(100);
          columns.Bound(e => e.TotalCost).Width(100);
          columns.Bound(e => e.Trend).Width(100);
      })
      .DataSource(dataSource => dataSource
                      .Ajax()
                      .Model(model =>
                      {
                          model.Id(sae => sae.Id);
                      })
                      .ServerOperation(false)
      )
      .Events(events => events.DataBound("dataBound"))
      .ClientDetailTemplateId("salaryCodeTemplate")
      .HtmlAttributes(new { style = "width:600px;" })
    )

<script id="salaryCodeTemplate" type="text/kendo-tmpl">
@(Html.Kendo().Grid<SalaryApprovalTransactionDTO>()
      .Name("grid_#=Id#")
      .Columns(columns =>
               {
                   columns.Bound(o => o.SalaryApprovalEmploymentId).Width(100);
                   columns.Bound(o => o.SalaryCodeId).Width(100);
                   columns.Bound(o => o.Amount).Width(100);
               })
      .DataSource(dataSource => dataSource
                      .Ajax()
                      .Model(model =>
                             {
                                 model.Id(sat => sat.SalaryCodeId);
                             })
                      .Read(read => read.Action("HierarchyBindingTransactions", "SalaryApproval", 
                                                new { salaryApprovalGroupId = Model.Id, salaryApprovalEmploymentId = "#=Id#" }))
      )
      .Events(events => events.DataBound("dataBound"))
      .ClientDetailTemplateId("transactionTemplate")
      .ToClientTemplate()
    )
</script>

<script id="transactionTemplate" type="text/kendo-tmpl">
@(Html.Kendo().Grid<SalaryApprovalTransactionDTO>()
      .Name("grid_#=SalaryApprovalEmploymentId#_#=SalaryCodeId#")
      .Columns(columns =>
               {
                   columns.Bound(o => o.SalaryCodeId).Width(100);
                   columns.Bound(o => o.UnitPrice).Width(100);
                   columns.Bound(o => o.Hours).Width(100);
                   columns.Bound(o => o.Days);
                   columns.Bound(o => o.Amount).Width(100);
               })
      .DataSource(dataSource => dataSource
                      .Ajax()
                      .Model(model =>
                             {
                                 model.Id(sat => sat.Id);
                             })
                      .Read(read => read.Action("HierarchyBindingTransactions", "SalaryApproval", 
                                                new { salaryApprovalGroupId = Model.Id, salaryApprovalEmploymentId = "#=SalaryApprovalEmploymentId#", salaryCodeId = "#=SalaryCodeId#" }))
      )
      .ToClientTemplate()
    )
</script>

<script>
    function dataBound() {
        var grid = this;
        this.tbody.find("tr.k-master-row").each(function( index ) {
            grid.expandRow(this);
        });
    }
</script>

Grid

answered on 26 Nov 2021

1 answer

1.3K+ views

[Solved] When creating grid. How I can make certain columns read only

HI Using asp.net mvc .net (not core). I want to disable columns for edit. Person can read it but cannot overrite it. How I can do that?

Grid

answered on 26 Nov 2021

1 answer

204 views

[Solved] Allow sorting in 2 selected column but not all the columns in grid.

HI I am using asp.net mvc .net (not core). Creating the grid. The grid has multiple columns I only want to have sorting in 2 columns. HOw I can do that?

Grid

Sortable

answered on 26 Nov 2021

4 answers

1.2K+ views

How to add tooltip for spreadsheet cell . and how to create a custom tooltip for cell

Adding tooltip to spreadsheet cell and also provide custom tooltip

Spreadsheet

answered on 25 Nov 2021

0 answers

178 views

AutoCompete get additional info

Hi I am using the Autocomplete textbox. It finding to the datasource fine. Just like Product is being used in the demo.

1. My question is if I have a product list. And it has the column product type , and I want to captrue the value of prodcut type then how I can do that. Product is binds with the userId.

2. I have a model class as

ModelViewMY {

date TodaysDate {get;set} // date is not part of the list.

List<Users> Users {get;set}

}

Question now: if I am using the AutoComplete in my mvc project then how I can set the DataTextFiled(Useres.UserId). I tried but I am getting errors.

@(Html.Kendo().AutoComplete()
.Name("searchParam")
.DataTextField("Id") //DataTextField("dataField")
.Filter("contains")
.MinLength(3)

AutoComplete

asked on 24 Nov 2021

1 answer

810 views

[Solved] How to refresh custom filter options in kendo grid ?

Hello,

I have a kendo grid, with custom filter in some columns defined like this:

c = columns.Bound(x => x.Field1).Title("Field1").Width(130).Filterable(filterable => filterable.Extra(false).UI("customField1Filter").Operators(op => op.ForString(str => str.Clear().IsEqualTo("Is equal to"))));

and

function customField1Filter(element) {
        element.kendoDropDownList({
            dataTextField: "Text",
            dataValueField: "Value",
            dataSource: {
                transport:{
                    read: {
                        data: getdata(),
                        url: "@Url.Action("PopulateField1Filter", "Common")"
                    }
                }
            },
            optionLabel: "--Select Value--"
        });
    }

It works fine, but in order to implement a complex cascading filtering betweent a lot of columns, I have to refresh the options of them.

For exemple: columns 1 display country, columns 2 display city, both are filterable. When I select a country on first filter, i have to refresh the options of the city filter.

How to programmacally refresh filter option of a specific column ? Or refresh filters of all columns witout refresh grid data ?

Thanks in advance

Filter

Grid

answered on 23 Nov 2021

1 answer

427 views

How to enable editing on rowclick in Kendo MVC Grid in InLine mode?

I have a Kendo MVC Grid, I don't want the edit button to edit the row. I want to enable the editing once the User clicks on the row. Is there any way to do this?

Grid

answered on 23 Nov 2021

1 answer

154 views

Is there any way to edit individual cell like this in Kendo Grid?

I need to implement cell editing in Kendo Grid and save the cell value like this. Is there any way to do this? The given Inline InCell editing mode doesn't solve my purpose. please find the attached screenshot.

Grid

answered on 23 Nov 2021