Telerik Forums
UI for ASP.NET Core Forum
1 answer
161 views

I have a grid child template that consists of a data source and several charts referencing that data source. It is a mystery to me how you are supposed to reference the 'data' context in different scenarios.

After much trial and error I got the url and filter value on the data source to resolve successfully.

But with these nothing seems to work...

The 'name' attribute on kendo-datasource just renders literally as 'ds-${data.DeviceId}'

Same with the 'datasource-id' attributes on the charts.

Tried variants on wrapping in @() but am getting nowhere. Very confusing and seems the only documentation is this example:

Integration with Grid in ASP.NET Core Template Component Demo | Telerik UI for ASP.NET Core


<grid-detail-template> <kendo-datasource name="ds-${data.DeviceId}" type="DataSourceTagHelperType.Ajax" server-filtering="true" is-in-client-template="true"> <transport> <read url="@Html.Raw("/Devices/Diagnostics/${data.DeviceId}?handler=Read")" type="post" data="forgeryToken" /> </transport> <filters> <datasource-filter logic="and"> <filters> <datasource-filter field="DeviceId" operator="eq" value="@("${data.DeviceId}")"></datasource-filter> <datasource-filter field="LogDate" operator="gt" value="@DateTime.Today.AddMonths(-1)"></datasource-filter> </filters> </datasource-filter> </filters> <schema> <model> <fields> <field name="DeviceId" type="number" /> <field name="LogDate" type="date" /> </fields> </model> </schema> </kendo-datasource> <kendo-chart name="memChart" theme="Bootstrap" datasource-id="ds-${data.DeviceId}">

</kendo-chart>


 

Mihaela
Telerik team
 answered on 01 Aug 2023
1 answer
206 views

In the latest release, 23.1.4, a Date time picker with the DateInput option set fails to be initialized with a jQuery error "s is not a constructor".

This occurs in my code and when using the example from the demo pages https://demos.telerik.com/aspnet-core/datepicker/basic-usage

TagHelper:

<kendo-datepicker name="monthpicker" date-input="true" format="MMMM yyyy" value="DateTime.Now" start="CalendarView.Year" depth="CalendarView.Year" name="monthpicker" style="width: 100%" title="monthpicker">
        </kendo-datepicker>

HtmlHelper:

@(Html.Kendo().DatePicker() .Name("monthpicker") .Start(CalendarView.Year) .Depth(CalendarView.Year) .Format("MMMM yyyy") .Value("November 2011") .DateInput() .HtmlAttributes(new { style = "width: 100%", title = "monthpicker" }) )

 

Both of the above fail to be initialized with the same error. JQuery version 3.3.1 is being used in this case.

Gordon

Mihaela
Telerik team
 answered on 31 Jul 2023
1 answer
220 views

Hi, Recently I started migrating a .Net MVC project with Kendo to .Net Core MVC. Most of the things went smooth but I'm badly stuck on one thing.

Below is my code where I have a Kendo tabstrip that has three tabs. The last two has Html.Partial in their Content which is working fine. The First one has @RenderSection("HomeTab", false) which I can't get to work. Doesn't RenderSection work with .Net Core MVC?

I have tried removing all of my code and tried just adding a test div inside this section but nothing works. If I move the content of my HomeTab section to another view and try Html.Partial it works but RenderSection doesn't. The tabstrip is inside a Layout page and the content of the HomeTab section is in a different view that also have other sections that are rendering completely fine. I'm badly stuck in this and need help please.

section id="main" class="PageSection">
            @(Html.Kendo().TabStrip()
        .Name("tabstrip")
        .Events(events => events
            .Select("onTabSelected")
            .Activate("onTabActivated")
            .ContentLoad("onTabContentLoaded")
            .Error("onTabError")
        )
        .Animation(animation =>
        {animation.Enable(false);})
        .Items(tabstrip =>
        {
            if (!ViewBag.isOffline)
            {
                tabstrip.Add().Text("Home")
                .HtmlAttributes(new { id = "hometabid" })
                .Selected(true)
                .ImageUrl(Url.Content("~/Content/Images/HomeTabIcon.png")).ImageHtmlAttributes(new { id = "hometabimgid" })
                .Content(@<text>
                            @RenderSection("HomeTab", false)
                        </text>).ContentHtmlAttributes(new { @style = "overflow: auto;" });
            }
            tabstrip.Add().Text("Lead Search")
                .HtmlAttributes(new { id = "LeadSearchtabid" })
                .Selected((bool)ViewBag.isOffline).ContentHtmlAttributes(new { @style = "overflow: auto;" })
                .ImageUrl(Url.Content("~/Content/Images/search-lead-icon.png")).ImageHtmlAttributes(new { id = "leadsearchtabimgid" })
                .Content(@<text>
                    @Html.Partial("LeadSearching")
                </text>);
           if (ViewBag.isOffline)
            {
                tabstrip.Add().Text("VoiceMail")
                .HtmlAttributes(new { id = "vmtabid" })
                .Selected(false)
                .ImageUrl(Url.Content("~/Content/Images/HomeTabIcon.png")).ImageHtmlAttributes(new { id = "hometabimgid" })
               .Content(@<text>
                            @Html.Partial("VoiceMail")
                </text>).ContentHtmlAttributes(new { @style = "overflow: auto;" });
            }
        }))
            @RenderBody()
            <div id="dvNotification"></div>
        </section>

