Kendo DropDownList事件连线到Ajax.BeginForm提交

我有点麻烦了解如何将事件连接到ajax.begin表单。Kendo DropDownList事件连线到Ajax.BeginForm提交

我想完成的是这个，我有一个下拉列表，拉出一个经销商列表。

基于那个经销商，我想加载一个局部视图。我的模型有一个CurrentReseller字段，包含我需要的所有信息，但我不确定如何根据他们选择的内容来改变价值。

现在我知道我可以通过常规的jQuery来做到这一点，但我对JavaScript或JQuery知之甚少，无法知道如何做到这一点。

这里就是我有我的CSHTML页

@using (Ajax.BeginForm("RenderPartials", "Admin", new AjaxOptions { 
    UpdateTargetId = "SellerWebSettings", 
    HttpMethod = "POST", 
    InsertionMode = InsertionMode.Replace, 
    LoadingElementId = "AjaxLoading", 
    LoadingElementDuration = 500 
})) { 

    Html.Kendo().DropDownListFor(rs => rs.CurrentReseller) 
.Name("CurReseller") 
.DataTextField("Name") 
.DataValueField("Name") 
.Events(e => e.Change("OnCurResellerChanged"))//this is event that will ultimately render a new partial, i want this to trigger the "RenderPartials" ajax form. 
.DataSource(source => { 
    source.Read(read => { 
     read.Action("GetResellers", "Admin"); 
    }); 
}).OptionLabel("-- Select a Reseller --"); 

} 
<div id="SellerWebSettings"></div>

我如何告诉“更改事件”做了ajax表单提交与Ajax.BeginForm（）？

来源

2014-02-20 brentlyjdavid

.Events（E => e.Change（ “OnCurResellerChanged”））

在这种情况下简单地使表单提交像下面所示 -

说我有往复下拉列表的模型 -

public class DDLModel 
{ 
    public List<SelectListItem> Items { get; set; } 
    public string SelectedValue { get; set; } 
}

然后我填充模型，并将其发送下面的操作来查看 -

public ActionResult Index() 
    { 
     DDLModel model = new DDLModel(); 
     model.Items = new List<SelectListItem>(); 
     model.Items.Add(new SelectListItem() { Text = "1", Value = "1" }); 
     model.Items.Add(new SelectListItem() { Text = "2", Value = "2" }); 
     model.Items.Add(new SelectListItem() { Text = "3", Value = "3" }); 
     return View(model); 
    }

而我的视图包含一个AJAX表单。我们需要给出一个id的表格，如下所示。

@model MVC.Controllers.DDLModel 
@{ 
    ViewBag.Title = "Index"; 
} 

<h2>Index</h2> 
<script src="~/Scripts/jquery-1.10.2.min.js"></script> 
<script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script> 

<script> 
    function Call() { 
     $("#form1").submit(); 
    } 
</script> 

@using (Ajax.BeginForm("Submit", "Ajax", new AjaxOptions { UpdateTargetId = "SellerWebSettings" }, new { id = "form1" })) 
{ 
    @Html.DropDownListFor(m => m.SelectedValue, Model.Items, "DDL", new { @onchange = "Call()" }) 
}

所以，当您更改下拉列表值，形式将使用jQuery和相应的控制动作将与所选择的价值被击中提交。您可以在kendo dropdownlist的更改功能中执行以下操作。

输出 -

enter image description here

来源

2014-02-20 18:41:23 ramiramilu

谢谢，我不认为这是简单的。显示了我对JS和jQuery的了解程度......我猜想，有时候需要更多的Pluralsight视频。 :) – brentlyjdavid

Kendo DropDownList事件连线到Ajax.BeginForm提交

回答

相关问题