I have a grid that I want to be an Ajax grid (not Server) but I need to render one of the cells using ASP.NET MVC partials. Looks somewhat like this:

@(Html.Kendo().Grid(Model.Items)
            .Name("items")
            .Columns(columns =>
            {
                columns.Bound(p => p.Payload).Template(@<text>
                    @Html.Partial(item.ItemUI, item.Payload)
                </text>).ClientTemplate("@output");
            })
    .DataSource(dataSource => dataSource
        .Ajax()
    )
)

Is that possible to instruct Kendo to output the result of a call to Template() in ClientTemplate()? In the example above, is there some magic keyword I can use instead of the highlighted @output to say "output whatever was generated on the server side here?"

Thanks

I have a partial MVC view called _user.cshtml that displays some basic information about a user:

@model UserVM
<p>
    <span>Name: </span>@Model.Name
    <span>Email: </span>@Model.Email
</p>

In the parent view I have an MVC Kendo Grid:

@model ImportUsersVM
@(Html.Kendo().Grid(Model.Items)
    .Name("ImportUsers")
        .Columns(columns =>
        {
            columns.Bound(i => i.Status);

            columns.Template(i => Html.RenderPartial("_user", i.Payload));
        })
        .DataSource(dataSource => dataSource
            .Ajax()
            .PageSize(100)
            .ServerOperation(false)
        )
)

The highlighted line above doesn't work -- the user information is not rendered.

How can I include an MVC partial on each row of the grid?

Thank you

I have a grid that has a column that should only be shown if a user selects an option on the view (default is set to hidden). 

Is there a standard way to toggle the visibility of a column dynamically via javascript? 

Problem discovered....now I need some help fixing

I added Telerik to a project of mine today and everything looked fine. My project uses IdentityManagerUI and I use Datatables to display the Roles and Users for adding editing, etc.

I went to check a role and DataTables through up a cryptic error "DataTables warning: table id=usersTable - Requested unknown parameter 'id' for row 0, column 0. For more information about this error, please see http://datatables.net/tn/4. 

I take Telerik back out of the project and everything is fine. Add it back in and I get the same error.

I am currently working in an MVC Core .NET 6 environment using EF6 and all that. I have looked everywhere to see what has changed and I can't find anything. I've stripped down the view to not include js or css from wwwroot or layouts, making sure I'm only using the Kendo references and I still have the problem

Anyone ever have this problem or have an idea of where I should look to see what's going on?

Thanks!!

I have a scheduler that I've created in MVC and reset the data with via javascript

@(Html.Kendo().Scheduler<MyProject.Models.Schedule.Kendo.ISchedulerData>()
                .Name("edit-scheduler")
                .Date((DateTime)MyProject.Helper.Date.StringToDateTime(ViewBag.EventHeader.StartDate.ToString("MM/dd/yyyy")))
                .StartTime((DateTime)MyProject.Helper.Date.StringToDateTime(ViewBag.EventHeader.StartDate.ToString("MM/dd/yyyy")))
                .EndTime((DateTime)MyProject.Helper.Date.StringToDateTime(ViewBag.EventHeader.EndDate.ToString("MM/dd/yyyy")))
                .EventTemplate(
                    "#=eventTemplate(SupplierNumber,SupplierName, MeridiemDeliveryTime, OrdersReadable, OrderGroup1,OrderGroup2,OrderGroup3,OrderGroup4,OrderGroup5,OrderGroup6,OrderGroup7,OrderGroup8,IsEvent,Color)#"
                )
                .Views(views =>
                {
                    views.MonthView(month =>
                    {
                        month.Selected(true);
                        month.EventsPerDay(20);
                        month.AdaptiveSlotHeight(true);
                        month.EventHeight("auto");
                        month.EventSpacing(5);
                    });
                })
                .Timezone("EST")
                .Editable(true)
                .Editable(editable => editable.Confirmation(false))
                .Resources(resource =>
                {
                    resource.Add(m => m.ActiveSupplierNumber)
                    .Title("Owner")
                    .DataTextField("Text")
                    .DataValueField("Value")
                    .DataColorField("Color")
                    .BindTo(ViewBag.Colors);
                })
                .DataSource(d => d
                    .Read(read => read.Action("GetStoreSchedule", "ScheduleData").Data("scheduler_Data"))
                )
                .Events(e =>
                {
                    e.Remove("scheduler_Remove");
                    e.Edit("scheduler_Edit");
                    e.MoveEnd("scheduler_MoveEnd");
                    e.MoveStart("scheduler_MoveStart");
                    e.ResizeStart("scheduler_ResizeEnd");
                    e.DataBound("scheduler_DataBound");
                })
            )

With my scheduler_Data() like this

var _eventHeaderId = 1;
var _stageId = '0B579CE9-2CB8-4ACF-9EC1-892378632823'; // This changes frequently

function scheduler_Data() {
    var store = $("#edit-store-dropdown").data("kendoDropDownList").value();
    var supplier = $("#edit-supplier-dropdown").data("kendoDropDownList").value();
    var sdata = {};
    sdata["eventHeaderId"] = parseInt(_eventHeaderId);
    sdata["stageId"] = _stageId;
    sdata["store"] = parseInt(store);
    sdata["supplier"] = parseInt(supplier);
    return sdata;
}

The first time the page loads, there is no store, the controller does not return data, the scheduler remains blank (exactly as expected)

As I do other things on the page, the store dropdown has a value, and I run some code that updates the _stageId and does some database work, then it refreshes the scheduler, which basically is just me doing this.

    scheduler.dataSource.read();
    scheduler.refresh();

This all works perfectly.  My scheduler populates from the database.  However, if I click into a day (triggering scheduler_Edit) - it creates the event offset by one day, if there is at least 3 other events in the previous day.  So if Sunday has 3 events, and I click Monday, it adds the event to Sunday.  If I have 2 events on Sunday and click Monday, it adds the event to Monday

So I put some code into scheduler_Edit()

console.log("You clicked " + e.event.start);

If I cancel my custom edit window, and click in the same place on scheduler it populates exactly where it should

And the console bears that out

And from that point, it adds to the correct day until I redo the refresh scheduler code

scheduler.dataSource.read();
scheduler.refresh();

Then it happens again?

Am I doing something weirdly wrong?

Hello everyone,

I have a clientfootertemplate in a subcolumn and I want to show something in my column but when I do this the colspan is 3 instead of 1 so instead of 1 column he takes 3 columns.

Can someone help me with this?

I want to do something like what happens at http://demos.telerik.com/aspnet-mvc/treeview/checkboxes, where when you click a node, its parent nodes light up but are not checked. I've looked at the demo and can't figure out how to make this happen. Any ideas would be helpful.

It's the end of the day on Friday, so I don't really have time right now to come up with samples of my code. If no one has an idea by Monday, I will do that.

Thanks!

Laurie

Hi, after following the guide on setting the colour of tasks on data binding, which worked great, we have noticed an issue. If we have something like the following tree

Level 1

-- Level 2

---- Level 3

---- Level 4

Level 5

Level 6

If level 3 and 4 have a background colour set to say purple.... its working fine, but if we collapse Level 2, Level 5 and 6 have the background colour changed to purple as Level 3 and 4 would have been.

From looking at the source code, Levels 5 and 6 seem to replace the details in the rows for Level 3 and 4 but don't change the styling used. What we need to do is on collapsing the level, we need to repaint the rows to refresh the styling.

Is there any event we can use to detect the expanding / collapsing function so i can call another function which repaints the displayed tasks? I've included 2 screenshots which demonstrate the behaviour.

I have set  a java script method

validatePhone

to be called for customeValidator against any change on a RadMaskedTextBox.  But its never gets called.

Can you please help whats wrong here?

<td>
                <telerik:RadMaskedTextBox ID="sNumberPhoneMasked" runat="server" SelectionOnFocus="CaretToBeginning" 
                    Text='<%# SafeEval(Container, "DataItem.Test") %>' ValidationGroup="PhoneValidationGroup1" ></telerik:RadMaskedTextBox>
                <asp:Label ID="sNumberPhoneMaskedValidationIndicator" runat="server" class="WizardValidationRequired_Person vAdjustment" >*</asp:Label>
                    
                
                <asp:CustomValidator runat="server" ID="sNumberPhoneMaskedValidator" ValidationGroup="PhoneValidationGroup1" ErrorMessage="Phone Number is required."
                             SetFocusOnError="true"   ControlToValidate="sNumberPhoneMasked" ClientValidationFunction="validatePhone"></asp:CustomValidator>
                    <asp:ValidatorCalloutExtender ID="sNumberPhoneMaskedPopupValidator" runat="server" 
        TargetControlID="sNumberPhoneMaskedValidator" Width="200px" />

            </td>
 
<td align="right" colspan="2">
    <asp:Button ID="sPhoneGridEditFormSubmit" CssClass="button-blue" Text='<%# (Container is GridEditFormInsertItem) ? "Add" : "Update" %>'
        runat="server" CommandName='<%# (Container is GridEditFormInsertItem) ? "Add" : "Update" %>' ValidationGroup="PhoneValidationGroup1"
        CausesValidation="True"></asp:Button>&nbsp;
    <asp:Button ID="sCancel" CssClass="button-blue" Text="Discard" runat="server" CausesValidation="False"
        CommandName="Cancel"></asp:Button>
</td>
 
<script type="text/javascript">
function validatePhone(Source, args) {
    debugger;
    alert('test');
    args.IsValid=false;
    
}
</script>