Questions on UI for ASP.NET MVC Forum

1 answer

155 views

Hi. I inherited an MVC application that is using this version - 2013.2.6.11.340. I need to updgrade away from this, as it was discovered that there is a security issue w/anything 2020 and below. Is ther a document that can assist me in this regards?

Application

Grid

Toolbar

answered on 25 Jan 2023

1 answer

661 views

No Telerik Menu in VS 2022

I'm not able to see the Telerik menu in VS 2022 after the installation of Telerik on my machine. But my co developer was able to see the menu after the installation of telerik on his machine. I have attached screenshot of the menu from my co developer machine. Do I need to enable any settings in VS2022?

Menu

answered on 24 Jan 2023

0 answers

113 views

Kendo does Not render if data contains hash (#) when using ToClientTemplate in TileLayout.

Hi!

I'm using the TileLayout which needs BodyTemplateId to Render. Inside my assigned BodyTemplateId I have this code below which works if the data from Address does not contain a hash (#) character. Say, the Address from the database is "UNIT #1 ABC BLDG" will not render the TextArea.

Code:

@Html.LabelFor(m => m.CompleteAddress, "Address")
</div>
<div class="col-md-5">
@(Html.Kendo().TextAreaFor(m => m.CompleteAddress).Rows(2)
.Readonly(true)
.ToClientTemplate()
)
</div>

</div>

</script>

@(Html.Kendo().TileLayout()
.Name("TileLayout")
.Columns(4)
.RowsHeight("20px")
.Containers(c =>
{
c.Add().BodyTemplateId("address-template").ColSpan(4).RowSpan(6);
})
)

What to do?

Thanks!

RGA

TextArea

TileLayout

updated question on 24 Jan 2023

1 answer

483 views

Grid - how to disable in-line editing

I have a grid with in-line editing enabled. This works well.

There is now a requirement to disable editing of the displayed records, depending on the filter selected (at the top of the page). I need a way to simply turn on or off editing via JavaScript .

Please note, this isn't conditional editing, the filter is selected via controls on the top of the page, which then trigger a data source read. Depending on the chosen filter date (i.e. in the past) I need to simply disable editing of all the displayed records.

Thanks

Grid

answered on 23 Jan 2023

1 answer

860 views

uncaught ReferenceError: Kendo is not defined

Hi I am getting the following error.

'Kendo is not defined'

I have bundelled and include the following in _layout.cshtml

<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@ViewBag.Title - My ASP.NET Application</title>
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
@Styles.Render("~/Content/kendo/css")
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/kendo")
@RenderSection("scripts", required: false)
</head>

and at the end body i have the following

@Scripts.Render("~/bundles/bootstrap")
@Scripts.Render("~/bundles/jqueryval")

The layout page it self looks ok , but when I display the partial view page with data. The grid data displays as a list but not as kendo grid view and the error shows kendo is not defined.

Thanks

General Discussions

answered on 20 Jan 2023

0 answers

176 views

Menu - Styling, how to reduce padding?

I have a menu, using v2022.2.802 and I need to reduce the padding on the top level of the menu. The documentation does not include any examples on how to do this.

What styles need to be changed to reduce the padding on the menu? I have reduced the font-size by using:-

.k-menu-link-text {
        font-size: smaller !important;
   }

But this still leaves a larger amount of padding on the top level menu.

Thanks

Menu

asked on 16 Jan 2023

1 answer

217 views

ID for TabStrip Item

Is there a solution for assigning a unique ID to a table strip item? Currently I can see an example where you can reference the TabStip item name with the following however I need to assign a unique ID because the item name of my tabs can vary. The ordinal position can vary also.

$(e.item).find("> .k-link").text()

TabStrip

answered on 12 Jan 2023

1 answer

159 views

Upload async mode - sequential upload of images?

Hi,

one of our customers currently has difficulties uploading multiple images asynchronous. Single images seem to be ok.

We're already using the option Batch(false), so images arrive one at a time at the server.

The uploads seem to occur simultaneously, though. Is there an option to also upload these sequentially, or do we need to use the synchronous mode in this case?

Upload

answered on 12 Jan 2023

1 answer

324 views

Upload - IEnumerable<HttpPostedFileBase> images null on tablets for multiple images

HI,

we're using the Upload control like this:

Client:

@(Html.Kendo().Upload()
        .Name("images")
        .Async(a => a
            .Save("SaveImages", "Box")
            .Batch(false)
            .AutoUpload(true)
        )
        .HtmlAttributes(new { accept = "image/*" })
        .Events(e => {
            e.Upload("upload");
            e.Remove("remove");
        })
        .DropZone(".dropZoneElement")
        .ShowFileList(false)
        .Validation(v => v.AllowedExtensions(new string[] { ".jpg", ".jpeg", ".png", ".bmp", ".gif" }))
    )

// https://docs.telerik.com/kendo-ui/knowledge-base/upload-mvc-send-additional-data
        function upload(e) {
            e.data = {
                id: @Model.ID
            };
        }

        function remove(e) {
            e.data = {
                id: @Model.ID
            };
        }

Server:

public ActionResult SaveImages(IEnumerable<HttpPostedFileBase> images, int id)
        {
            var ids = new Dictionary<string, int>();

            if(id > 0)
            {
                foreach (var image in images)
                {
                    ...
                }
            }
            
            return Json(ids);
        }

A customer of ours now has the problem, that when uploading multiple images the images-Parameter on server-side is null. Uploading single images is working. The problem is only occuring on tablets.

We currently cannot reproduce this behaviour. Is there anything we must know here which can lead to this behaviour?

Upload

answered on 11 Jan 2023

1 answer

174 views

Setting variable based on model value on row level dropdown list

I have had to admit defeat after much googling and trial and error I have been unable to recreat what I want.

I have a view model that can be simplified as follows;

    public class HeadsOfClaim
    {
        public HeadsOfClaim()
        {

        }

        public int? ClaimId { get; set; }
        public int? ClaimDetailId { get; set; }
        public string ClaimType { get; set; }
        public string Description { get; set; }
        public bool Rejected { get; set; }
    }

A controller which returns the json

    public ActionResult ReturnHeads([DataSourceRequest]DataSourceRequest request, int? id)
    {
        Claim c = db.Claims.Find(id);
        IEnumerable<HeadsOfClaim> details = ViewModels.HeadsOfClaim.GetList(c);
        return Json(details.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
    }

and a view that includes the following

    @(Html.Kendo().Grid<ClaimRegister.ViewModels.HeadsOfClaim>()
        .Name("Grid")
        .Columns(columns =>
        {
            columns.Bound(p => p.ClaimType).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
            columns.Bound(p => p.Description).Filterable(ftb => ftb.Cell(cell => cell.ShowOperators(false))).Width(225);
            columns.Template(@<text></text>).HtmlAttributes(new { @class = "templateCell", id = "#=id#" }).ClientTemplate(
                Html.Kendo().DropDownButton()
                    .Name("menu_TEST_#=id#")
                    .Text("Action")
                    .Size(ComponentSize.Large)
                    .Items(its =>
                    {
                        its.Add().Text("Reverse Rejection").Hidden("#=Rejected#" == "true").HtmlAttributes(new { data_id = "#=id#" }).Click("ConfirmUnReject");
                        its.Add().Text("--Set").Hidden("#=Rejected#" != "true").Enabled(false);
                        its.Add().Text("Reserve").Hidden("#=Rejected#" != "true").HtmlAttributes(new { data_title = "Set Reserve", data_url = Url.Action("Individual", "Reserve", new { type = type, id = "#=id#" }) }).Click("LaunchModal");
                        its.Add().Text("Settlement").Hidden("#=Rejected#" != "true").HtmlAttributes(new { data_title = "Set Settlement", data_url = Url.Action("Individual", "Settlement", new { type = type, id = "#=id#" }) }).Click("LaunchModal");
                        its.Add().Text("--View").Enabled(false);
                        its.Add().Text("Allocation").HtmlAttributes(new { data_title = "Review Allocation", data_url = Url.Action("Review", "Allocation", new { id = "#=id#" }) }).Click("LaunchModal");
                    })
                    .ToClientTemplate().ToHtmlString()
            );
        })
        .Pageable()
        .Sortable()
        .Groupable()
        .Events(ev => ev.DataBound("initMenu"))
        .Filterable(ftb => ftb.Mode(GridFilterMode.Row))
        .DataSource(dataSource => dataSource
            .Ajax()
            .Model(m => {
                m.Id(d => d.ClaimDetailId);
                m.Field(d => d.Rejected);
            })
            .Group(groups => groups.Add(p => p.ClaimType))
            .Read(read => read.Action("ReturnHeads", "ClaimDetails", new { id = id }))
        )
    )

...

<script>
    function initMenu(e) {
        $(".templateCell").each(function () {
            eval($(this).children("script").last().html());
        });
    }
</script>

My problem is setting the visibility of the dropdown options. Effectively dependent on whether the claim is Rejected (true or false) I want different options to be available to the user.

I had a look at the template script before initMenu runs but the evaluation is already made by that stage so it is unclear how it is doing the checking.

Irrelevant of whether rejected is true or false I get "Reverse Rejection", "--View" and "Allocation" as the only visible option.

Any help or insights gratefully received.

DropDownList

Grid