We have a page that uses the Kendo Grid along with Kendo DropDownLists. The page has a strongly typed model of type ImportModel.  We are trying to POST the entire page at one time.  We were able to get it working but it only works in IE.  Is there a better way to do this?
 
ImportModel looks like the following:
        public string Country { get; set; }                                       //loaded from Kendo DropDownList
        public string Language { get; set; }                                      //loaded from Kendo DropDownList
       public IEnumerable<ImportModel.ImportItem> gridItems { get; set; }        //this is always NULL in Chrome and Firefox once the grid is POSTed
 
ImportItem is defined as:
        public class ImportItem
        {
            public bool Enabled { get; set; }
           
            [Required(ErrorMessage = "Site ID is required")]
            public string SiteId { get; set; }
            [Required(ErrorMessage = "User Name is required")]
            public string UserName { get; set; }
            public string UserPhone { get; set; }
            [Required(ErrorMessage = "User Email is required")]
            public string UserEmail { get; set; }
                }
 
The grid:
                        @(Html.Kendo().Grid<ImportModel.ImportItem>()
                        .Name("importgrid")
                        .ToolBar(toolbar =>
                        {
                            toolbar.Create();
                        })
                           .Columns(columns =>
                           {
                               columns.Bound(item => item.SiteId).Width(220).Title("Site ID").Encoded(true).ClientTemplate("#= SiteId #" +
                                        "<input type='hidden' name='gridItems[#= index(data) #].SiteId' value='#= SiteId #' />");
                               columns.Bound(item => item.UserName).Title("User Name").Encoded(true).ClientTemplate("#= UserName #" +
                                        "<input type='hidden' name='gridItems[#= index(data) #].UserName' value='#= UserName #' />");
                               columns.Bound(item => item.UserPhone).Title("User Phone").Encoded(true).ClientTemplate("#= UserPhone #" +
                                        "<input type='hidden' name='gridItems[#= index(data) #].UserPhone' value='#= UserPhone #' />");
                               columns.Bound(item => item.UserEmail).Title("User Email").Encoded(true).ClientTemplate("#= UserEmail #" +
                                        "<input type='hidden' name='gridItems[#= index(data) #].UserEmail' value='#= UserEmail #' />");
 
                           })
                                    .Editable(editing => editing.Mode(GridEditMode.InCell))
                                    .Pageable(pager => pager.Refresh(true))
                                    .Navigatable
                                    .DataSource(datasource => datasource
                                        .Ajax()
                                                .Batch(true)
                                                .Read(read => read.Action("GetImportData", "Provisioning"))
                                                .PageSize(100)
                                                .Model(model => model.Id(p => p.BridgeId))
                                    )
                                   )
 
Below the grid there are standard Kendo DropDownList controls.
 
The form is defined as:
@using (Html.BeginForm("ProvisioningPost", "Provisioning", FormMethod.Post, new { enctype = "multipart/form-data" }))
 
The controller method is defined as:
[HttpPost]              
public ActionResult ProvisioningPost(string btnSubmit, string btnUploadData, ProvisioningImportModel provisioningImportModel, ProvisioningModel.ImportItem[] gridItems)
 
gridItems is always NULL for Chrome and Firefox.  With IE the data is passed in.  What is the best method to POST the entire form to the controller?  
 

I would like to see a full working project with the spreadsheet and MVC, like the many grid examples, however I could not find any in Github. 

Thanks

Hello guys

The main problem is that I need a grid with "popup/batch" editing, but as I know kendo doesn't have such a functionality right now.

So, here we are: "how to convert an asp editor template to a kendo template and then use it inside a popup grid window with all binds"?
If I understand the process correctly:
1) I create an empty model (for example: var customer = new Customer();)
2) I call this one: var wholeHtmlCode = @Html.EditorFor(x => customer)
3) *Magic transformation where I put 'wholeHtmlCode' into kendo template*.
4) When I click "add/edit" button on grid, I open my custom window with template and make "binds".

