如何将模型数据绑定到 Telerik Controls？

问题描述

我正在使用波纹管代码将数据插入数据库。单击保存按钮时，数据应绑定到模型并需要发布到控制器操作。但是数据没有绑定到模型。波纹管代码中有什么问题。任何请帮助我解决以下问题。

@(Html.Kendo().TextBoxFor(model => model.Code)
    .HtmlAttributes(new { placeholder = "Enter Code",required = "required",validationmessage="Code is required" })
  )
  <input type="button" title="Save" id="btnsave" value="Save" onclick="submit()"/>
<script>
function submit(data) {
                debugger;
                console.log("Cosoledata "+JSON.stringify(data))
                $.ajax({
                    type: "POST",url: '@Url.Action("action","controller")',data: { data: @Model },dataType: "json",success: function (response) {
                    }
                });
            }
</script>

解决方法

data: { data: @Model },

在 JavaScript 脚本中，您可以通过 @Model 直接获取模型数据。

要将模型数据发送到控制器方法，您可以创建一个JavaScript对象，然后使用JQuery获取相关的属性值（例如Code），然后将该对象发送到控制器方法。

请参考以下示例：

查看页面：

@section Scripts {
    @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
    <script>
        $(function () {
            $("#btnCreate").click(function () { 
                var review = {}; //create a JavaScript Object.
                //user JQuery to get the entered value,and set the property value.
                review.ReviewID = $("#ReviewID").val();
                review.MovieID = $("#MovieID").val();
                review.goreRating = $("#goreRating").val();
                review.shockRating = $("#shockRating").val();
                review.jumpRating = $("#jumpRating").val();
                review.plotRating = $("#plotRating").val();
                review.supernaturalRating = $("#supernaturalRating").val();
                review.starRating = $("#starRating").val();
                //if you want to send multiple objects,you could create an array.
                //var reviewlist = [];
                //reviewlist.push(review);
                $.ajax({
                    url: "/Home/AddReview",method: "Post",data: { "reviewViewModel": review },// { "reviewViewModel": reviewlist },success: function (response) {
                        alert(response);
                    },error: function (response) {
                        console.log("error");
                    }
                })

            });
        })
    </script>
}

控制器方法：

[HttpPost]
public IActionResult AddReview(ReviewViewModel reviewViewModel)
{
    if (ModelState.IsValid)
    {
            //do something 
    }
    return View();
}

结果如下：