我有li标签,其中包含指向不同页面的链接。现在我想通过点击特定的li标签来创建一个searcj。我希望当用户点击名为“Field Workers”的li时,会出现一个包含数据库中所有现场工作人员姓名的子项。 Ajax代码用于显示现场工作人员。我在ajax cide中获取数据,但不知怎的,它没有显示出来。任何人都可以帮我这个吗?
Ajax代码:
<script>
var ajaxOptions = {
type: "POST", url: null, success: null, async: true,
data: "", dataType: "json", contentType: "application/json; charset=utf-8"
}
$(function () {
BindFW();
})
function BindFW() {
ajaxOptions.data = "";
ajaxOptions.url = "WebForm1.aspx/BindFieldWorkers"
ajaxOptions.success = function (result) {
if (result.d != null && result.d != "") {
//$("#templateFW").tmpl(result.d).appendTo("#ulFW");
$.each(result.d, function () {
$('#ulFW').append();
});
}
}
$.ajax(ajaxOptions);
}
</script>
<ul>
<li class="has-sub">
<a href="javascript:;">
<i class="icon-search"></i>
<span class="title">Field Worker Name</span>
<span class="arrow "></span>
</a>
<ul id="ulFW" class="sub">
</ul>
</li>
</ul>
答案 0 :(得分:0)
使用此脚本:
$(document).ready(function () {
BindFW(10);
});
function BindFW(StateId) {
var data = {
StateId: StateId
};
$.ajax({
type: 'POST',
url: './WebForm1.aspx/BindFieldWorkers',
contentType: 'application/json; charset=utf-8',
dataType: 'json',
data: JSON.stringify(data),
success: function (data) {
if (!data.d['Result']) {
alert('no records found!');
return;
}
var records = data.d['Records'];
for (var i = 0; i < records.length; i++) {
$('#ulFW').append(function () {
return $('<li>').text(records[i].Text).attr('data-id', records[i].ID)
});
}
},
error: function (data) {
alert('failed to connect to server!');
}
});
}
这在你的代码背后:
[System.Web.Services.WebMethod]
public static object BindFieldWorkers(int StateId)
{
try
{
List<object> result = new List<object>();
for (int i = 0; i < 10; i++)
{
result.Add(new
{
ID = i,
Text = "Text " + i
});
}
return new { Result = true, Records = result };
}
catch (Exception ex)
{
return new { Result = false, Message = ex.Message };
}
}