Questions on UI for ASP.NET MVC Forum

0 answers

109 views

Is it possible to have an edit grid button on another page?

Hello, I have a kendo grid in /employees/grid where there is an edit button on the line opening an edit popup

1. Would you like to put this button on another page /consultation/paycheck to open this edit popup?

2. or open this grid /employees/grid in a popup on another page?

thank you

Grid

Toolbar

asked on 02 Jul 2022

1 answer

246 views

How to get the Telerik MVC5 VS 2019 grid column headers to scroll with the content?

Hi, I saw earlier posts about this, but this for an (MVC5 grid, VS 2019, Latest version)

I have no java script errors as suggested as a solution from 2014 posts.

I load the Telerik MVC grid partial view into a div 'lcContent' using $("#lcContent").load(url);

Tried it in both chrome and edge, seems the scrolling is fine if I run it stand alone (i.e. not inside the the confines of the lcContent div)

Thx

I have

In my _Layout file

<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>@ViewBag.Title</title>

@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")

<link rel="shortcut icon" href="@Url.Content("~/favicon.ico")" ; />

<link href="https://cdn.kendostatic.com/2022.2.621/styles/kendo.classic-silver.min.css" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/bootstrap.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<script src="https://cdn.kendostatic.com/2022.2.621/js/jquery.min.js"></script>
<script src="https://cdn.kendostatic.com/2022.2.621/js/jszip.min.js"></script>
<script src="https://cdn.kendostatic.com/2022.2.621/js/kendo.all.min.js"></script>
<script src="https://cdn.kendostatic.com/2022.2.621/js/kendo.aspnetmvc.min.js"></script>
<script src="@Url.Content("~/Scripts/bootstrap.min.js")"></script>
</head>

and in the Index view a side bar menu (UL + Li) and a content pane, as per beneath

with

.lcContent {
transition: margin-left .5s;
padding: 10px;
height: 900px;
width: 90%;
display: block;
overflow-y: hidden;
overflow-x: hidden;
left: 0px;
}

 <style>
    button.k-button {
        background-color: darkgrey !important;
        color: forestgreen
    }

    .k-grid-toolbar {
        /* background-color: lightslategrey !important;*/
    }

    th.k-header {
        color: white;
        background-color: darkslategray !important;
    }

    div.k-grouping-header {
        background-color: gainsboro !important;
    }

    tr.k-master-row {
        background-color: white !important;
        color: blue;
    }

    tr.k-master-row:active, tr.k-master-row:hover {
        background-color: lightgrey !important;
    }

    tr.k-alt {
        color: white;
        background-color: lightcyan !important;
        color: darkblue;
    }

    span.k-icon, k-i-filter {
        background-color: gainsboro !important;
    }

    tr.k-alt:active, tr.k-alt:hover {
        color: darkblue !important;
        background-color: lightgrey !important;
    }

    input.k-input-inner {
        /* background-color: gainsboro !important;*/
    }

    span.k-filtercell {
        /*background-color: red !important;*/
    }

    th {
        background-color: lightslategray !important;
    }

    span.k-operator-hidden {
        display: none;
    }

    div.k-grid-content {
       /* height: 80% !important;*/
    }

    .k-grid tbody tr {
        line-height: 14px;
    }

    .k-grid tbody td {
        padding: 0;
    }

    .k-grid {
        overflow-y: hidden;
        height: 900px;
        min-height: 600px;
       /* width: 2700px;
        max-width: 2800px;*/
        width: 98%;
        max-width: 99%;
        padding-left: 10px;
    }

    .k-button{    }
    .k-grid-Edit{    }
    td.k-command-cell{     }
    .k-button-text{    }
    .k-filter-row{   /* has multiple th beneath it, with a span in them, with k-filter-cell class*/
    }