Aleksandar
Telerik team
 answered on 31 Jul 2023
1 answer
98 views

Hello, I've tried to search online and in this forum for this, but I've not found anything useful.

 

How can the header row for Grids be made resizable?

Currently all our grids have resizable columns, but sometimes texts are very long which make the header very high, for this cases we need that users are able to resize the header vertically.

 

Thanks in advance

Vasko
Telerik team
 answered on 28 Jul 2023
1 answer
207 views

I am using a drop down list in column template inside a grid..I could save sucessfully but when i click on edit the dropdown losses its bind.Can any one help  with what i am missing

   <kendo-dropdownlist name="Team"
                                        datatextfield="Team"
                                        datavaluefield="TeamID" data-bind="value:Team">
                        <datasource>
                            <transport>
                                <read url="@Url.Action("Teams_Read", "Grid")" />
                            </transport>
                        </datasource>
                    </kendo-dropdownlist>

 

i chnaged name of the dropdown to the value of what i wante dto bind but it didnt work.

Vasko
Telerik team
 answered on 28 Jul 2023
1 answer
263 views

HI

I have a grid with row reorder enabled in bootstrap 4 pop up modal. 

I can drag the row but cannot drop the row to another position., It works outside of modal. 

Can I know is there anything extra to set or need a hack to allow the dropping of row to reorder them?

My code below:

Note: Datasource is set on document ready script.

<div class="modal fade" id="ServiceDetailModal" role="dialog" aria-labelledby="ServiceDetailModalLabel" aria-hidden="true" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog" role="dialog">

        <form id="ServiceDetailModalForm" autocomplete="off" >

            <div class="modal-content">

                <div class="modal-header pb-0">
                    Services Detail
                </div>
                <div class="modal-body">

@(
Html.Kendo().Grid<DSPJobServiceItems>()
.Name("modalServiceDetail_ServiceFeeItem")
.Editable(editable => editable.Mode(GridEditMode.InCell))
.Navigatable(true)
.Reorderable(r => r.Rows(true))
.Events(e => e.Edit("ServiceFeeEdit").RowReorder("modalServiceDetail_ServiceFeeItemRowReorder"))
.Columns(columns =>
{
columns.Template("").Width(50).Draggable(true); 
columns.Bound(p => p.GeneralServiceTitle).Title("Service Item");
})
)

</div>

                <div class="modal-footer">
                    <button type="button" class="k-button btn-danger">Close</button>
                </div>
            </div>
        </form>
    </div>
</div>
Alexander
Telerik team
 answered on 27 Jul 2023
1 answer
175 views

This is my grid:

@(Html.Kendo().Grid<Project>()
    .Name("ProjectsGrid")
    .Columns(columns =>
    {
        columns.Bound(p => p.ProjectName)
            .ClientTemplate("<a href=/Directory/project/${Id} target=_blank>${ProjectName}</a>")
            .Width(180);
        columns.Bound(p => p.ProjectManager).Width(230)
            .ClientTemplate("#=data.ProjectManager?.Name#")
            .EditorTemplateName("WorkingEmployee")
            .Sortable(s => s.Compare("(a, b) => compareManager(a, b)"));
        columns.Bound(p => p.IsActive)
            .Width(180)
            .ClientTemplate("#: IsActive ? 'Yes' : 'No' #");
    })
    .ToolBar(toolbar =>
    {
        toolbar.Save();
        toolbar.Search();
    })
    .Search(s =>
    {
        s.Field(e => e.IsActive);
        s.Field(e => e.ProjectName, "contains");
    })
    .Sortable()
    .Editable(GridEditMode.InCell)
    .DataSource(dataSource => dataSource
        .Ajax()
        .Batch(true)
        .ServerOperation(false)
        .Events(events => events.Error("error_handler"))
        .Model(model =>
        {
            model.Field(p => p.ProjectManager).DefaultValue(
                ViewData["defaultProjectManager"] as User);
            model.Field(p => p.ProjectName).Editable(false);
        })
        .Read("Projects_Read", "Directory")
        .Update("Projects_Update", "Directory")
    ))

 

