c# - 使用 java-script 选择器遍历 Dictionary

Question

在我看来，我有一个字典，有 [inputID, tooltip]。

此外，我在此页面中有一组输入元素的 id。我需要用我的元素 id 遍历字典：

 @{
 Dictionary<string, string> questionMarks = 
     ViewBag.QuestionMarks as Dictionary<string, string>;
 @}

 <script type="java-script">
 $(document).ready(function () {
    var inputs = $('input,select[type!="hidden"]');
    $.each(inputs, function(i, val) {
    if ($(val).attr('id')) { 
                var id = $(val).attr('id');

                var iter_string = '@questionMarks' + "[" + id + "]";
                alert(iter_string);              // [1]
                alert('@questionMarks["cvc"]');  // here i got tooltip
             }
    });
</script>

[1] 我有 System.Collection.Generic.Dictionary`2[System.String, System.String][cvc]

感谢 Jan Jongboom， 最后我得到了我想要的：

@using System.Web.Script.Serialization
@{
    Dictionary<string, string> questionMarks = ViewBag.QuestionMarks as Dictionary<string, string>;
    JavaScriptSerializer jss = new JavaScriptSerializer();
@}
<script type="text/javascript">
    var questionMarks = @Html.Raw(jss.Serialize((Dictionary<string, string>)ViewBag.QuestionMarks));     
    $(document).ready(function () {
        for ( keyVar in questionMarks ) {
            $('#' + keyVar).attr('original-title', questionMarks[keyVar]);
            $('#' + keyVar).tipsy({ gravity: 'w' });
        }
    });
</script>

Answer 1

不，您不能通过服务器变量从客户端代码迭代。您可以从 JS 变量（如 JSON）生成初始化代码或在服务器端生成必要​​的 html。您也可以通过 ajax 请求从 jsavascript 请求此类数据。

Answer 2

做类似的事情

<script>
var questionMarks = @new JavaScriptSerializer().Serialize((Dictionary<string, string>)ViewBag.QuestionMarks) ;
</script>

现在您有一个名为的 javascript 变量questionMarks，您可以对其进行迭代。

Answer 3

在绘制输入时将数据属性附加到输入应该可以帮助您完成这一任务。

示例：http: //jsfiddle.net/Krch9/

$(document).ready(function(e) {
    var inputs = $("input", "#container");
    $.each(inputs, function(i, val) {
        var ToolTipText = $(this).data('tooltiptext');
        /// Run your tooltip plugin here ...
        $("#output").html($("#output").html() + "<br>" + $(this).attr('id') + " : " + ToolTipText);
    });
});

使用 MVC 助手，您可以轻松地添加它们：

@Html.TextBoxFor(x => x.Field, new { data_tooltiptext = "Blah blah"});

标记最终看起来像这样：

<input type="text" id="Field" data-tooltiptext="Blah blah">

编辑：额外帮助

IE 循环遍历你的元素

foreach( var question in questionMarks) {
   @Html.TextBox(question.Key, new { data_tooltiptext = question.Value} );
}

然后使用 javascript 示例（您需要根据需要对其进行修改...）在元素上运行插件

Answer 4

要删除引号，请使用 Html.Raw()

var questionMarks = '@Html.Raw(jss.Serialize((Dictionary<string, string>)ViewBag.QuestionMarks))';