来自cshtml中SQL Server查询的jquery UI自动完成列表
Posted
技术标签:
【中文标题】来自cshtml中SQL Server查询的jquery UI自动完成列表【英文标题】:jquery UI autocomplete list from SQL Server query in cshtml 【发布时间】:2016-12-14 11:17:13 【问题描述】:我正在关注这个 jquery ui 自动完成模板 (https://jqueryui.com/autocomplete/#default),但试图从 SQL Server 数据库查询中提取我的数据以进行自动完成。
看起来当我使用我的 javascript 时,我需要我的 availableTags javascript 数组具有基于什么的 ["abc", "def", "ghi",..."] 形式在jquery ui demo源码中。
var availableTags = [
"ActionScript",
"AppleScript",
"Asp",
"BASIC",
"..."];
我的代码目前给我一个这样的列表:abc, def, ghi,...。实际上,当我将它传递给 javascript 变量时,我什至不确定它是否显示为 abc, def, ghi,... 或 [abc, def, ghi...]。
这是我从数据库中获取列表的代码
@
List<string> availableTags = new List<string>();
foreach (var item in db.Query("SELECT Tag FROM my_tags_table"))
var Tag = item.Tag ;
availableTags.Add(Tag);
string tagString = (string.Join(", ", availableTags.Select(x => x.ToString()).ToArray()));
调试显示 tagString 被创建为列表 abc、def、ghi ......但正如我提到的,我需要在其中添加双引号。这是我将 tagString 传递给 javascript 数组/变量的方法。
<script>
$(function ()
var availableTags = '<%=tagString%>';
$("#tags").autocomplete(
source: availableTags
);
);
</script>
然后这是我的输入框。
<div class="ui-widget">
<input id="tags">
</div>
有人可以帮我 1) 添加双引号和 2) 执行可用标签所需的任何其他操作以显示为正确的 javascript 数组吗?
【问题讨论】:
【参考方案1】:jQuery ui 自动完成需要源属性值作为一个数组。 string.Join
方法将返回一个用逗号分隔的字符串值,例如
Item1, Item2, Item3
.
你需要的是一个数组。
@
List<string> availableTags = new List<string>();
foreach (var item in db.Query("SELECT Tag FROM my_tags_table"))
var Tag = item.Tag ;
availableTags.Add(Tag);
在同一视图的脚本部分中,您可以将此 c# 变量(availableTags 列表)转换为 javascript 数组并使用它。
$(function ()
var availableTags = @html.Raw(Newtonsoft.Json.JsonConvert
.SerializeObject(availableTags.ToArray()));
$("#tags").autocomplete( source: availableTags );
);
【讨论】:
太棒了,代码更少,无需尝试显式构建看起来像带有双引号、方括号和逗号的数组的东西。以上是关于来自cshtml中SQL Server查询的jquery UI自动完成列表的主要内容,如果未能解决你的问题,请参考以下文章
SQL Server:根据来自其他 2 个表的子查询从表中选择
格式化来自 SQL Server 2008 的 HTML 电子邮件中的查询数据