时间戳

首页 > 解决方案 > 如何在 asp.net 核心项目中添加“选择”

javascript - 如何在 asp.net 核心项目中添加“选择”

问题描述

我是代码的初学者。我创建了我的第一个 asp.net 核心应用程序，并尝试创建一个带有图标的选择列表。我想使用这个解决方案：https ://jsfiddle.net/maxmx/e0380p0o

这是我的 cshtml 文件：

<html>
<head id="Head1" runat="server">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js" type="text/javascript"></script>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" type="text/css" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.11.0/css/selectize.css" type="text/css" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.11.0/css/selectize.bootstrap3.css" type="text/css" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.11.0/js/standalone/selectize.js"></script>
    <script>
    $('.email-select').selectize({
        valueField: 'name',
        labelField: 'name',
        placeholder: 'Select somebody'
        , options: [{
            description: 'Nice Guy',
            name: 'Brian Reavis',
            imageUrl: '~/img/download.jpg'
        }, {
            description: 'Other nice guy',
            name: 'Nikola Tesla',
            imageUrl: '~/img/download.jpg'
        }],
        render: {
            option: function (item, escape) {
                return '<div class="option">' +
                    '<div class="image">' +
                    '<img class="avatar" src="' + item.imageUrl + '" />' +
                    '</div>' +
                    '<div class="text">' +
                    '<span class="name">' + escape(item.name) + '</span>' +
                    '<p class="description">' + escape(item.description) + '</p>' +
                    '</div>' +
                    '</div>';
            }
        }
    });
    </script>
</head>
<body>
<select class="email-select"></select>
</body>

这是显示的内容

标签： javascriptasp.netrazorselectlist

解决方案

推荐阅读