存储阵列，以每个选项中选择控制

我目前建立一个动态选择控制，如下所示，存储阵列，以每个选项中选择控制

targetSelectCtrl.empty().html(function() { 
    var appendData =''; 
    $.each(result, function (key, value) { 
     appendData += "<option title = '" + value.Name + 
        "' value='" + value.Id + 
        "' data-positions=" + value.PositionsList + 
        " data-isactive='" + value.IsActive + "'>" + 
        value.Name + "</option>"; 
    }); 
    return appendData; 
});

value.PositionsList是JavaScript阵列对象，并我要存储在每个选项。我试过上面的代码，它没有工作。

想法是，无论用户何时更改选项，我都需要获取PositionsList以显示在网页中。请指导我如何实现这一目标。

来源

2014-10-01 Vim

为什么之前没有建立HTML的' html（）调用？ 'var myHtml =/* gen html * /; targetSelectCtrl.empty（）。html（myHtml）;' – DLeh 2014-10-01 14:00:57

您不能只将数组连接到字符串。无论如何你必须从中创建一个字符串。 – DontVoteMeDown 2014-10-01 14:02:25

“结果”对象来自ajax响应。所以，我收到响应后动态地填充选择控件。目前，我在设置data-positions属性中的JavaScript对象时发现问题。 – Vim 2014-10-01 14:03:19

你应该尝试序列化数组作为JSON对象。例如：

var appendData =''; 

$.each(result, function (key, value) { 
    // Encode as JSON: 
    var serializedList = JSON.stringify(value.PositionsList); 

    // Escape single quotes: 
    serializedList = serializedList.replace(/'/g, "&#39;"); 

    appendData += "<option title = '" + value.Name+ 
         "' value='" + value.Id+ 
         "' data-positions='" + serializedList+ 
         "' data-isactive='" + value.IsActive+ "'>" + 
         value.Name+ "</option>"; 

});

来源

2014-10-01 14:03:05 michaelb

好的，现在就试试。 – Vim 2014-10-01 14:06:51

您的解决方案适用于我。谢谢。 – Vim 2014-10-01 15:01:00

你可以试试这个方法，无需编码/解码，您可以使用任何对象PositionsList：

JSFiddle

var targetSelectCtrl = $("select"); 
var result = [ 
    {Name:'name1',Id:'id',PositionsList:[1,2,3,4],IsActive:'.'}, 
    {Name:'name2',Id:'id',PositionsList:[1,2,3,4],IsActive:'.'} 
    ]; 
targetSelectCtrl.empty(); 

var option; 
$.each(result, function (key, value) { 
    option = $("<option/>").attr({ 
     title:value.Name, 
    }).html(value.Name).data({ 
     positions:value.PositionsList, 
     isactive:value.IsActive 
    }); 

    targetSelectCtrl.append(option); 

}); 

targetSelectCtrl.change(function(e) { 
    console.debug(" positons",$(e.target).find("option:selected").data('positions')); 
});;

来源

2014-10-01 14:07:17 jevgenig

谢谢您的建议和代码示例。 – Vim 2014-10-01 15:02:00

存储阵列，以每个选项中选择控制

回答

相关问题