Can I pass model values to controller?

[karen anderson]

this is not model binding

View

    <div class="col-md-2">
        <button id="btnFilter"class="btn btn-primary btn-outline-rounded"
                style="color:#fff;"
                onclick="openFilterDialog()">
             Filter
        </button>
    </div>

 <form id="Form1" asp-area="Member" asp-controller="Trade" asp-action="Index" asp-route-model="@Model">
        <div class="control">
            <ej-dialog id="filterDialog" title="Filter Trades List"
                       enable-modal="true"
                       is-responsive="true" close="onDialogClose" show-on-init="false">
                <e-content-template>
                    <table>
                        <tr>
                            <td>
                                <p class="top">Please select your filters<p>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <input asp-for="@Model.Filter.ShowAll" /> Show All<br />
                                <span asp-validation-for="@Model.Filter.ShowAll" class="text-danger small"></span>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <input asp-for="@Model.Filter.Offers" /> Show Offers<br />
                                <span asp-validation-for="@Model.Filter.Offers" class="text-danger small"></span>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <input asp-for="@Model.Filter.Requests" /> Show Requests<br />
                                <span asp-validation-for="@Model.Filter.Requests" class="text-danger small"></span>
                            </td>
                        </tr>
                        <tr>
                            <td align="center">
                                <br />
                                <button id="btnSubmit" class="btn btn-primary btn-outline-rounded"
                                        style="color:#fff;"
                                        onclick="submitForm()">
                                    Filter
                                </button>
                            </td>
                        </tr>
                    </table>
                </e-content-template>
            </ej-dialog>
        </div>
    </form>

    @section Scripts {
        @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
        <script>
            function openFilterDialog() {
                $("#filterDialog").ejDialog("open");
            }          
            function submitForm() {
                document.getElementById("Form1").submit();
            }
        </script>

controller

 [HttpPost]
        public async Task<IActionResult> Index([FromForm][Bind] TradesViewModel model)
        {

            User _user = await _userManager.GetUserAsync(this.User);
            var _vm = new TradesViewModel();

            if (model != null)
            {
                _vm = model;              
            }

            await BuildTradesViewModelAsync(_user, _vm);

            return View("Index", _vm);
        }

[Selvamani Sankarappan]

Hi Karen, 

 

Thanks for contacting Syncfusion support. 

 

You can pass the model values to controller using AJAX post. Refer to the following code example: 

[cshtml] 

<form id="Form1" asp-area="filter" asp-controller="Home" asp-action="Index" asp-route-model="@Model"> 

    <div class="control"> 

        <ej-dialog id="filterDialog" title="Filter Trades List" 

                   enable-modal="true" 

                   is-responsive="true" close="onDialogClose" show-on-init="false"> 

            <e-content-template> 

                <table> 

                    <tr> 

                        <td> 

                            <p class="top">Please select your filters</p> 

                        </td> 

                    </tr> 

                    <tr> 

                        <td> 

                            <input asp-for="@Model.ShowAll" id="showall" name="showall" /> Show All<br /> 

                            <span asp-validation-for="@Model.ShowAll" class="text-danger small"></span> 

                        </td> 

                    </tr> 

                    <tr> 

                        <td> 

                            <input asp-for="@Model.Offers" id="offer" /> Show Offers<br /> 

                            <span asp-validation-for="@Model.Offers" class="text-danger small"></span> 

                        </td> 

                    </tr> 

                    <tr> 

                        <td> 

                            <input asp-for="@Model.Requests" id="request" /> Show Requests<br /> 

                            <span asp-validation-for="@Model.Requests" class="text-danger small"></span> 

                        </td> 

                    </tr> 

                    <tr> 

                        <td align="center"> 

                            <br /> 

                            <button id="btnSubmit" class="btn btn-primary btn-outline-rounded" 

                                    style="color:#fff;" 

                                    onclick="submitForm()"> 

                                Filter 

                            </button> 

                        </td> 

                    </tr> 

                </table> 

            </e-content-template> 

        </ej-dialog> 

    </div> 

</form> 

 

[script] 

function submitForm() { 

                document.getElementById("Form1").submit(); 

                var value = $("#showall").val(); 

                var value1 = $("#offer").val(); 

                var value2 = $("#request").val(); 

                $.ajax({ 

 

                    url: "Home/Filter", 

 

                    data: { showall: value, offer: value1, request: value2 }, 

 

                    type: 'POST', 

 

                    dataType: "json", 

 

                    success: function (result) {                        

 

                    } 

                }); 

 

            } 

 

[cs] 

public IActionResult Filter(string showall, string offer, string request) 

        { 

            return View(); 

        } 

 

Refer to the following sample: 

http://www.syncfusion.com/downloads/support/forum/131841/ze/web_sample_(3)382019214 

 

If the above does not meet your requirement, kindly get back to us with modified sample to provide an appropriate solution at the earliest. 

 

Regards, 

 

Selvamani S.