This is a migrated thread and some comments may be shown as answers.
Passing additional values along with Grid, Create or Update action
1 Answer 95 Views
This is a migrated thread and some comments may be shown as answers.
Jagbir
Top achievements
Rank 1
Jagbir asked on 04 Mar 2020, 05:46 AM

Hi,

I have two controls(datepicker and dropdown) outside of the Kendo Grid, I want to send the selected values of those two controls to the controller along with the Grid values on click of save changes of the Kendo Grid.

Could you please help me how to pass those values along with Create or Update Action of Kendo Grid, or If I can bind those values creating hidden columns in the grid, as these values would be required in all the rows while updating.

Below is my view : 

@{
    ViewBag.Title = Project.Web_v5.Framework.PageTitleHelper.GetPageTitle("PigPriceEdit", Request.Url.AbsolutePath);
    Layout = "~/Views/Shared/_Layout_v2.cshtml";
    var sess = new aplCustomerPortal.SessionManagement();
}
<style>

    #grid .k-grid-header, .k-grid-header .k-header {
        color: palevioletred;
        font-size: large;
    }

    #inputvaluesbox {
        height: 25px;
        width:70%;
        margin:0;
    }
    .k-edit-cell input {
        width: 100%;
    }
</style>
@section Scripts
{
    <script type="text/javascript">
        function error_handler(e) {
            if (e.errors) {
                var message = "Errors:\n";
                $.each(e.errors, function (key, value) {
                    if ('errors' in value) {
                        $.each(value.errors, function () {
                            message += this + "\n";
                        });
                    }
                });
                alert(message);
            }
        }

        function showEdit(e) {
            e.preventDefault();
            var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
            window.location.href = '@Url.Action("PigPriceEdit", "MarketingPigPrice")' + '?pModelId=' + dataItem.id + '&pContactId=@ViewBag.ContactId';
        }

        $(function () {
            kendo.culture("en-AU");
        });

          $("#bEdit").click(function () {
                window.location.href = '@Url.Action("PigPriceEdit", "MarketingPigPrice")'  + '&pContactId=@ViewBag.ContactId';
            });

       
    </script>
}

<div class="col-md-12">
    <form>

        <div class="form-group col-md-12">
            <br />
            <h3 class="panel-title">
                Form Type : Buyer
            </h3>
        </div>
        <div class="col-md-12">
            <div>
                <table>
                    <tr>
                        <td>
                            <h3>
                                Week End Date&nbsp;
                                @(Html.Kendo().DatePicker().Name("datepicker").Format("dd/MM/yyyy").DisableDates(DayOfWeek.Sunday, DayOfWeek.Monday, DayOfWeek.Tuesday, DayOfWeek.Wednesday, DayOfWeek.Thursday, DayOfWeek.Saturday).HtmlAttributes(new { required = "required", validationmessage = "Week End is required", style = "width:100%;", placeholder = "dd/MM/yyyy" })
                                <br />
                            </h3>
                        </td>
                        <td>
                            &nbsp;&nbsp;&nbsp;
                        </td>
                        <td>
                            <h3>
                                State
                                @Html.DropDownList("StateList", new SelectList(ViewBag.PigStateList, "Value", "Key"), "-- Select One --", new { @class = "form-control", required = "required", validationmessage = "State is required", placeholder = "State", tabindex = "3", @id = "state", style = "width:250%; height:35px;" })
                            </h3>
                            <p>


                            </p>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
        <div class="text-right btn-toolbar">
            <button id="bLoadPrevious" class="btn btn-sm btn-default" type="button">Fill Last Week’s Figures</button>&nbsp; &nbsp;
            <button id="bClearData" class="btn btn-sm btn-default" type="button">Clear Data</button>&nbsp; &nbsp;
        </div>
        <br />
        <br />
        <div class="form-group col-md-12">
            <div style="width:100%;overflow:auto;">
                @(Html.Kendo().Grid<Project.Core.EF.weekly_pigprice_data>
    ()
    .Name("grid")
    .Columns(columns =>
    {
        columns.Bound(p => p.pig_type).Title("Pig Type");
        columns.Bound(p => p.pig_weight).Title("Pig Weight").Width(140);
        columns.Bound(p => p.price_type).Title("Price Type").Width(140);
        columns.Bound(p => p.price).Title("Price(cent/kg)").Width(50);
        columns.Bound(p => p.number_traded).Title("Numbers").Width(50);

    })
    .ToolBar(toolbar =>
    {
        toolbar.Save();
    })
    .Editable(editable => editable.Mode(GridEditMode.InCell))
    .HtmlAttributes(new { style = "height:1250px;" })
    .DataSource(dataSource => dataSource
    .Ajax()
    .Batch(true)
    .Group(g => g.Add(p => p.pig_type))
    .PageSize(50)
    .ServerOperation(false)
    .Model(model =>
    {
        model.Id(p => p.id);
        model.Field(p => p.id).Editable(false);
        model.Field(p => p.week_end_date);
        model.Field(p => p.state);
        model.Field(p => p.pig_type).Editable(false);
        model.Field(p => p.pig_weight).Editable(false);
        model.Field(p => p.price_type).Editable(false);
        model.Field(p => p.price);
        model.Field(p => p.number_traded);

    })
    .Events(events => events.Error("error_handler"))
    .Create("Editing_Create", "MarketingPigPrice", new { id = ViewBag.ContactId })
    .Read(read => read.Action("PigPriceEdit_Read", "MarketingPigPrice", new { id = ViewBag.ContactId }))
    .Update("Editing_Update", "MarketingPigPrice")
    .Destroy("Editing_Destroy", "MarketingPigPrice")
    )
    )
    <br />
</div>
            <br />
        </div>

    </form>
</div>

1 Answer, 1 is accepted

Sort by
0
Viktor Tachev
Telerik team
answered on 05 Mar 2020, 02:40 PM

Hi Jagbir,

 

In order to send additional values to the Create or Update Grid actions it is recommended to specify a Data option for the respective action. Then a JavaScript function can be executed and will return the relevant information that will be passed to the Controller. The article below describes the approach. The example shows the Read action, however, the same approach is applicable for Create and Update.

https://docs.telerik.com/aspnet-mvc/html-helpers/data-management/grid/faq#how-can-i-send-values-to-my-action-method-when-binding-the-grid

 

 

Regards,
Viktor Tachev
Progress Telerik

Get quickly onboarded and successful with your Telerik UI for ASP.NET MVC with the dedicated Virtual Classroom technical training, available to all active customers.
Tags
Grid
Asked by
Jagbir
Top achievements
Rank 1
Answers by
Viktor Tachev
Telerik team
Share this question
or