With "s.Field(e => e.ProjectName, "contains");" it throws:

 

Uncaught TypeError: e.charAt is not a function kendo.all.js:2114

 

Without this, it runs correctly.

 

Additional question

Also, I would like to know how to search for value of bool variable. The variable is shown as yes, no words. When I search for no, it should show me records where value is false. How to implement this?

Stoyan
Telerik team
 answered on 25 Jul 2023
1 answer
114 views

I'm trying to add a RadioGroupFor control to a Toolbar control as a templated item but am getting a JS error related to the generated client template.

Here is the template definition:

<script id="ApproveOrDenyTemplate" type="text/x-kendo-template">
    @(Html.Kendo().RadioGroupFor(model => model.ApproveOrDeny)
        .Layout(RadioGroupLayout.Horizontal)
        .HtmlAttributes(new { style = "display: inline-flex; vertical-align: top;" })
        .LabelPosition(RadioGroupLabelPosition.After)
        .Items(i =>
        {
            i.Add().Label("Approve").Value("Approve");
            i.Add().Label("Deny").Value("Deny");
        })
        .Events(e => e.Change("changeApproveOrDeny"))
        .ToClientTemplate()
    )
</script>

Here is the Toolbar templated item entry:

items.Add()
    .TemplateId("ApproveOrDenyTemplate")
    .Hidden(!Model.ShowApprovalRadioGroup);
Here is the error being thrown and the generated client template javascript (the bold red code is what shows as offending text in console.log) - have I defined the template wrong or is the toolbar item entry wrong?
VM48:1 Uncaught SyntaxError: Unexpected token '<'
kendo.syncReady(function(){jQuery("\#ApproveOrDeny").kendoRadioGroup({"change":changeApproveOrDeny,"items":[{"label":"Approve","value":"Approve"},{"label":"Deny","value":"Deny"}],"value":"Approve","layout":"horizontal","labelPosition":"after"});});<\/script>
Alexander
Telerik team
 answered on 25 Jul 2023
1 answer
469 views

I've got a page which contains a dozen tabs, each of which has their own ViewComponent. Each ViewComponent has many datepicker controls. 

I have a situation where I need to disable almost all of them, except on one tab, based on the user's role. 

What are some ways to do this in one fell swoop, rather than setting .Enable(false) on each individual datepicker in markup?

Bonus: there are some regular old <input type="text">'s on these forms as well. Those are easy enough to disable with JQuery, but JQuery doesn't work on the datepickers, because while the text portion is read-only, the popup button displaying a calendar still works and can change the value of the text box.

Thanks so much for any ideas!

Stoyan
Telerik team
 answered on 25 Jul 2023
1 answer
645 views

I am using AspNet Core MVC 7

I am trying to create a custom HTML helper outside of a razor view. I am using the IHtmlHelper in this scenario and unfortunately outside of a razor view I cannot do something like this:

var uploader = _helper.Kendo().Upload()
                .Name("uploadFiles")
                .Multiple(true)
                .HtmlAttributes(new { style = "margin: 15px 0 5px 0;" });

Compilation error:


Error CS1061 'IHtmlHelper' does not contain a definition for'Kendo'

and no accessible extension method 'Kendo' accepting a first argument of

type'IHtmlHelper' could be found (are you missing a using directive or an assembly reference?)


 

Alexander
Telerik team
 answered on 25 Jul 2023
Narrow your results
Selected tags
Tags
+? more
Top users last month
Jay
Top achievements
Rank 3
Bronze
Iron
Iron
yw
Top achievements
Rank 2
Iron
Iron
Stefan
Top achievements
Rank 2
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Bohdan
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Jay
Top achievements
Rank 3
Bronze
Iron
Iron
yw
Top achievements
Rank 2
Iron
Iron
Stefan
Top achievements
Rank 2
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Bohdan
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?