</style>


 <div id="lcContent" class="lcContent" > 

        <div class="text-left" style=" width: 100%;">
          @(Html.Kendo().Grid(Model)
            .Name("LeasedTenements")
            .Reorderable(reorder => reorder.Columns(true))
            .Columns(columns =>
            {
                columns.Command(command => command.Custom("Edit").Click("Edit")).Width(180);
                columns.Bound(c => c.ID).Hidden();
                columns.Bound(c => c.Lease).Width(150).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
                columns.Bound(c => c.Name).Width(150).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));

                columns.Bound(c => c.LocalityType).Width(250).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
                columns.Bound(c => c.Locality).Width(250).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));

                columns.Bound(c => c.Status).Width(150).Filterable(ftb => ftb.Cell(cell => cell.ShowOperators(false)));
                columns.Bound(c => c.InternalStatus).Width(150).Filterable(ftb => ftb.Cell(cell => cell.ShowOperators(false)));

                columns.Bound(c => c.CurrentArea).Width(250).Filterable(ftb => ftb.Cell(cell => cell.ShowOperators(false)));
                columns.Bound(c => c.AreaType).Width(150).Filterable(ftb => ftb.Cell(cell => cell.ShowOperators(false)));
                columns.Bound(c => c.MineralField).Width(150).Filterable(ftb => ftb.Cell(cell => cell.ShowOperators(false)));
                columns.Bound(c => c.Commodity).Width(150).Filterable(ftb => ftb.Cell(cell => cell.ShowOperators(false)));

                columns.Bound(c => c.GovtOffice).Width(200);
                columns.Bound(c => c.AppliedArea).Width(200);
                columns.Bound(c => c.GrantedArea).Width(200);
                columns.Bound(c => c.AreaSurveyed).Width(100);
                columns.Bound(c => c.CurrentCommitment).Width(200);
                columns.Bound(c => c.NextYearCommitment).Width(200);
                columns.Bound(c => c.CurrentRent).Width(200);
                columns.Bound(c => c.NextYearRentAmount).Width(200);
                columns.Bound(c => c.NextYearRentAmount).Width(200);
                columns.Bound(c => c.Project).Width(200);
                columns.Bound(c => c.CostCode).Width(150);
                columns.Bound(c => c.ManagingCompany).Width(200);
                columns.Bound(c => c.Operator).Width(200);
                columns.Bound(c => c.LeaseManager).Width(200);
                columns.Bound(c => c.ResponsibleParty1).Width(200);
                columns.Bound(c => c.ResponsibleParty2).Width(200);
                columns.Bound(c => c.Region).Width(200);
                columns.Bound(c => c.TotalShares).Width(150);
                columns.Bound(c => c.Comments).Width(200);
                columns.Bound(c => c.LastUpdate).Width(10);
                columns.Bound(c => c.ByWhom).Width(150);
                columns.Bound(c => c.LinkLeaseID).Width(150);

            })
            .ToolBar(toolbar =>
            {
                toolbar.Excel();
                toolbar.Create();
                toolbar.Save();
            })

            .HtmlAttributes(new { style = "width: 99%;" })
            .Scrollable()
            .Groupable()
            .Sortable()
            .Editable(editable => editable.Mode(GridEditMode.InCell))
            .DataSource(dataSource => dataSource
                .Ajax()
                .ServerOperation(false)
                .Model(model =>
                {
                    model.Id(p => p.ID);
                    model.Field(p => p.ID).Editable(false);
                    model.Field(p => p.Lease).Editable(true);
                    model.Field(p => p.Lease).DefaultValue(
                        ViewData["defaultObjections"] as Demo.Mvc.ViewModels.vmTenementObjected);
                    model.Field("GrantDate", typeof(DateTime));
                    model.Field("GrantArea", typeof(int));
                })
            .Create(create => create.Action("EditingCustom_Create", "Objections"))
            .Update(update => update.Action("EditingCustom_Update", "Objections"))
            .Destroy(destroy => destroy.Action("EditingCustom_Destroy", "Objections"))
            )

         .Filterable(ftb => ftb.Mode(GridFilterMode.Row))
         .Reorderable(reorderable => reorderable.Columns(true))

        )

</div>


   </div>

Grid

Styling

answered on 30 Jun 2022

1 answer

140 views

Kendo MVC (version 2021.2.616.545) - Jquery updates NumericTextBoxFor, but GUI doesn't reflect until you click on the NumericTextBox

