Question

我有一个MVC应用程序，我正在收集有KENDO控件的表单的详细信息，并且我可以使用AJAX更新几个下拉控件。

我目前面临的问题是，当我在下拉列表中提交带有更改值的表单时，其他控件不更新模型，并且它保持不变，即使表单显示更新的值，模型仍保留旧的价值观。

我尝试了各种各样的解决方案并且用Google搜索了但没有成功。我把我的代码放在下面，以显示我现在正在做的事情，那里的任何人都可以看一下并指导我，因为我做错了什么。

查看

@(Html.Kendo().DropDownList()
 .Name("ddlDateRange")
 .DataTextField("Name")
  .DataValueField("Id")
  .BindTo(Model.ReportIntervals)
  .Events(e => 
   {
      e.Change((@<text>
       function()
       {
          var selectedDateRange = $("#ddlDateRange").data("kendoDropDownList").value();
           $.ajax({
                   url: '@Url.Action("ChangeStartEndDates")',
                   type: 'POST',                                                                    
                   data: JSON.stringify({ selectedDateRange: selectedDateRange }),
                   contentType: "application/json; charset=utf-8",
                   dataType: "json",
                   async: true,
                   success: function (data) {   

                    $("#StartDate").data("kendoDatePicker").value(data.StartGamingDate);
                    $("#EndDate").data("kendoDatePicker").value(data.EndGamingDate);                                                                 
                                                        },
                   error: function () { alert('Error in DateRange dropdownlist'); }
                                                    });
                    }
                                            </text>));
                     })

）

@(Html.Kendo().DatePickerFor(model => model.StartGamingDate)
.Name("StartDate")
.Events(e =>
{
   e.Change((@<text>
   function()
   {
      var startDate = $("#StartDate").val();
      var endDate = $("#EndDate").val();
     $.ajax({
     url: '@Url.Action("ChangeDateRangeName")',
     type: 'POST',                                                                    
     data: JSON.stringify({ startDate: startDate, endDate: endDate }),
     contentType: "application/json; charset=utf-8",
     dataType: "json",
     async: true,
     success: function (data) {
          $("#ddlDateRange").data("kendoDropDownList").text(data.ReportInterval.Name);
      },
      error: function () { alert('Error in StartDate DatePicker'); }
      });
     }
     </text>));
     }))

   @(Html.Kendo().DatePickerFor(model => model.EndGamingDate)
   .Name("EndDate")
   .Events(e =>
   {
     e.Change((@<text>
     function()
     {
       var startDate = $("#StartDate").val();
       var endDate = $("#EndDate").val();
       $.ajax({
          url: '@Url.Action("ChangeDateRangeName")',
          type: 'POST',                                                                    
          data: JSON.stringify({ startDate: startDate, endDate: endDate }),
          contentType: "application/json; charset=utf-8",
          dataType: "json",
          async: true,
          success: function (data) {
            $("#ddlDateRange").data("kendoDropDownList").text(data.ReportInterval.Name);
          },
          error: function () { alert('Error in EndDate DatePicker'); }
          });
          }
          </text>));
      }))

CONTROLLER

**MODEL VALUES FORTHIS ACTION**

systemAuditReportViewModel.StartGamingDate = "01/01/2013";
systemAuditReportViewModel.EndGamingDate = "31/12/2013";
systemAuditReportViewModel.ReportInterval.Id = 30;
systemAuditReportViewModel.ReportInterval.Name = "Last Calender Year";

[HttpPost]        
    public JsonResult ChangeStartEndDates(int selectedDateRange)        
    {
        SystemAuditReport systemAuditReportViewModel = new SystemAuditReport();

        Nullable<DateTime> startGamingDate;
        Nullable<DateTime> endGamingDate;

        IG.General.Web.Model.ReportInterval reportInterval = new IG.General.Web.Model.ReportInterval();
        reportInterval.Id = selectedDateRange;

        IG.General.Web.Model.ReportIntervalFactory.GetDateRange(reportInterval, out startGamingDate, out endGamingDate);

        systemAuditReportViewModel.StartGamingDate = startGamingDate;
        systemAuditReportViewModel.EndGamingDate = endGamingDate;

        return Json(systemAuditReportViewModel, JsonRequestBehavior.AllowGet);
    }


**MODEL VALUES FOR THIS ACTION**

systemAuditReportViewModel.StartGamingDate = "27/03/2014";
systemAuditReportViewModel.EndGamingDate = "27/03/2014";
systemAuditReportViewModel.ReportInterval.Id = 2;
systemAuditReportViewModel.ReportInterval.Name = "Today";

[HttpPost]
    public ActionResult GenerateReport(SystemAuditReport systemAuditReportViewModel)
    {
        var errors = ModelState.Values.SelectMany(v => v.Errors);

        ReportContainer reportContainer = new ReportContainer();

        if (ModelState.IsValid)
        {               
            systemAuditReportViewModel.ReportPath = "/reports/";
            //systemAuditReportViewModel.StartGamingDate = startDate;
            //systemAuditReportViewModel.EndGamingDate = endDate;

            this.CreateReport(systemAuditReportViewModel, out reportContainer);
        }

        return View(reportContainer);
    }

Answer 1

我们也一直在努力解决这个问题。使用模板绑定有点棘手。您必须将DropDownList命名为与模型的绑定索引相同。

@model string

@(Html.Kendo().DropDownListFor(m => m)
  .BindTo("#=Model.EntityClassId")
  .DataTextField("Value")
  .DataValueField("Id")
  .Name("EntityClassId")
  .OptionLabel(MyApp.Resources.Text.DamageTypeOptionLabel)
  .AutoBind(true)
  .DataSource( source => source
     .Read( read=>read.Action("SomeMethod", "SomeController"))
     .ServerFiltering(true)
   )
   .Events(events => events
     .Select("onDamageTypeSelected")
     .Change("onDamageTypeChanged")
     .DataBound("onDamageTypeDatabound")
   )
   .HtmlAttributes(new{style="height:21px;vertical-align:center"})
)

提交表单AJAX Asp.Net MVC时，模型不会更新

）

1 个答案: