根据KendoUI Widget中的select事件更新div



我有一个KendoUI搜索栏,它有一个根据我键入的内容自动完成项目的下拉列表。当我输入时,我会得到一个下拉菜单。当我点击下拉列表中的项目时,我希望发生两件事。一种有效的方法,即加载局部视图。但是,另一件事涉及更新部分视图中的div元素。

局部视图

@{
ViewBag.Title = "Client";
}
<div id="update">@ViewBag.name</div>
<p id="ahhh"></p>

外部Javascript函数

function onSelect(e) {
$("#navResult").load('/Home/Client');
var value = e.item.text();
alert(value);
$.ajax({
type: "POST",
url: "Home/someStuf",
dataType: "json",
data: {n: value },
success: function (result) {
alert("IT WORKED");
},
error: function (result) {
alert("FAILED");
}
})
}

在HomeController中有一个名为someStuf的方法。我正在将事件上单击的项目发送到someStuf方法中。

下面是我正在使用的两种控制器方法。

Secretary s = new Secretary();
public ActionResult Client()
{
ViewBag.name = s.Client;
return PartialView();
}
[HttpPost]
public JsonResult someStuf(String n)
{
s.Client = n;
return Json(n, JsonRequestBehavior.AllowGet);
}

因此,我用javascript传递的值更新了一个类。然后,我将该新值添加到部分视图客户端的视图包中。

很抱歉存在误导性的变量。客户端是一种模型。然后我总是有一个局部视图,称为客户端。

当我尝试这个的时候。ViewBag没有显示我想要的结果。我可以让客户端发送到服务器。但我无法将服务器发送到客户端。。。。我打赌这很简单。但我正在努力理解这一步骤,以便使用相同的方法更新id和class元素。

<p class="CompanySearchBar">
@(Html.Kendo().AutoComplete()
.Name("companyComplete") //The name of the AutoComplete is mandatory. It specifies the "id" attribute of the widget.
.DataTextField("company") //Specify which property of the Product to be used by the AutoComplete.
.BindTo(Model)
.Filter("contains")
.Placeholder("Company name")
.Events(e => { e.Select("onSelect"); })
)
</p>

上面的代码允许一个带有自动完成功能的搜索栏。键入项目时,会显示一个下拉列表,其中包含具有相同子字符串的结果。单击其中一个结果时,onSelect方法将被激活。

您可以这样给出,在更改事件中只需使用jquery(如)分配一个值

function onSelect(e) {
$("#navResult").load('/Home/Client');
var value = e.item.text();
alert(value);
$.ajax({
type: "POST",
url: "Home/someStuf",
dataType: "json",
data: {n: value },
success: function (result) {
$('#ahhh').text(result.NAME); //the object which you returns from the controller
},
error: function (result) {
alert("FAILED");
}
})
}
<label id=ahhh></label>

最新更新