(as the title says) We updated an app including going to Kendo.Mvc (now Version 2021.2.616.545) and on one page we use Jquery to recalculate a total which is a NumericTextBoxFor. The GUI doesn't reflect, but when you click on the NumericTextBox the correct amount appears. I tried to use focus and changed event but neither seem to help.

Any ideas why this is occurring?

TIA!!

NumericTextBox

answered on 28 Jun 2022

0 answers

284 views

Kendo Dropdown Group field overlaps the options of the dropdown

Hello everyone,

I am using the kendo dropdown list with grouping. I am attaching a screen here with some red borders. The red boxes contain a group of the dropdown list which has a longer length than usual ones and overlaps the main option of the dropdown list.

I am adding a reference link also –

https://demos.telerik.com/aspnet-mvc/dropdownlist/grouping

DropDownList

asked on 28 Jun 2022

1 answer

188 views

Nuget package without client-side resources

Is there a nuget package for ASP.NET MVC that excludes the client-side resources? Due to my dev machine setup, source control bindings and other factors, it takes a very long time to update the kendo Content & Script files any time I update the Kendo nuget package. Having a nuget package for ASP.NET MVC without client side resources (in the same way as the ASP.NET Core package) would help greatly. Even if it's just steps that I can take to create a custom package from an existing release that removes the files in question.

Thanks

Installer and VS Extensions

answered on 28 Jun 2022

2 answers

157 views

Dropdownlist Virtualization Guid

How can i use the dropdownlist Virtualization with a guid id?

ComboBox

DropDownList

answered on 27 Jun 2022

1 answer

126 views

How to update Accessibility Name for Filters

We are working on Asp.Net application and using Telerik 2019 version for Grids to display Reports. We are unable to update Accessibility Name for Filter control as Screen Reader application for Disabled people is not able to recognize filters.

Filter

Grid

answered on 27 Jun 2022

0 answers

228 views

How to make datasource send request parameters as JSON

I have a Kendo Grid MVC with columns that need to get their unique list of multi-filter values from the server. So, I am trying to call an MVC controller method passing the field name and a set of filters.

columns.Bound(c => c.SalesRepName)

                    .Filterable(ftb => ftb.Multi(true).Search(true).DataSource(ds => ds.Custom().Transport(t => t.Read(r => r.ContentType("application/json").DataType("json").Type(HttpVerbs.Post).Action("Portfolio_Read_Filter", "Contract").Data("() => getGridFilterParameters('SalesRepName', 'portfolioGrid')")))));

No matter what I do, the datasource sends the request parameters as form instead of sending the parameters as json.

How to force Kendo dataSource to send request parameters as JSON?

Thank you for you help!

Grid

asked on 22 Jun 2022

0 answers

323 views

Are there plans to fix JQuery Vulnerabilities?

I am currently implementing Kendo UI for ASP.Net MVC.

My application has detected a vulnerability with the latest version of JQuery so there is no version to move to to resolve this vulnerability.

As Kendo comes with JQuery in the package is there work on-going to work with the JQuery community to fix this issue?

Security

asked on 22 Jun 2022

16 answers

1.7K+ views

Reflected XSS in Kendo DataSourceRequest object

We have the below action in a controller for Kendo grid data population

1.public ActionResult GetCompanyDetails([DataSourceRequest] DataSourceRequest request)

2.{

3. var companyDetails = BusinessLayer.GetCompaniesDetail();

4. return Json(companyDetails.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);

5.}

While running checkmarx scan the above method was identified for Reflected XSS vulnerability.

Method GetCompanyDetails at line 1 of wxy/xyz/Controllers/ABCController.cs gets user input for the request element. This element’s value then flows through the code without being properly sanitized or validated and is eventually displayed to the user in method GetCompanyDetails at line 4 of wxy/xyz/Controllers/ABCController.cs. This may enable a Cross-Site-Scripting attack.

How to sanitize the DataSourceRequest request object to fix this XSS issue?

General Discussions

answered on 16 Jun 2022