Using FormMethod.Post to send grid data along with data from other controls.

6 posts, 0 answers
  1. Walter McGuire
    Walter McGuire avatar
    1 posts
    Member since:
    May 2006

    Posted 14 Mar 2013 Link to this post

    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?  
     
  2. Petur Subev
    Admin
    Petur Subev avatar
    1882 posts

    Posted 18 Mar 2013 Link to this post

    Hello Walter,

    I assume that you are using the approach from this code library. I tried the code library and it is sending the values with Chrome as expected.

    Could you please tell us if you have modified the project somehow? Do you experience the same issue with the project from the code library?

    Kind Regards,
    Petur Subev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Shahzad
    Shahzad avatar
    10 posts
    Member since:
    Jan 2014

    Posted 17 Jan 2014 Link to this post

    Kendo UI Complete ASP.NET  Verison :2013.3.1316 
    download the code library  from peter post
    add the datetime field in the model



    -----------------DateTime Filed PostBack value stays 01/01/0001 Issue-------------------


    This approach does not work any more with new kendo contorls library i do'nt know if its works for the previous verions.

    if you have datetime filed in your model

    Product
    {

            public string Name { get; set; }
            public int ProductID { get; set; }
            public datetime workDate { get; set; }      <--this will be 01/01/0001  on postback
    }

    when you do this your view

     columns.Bound(item => item.workDate ).Title("Wok Date").Encoded(true).ClientTemplate("#= WorkDate #" +
                                            "<input type='hidden' name='gridItems[#= index(data) #].WorkDate' value='#= WorkDate #' />");


      <input type="submit" value="Save" id="save"/>


    Fails on Postback
    ActionResult Save(Category category)
    {
     cartegory.prodcut[0].mydate =model.workDate;   <---- your mydate will be 01/01/0001 
     cartegory.prodcut[1].mydate =model.workDate;   <---- your mydate will be 01/01/0001 

    }

    please help any one.....
    regards
    Shahzad ilyas


  4. Shahzad
    Shahzad avatar
    10 posts
    Member since:
    Jan 2014

    Posted 19 Jan 2014 Link to this post

    finally figure out my own

    refrsh the grid before posting will make sure all the values are upto date.


    /refresh Grid before save           
                $("#save").click(function (e) {                
                    $("#WorkOrderDetails").data("kendoGrid").refresh();
                });


    Thanks telerik for your help
    Shahzad
  5. Craig
    Craig avatar
    4 posts
    Member since:
    Aug 2014

    Posted 18 Nov 2017 in reply to Shahzad Link to this post

    This does not work anymore.

     

    "refrsh the grid before posting will make sure all the values are upto date.


    /refresh Grid before save           
                $("#save").click(function (e) {                
                    $("#WorkOrderDetails").data("kendoGrid").refresh();
                });"

  6. Preslav
    Admin
    Preslav avatar
    574 posts

    Posted 21 Nov 2017 Link to this post

    Hi Craig,

    Could you please elaborate on your scenario? This will help us in investigating the issue and we might be able to eventually provide a workaround.

    I look forward to your reply.


    Regards,
    Preslav
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top