Thanks in advance

I have a scheduler code like below, but it is not working although it has rendered a drop-down list but no data inside. Any help?

<script id="popup_editor" type="text/x-kendo-template">
    <div class="k-edit-form-container">
        <div class="k-edit-label"><label for="Product">Product</label></div>
        <div id="example" class="k-edit-field" data-container-for="ProductID">
            <input data-role="dropdownlist" data-text-field="Name" data-value-field="Id" data-bind="source: arr" />
        </div>
    </div>
</script>

@(Html.Kendo().Scheduler<KendoUI.Northwind.Dashboard.Controllers.ScheduleTableViewModel>()
    .Name("scheduler")
    .Editable(editable => editable
        .EditRecurringMode(SchedulerEditRecurringMode.Dialog)
    .TemplateId("popup_editor")
    )
    .Selectable(false)
    .Views(views =>
    {
        views.DayView();
        views.WeekView();
        views.WorkWeekView(workWeekView => workWeekView.Selected(true));
        views.MonthView();
        views.AgendaView();
        views.TimelineView();
    })
    .DataSource(d => d
        .Model(m =>
        {
            m.Id(f => f.RecId);
            m.Field(f => f.Title).DefaultValue("No title");
            m.RecurrenceId(f => f.RecurrenceID);
        })
        .Read(read => read.Action("ScheduleTables_Read", "SchedulerMvc"))
        .Create(create => create.Action("ScheduleTables_Create", "SchedulerMvc"))
        .Update(update => update.Action("ScheduleTables_Update", "SchedulerMvc"))
        .Destroy(destroy => destroy.Action("ScheduleTables_Destroy", "SchedulerMvc"))
    )

<script>
    var arr = new kendo.data.ObservableArray([
    { Name: "John Doe", Id: 23 },
    { Name: "Jane Doe", Id: 34 }
    ]);

    var viewModel = kendo.observable({
        arr: arr //Temp solution, eventually will bind to a remote
    });

    kendo.bind($("#popup_editor"), viewModel);
</script>

Hi, May I know how to add additional Textbox field either in or numeric? I able to add a  list using the Resource, but it seems unable to add a textbox.

Thank you.

HI

I known textbox could be placed in HeaderTemplate.

Single TextBox as filter row in each column header
https://www.telerik.com/forums/single-textbox-as-filter-row-in-each-column-header
example
http://dojo.telerik.com/UbeFu

But Navigatable() method causes textbox not focused automatically on click.

How can I solve this kind of problem.

*input/type=checkbox works well but input/type=text not works : 

  .HeaderTemplate("<input type='text' />");

*Telerik DevCraft R2 2017 SP1.

Best regards

Chris

 

 

 

Hello,

I wish to be able to turn off the browser auto complete on the filter options (search and entering values).

Normally I would just add the following to the input but that doesn't appear to be working. We are using the MVC wrappers.

.attr('autocomplete', 'off');

Thank you

Lucy

Is there a server binding hierarchy web forms example floating around out there?

I see example projects: server-hierarchy and server-binding but am having trouble understanding how to use it in a web forms based MVC project.

 

In the view for server-binding example:

 

and in the view for server-hierarchy example project:

 

Can someone explain the difference for referencing the controller server data in the two example projects?

Hi,

I have implemented a popup window that display a text and I need to close the popup if the user clicks outside of the window. Searching in telerik forums I have found that there is way to do this using the method $telerik.isMouseOverElementEx. But this method is available only for Telerik ASP.NET Ajax.

Is there an equivalent for this method in the product Telerik ASP.NET MVC?

Hi,

I'm trying to format the filter control for an integer column to not use decimals, separators or spinners. I'm using Kendo.Mvc version 2017.1.118.545.

Using the answer from another question I've tried the following approach:

 

 

However as per attached screenshot, this doesn't work.

Please advise how to achieve this behaviour as according to the API guide (and other questions), this is correct.

 

Thanks,

Chris