更改下拉框为Dropdown样式,移除selectpicker

This commit is contained in:
Argo-Lenovo 2016-11-28 19:46:09 +08:00
parent b3d804aba1
commit a3b2129429
18 changed files with 114 additions and 2289 deletions

View File

@ -108,8 +108,6 @@
<Content Include="Content\css\admin.css" />
<Content Include="Content\css\blue.css" />
<Content Include="Content\css\bootstrap-datetimepicker.css" />
<Content Include="Content\css\bootstrap-select.css" />
<Content Include="Content\css\bootstrap-select.min.css" />
<Content Include="Content\css\fa.css" />
<Content Include="Content\css\fileinput.css" />
<Content Include="Content\css\fileinput.min.css" />
@ -144,12 +142,8 @@
<Content Include="Content\images\uploader\default.jpg" />
<Content Include="Content\images\uploader\readme.txt" />
<Content Include="Content\js\bootstrap-datetimepicker.js" />
<Content Include="Content\js\bootstrap-select.js" />
<Content Include="Content\js\bootstrap-select.min.js" />
<Content Include="Content\js\bootstrap3-typeahead.js" />
<Content Include="Content\js\bootstrap3-typeahead.min.js" />
<Content Include="Content\js\defaults-zh_CN.js" />
<Content Include="Content\js\defaults-zh_CN.min.js" />
<Content Include="Content\js\fileinput.js" />
<Content Include="Content\js\fileinput.min.js" />
<Content Include="Content\js\jquery.nestable.js" />
@ -225,8 +219,6 @@
<Content Include="Content\fonts\fontawesome-webfont.woff2" />
<Content Include="Content\fonts\FontAwesome.otf" />
<Content Include="Content\css\fa.responsive.css" />
<Content Include="Content\css\bootstrap-select.css.map" />
<Content Include="Content\js\bootstrap-select.js.map" />
<Content Include="packages.config" />
<None Include="Scripts\_references.js" />
<Content Include="Content\js\framework.js" />

View File

@ -492,3 +492,18 @@ input[type="datetime"] {
.mail-box .lg-side .table-inbox tr td:hover {
cursor: pointer;
}
.btn-select {
}
.btn-select .dropdown-menu {
padding: 0;
}
.btn-select .dropdown-menu li a {
padding: 6px 20px;
}
.btn-select .dropdown-menu .divider {
margin: 0;
}

View File

@ -1,293 +0,0 @@
/*!
* Bootstrap-select v1.11.2 (http://silviomoreto.github.io/bootstrap-select)
*
* Copyright 2013-2016 bootstrap-select
* Licensed under MIT (https://github.com/silviomoreto/bootstrap-select/blob/master/LICENSE)
*/
select.bs-select-hidden,
select.selectpicker {
display: none !important;
}
.bootstrap-select {
width: 220px \0;
/*IE9 and below*/
}
.bootstrap-select > .dropdown-toggle {
width: 100%;
padding-right: 25px;
z-index: 1;
}
.bootstrap-select > .dropdown-toggle.bs-placeholder,
.bootstrap-select > .dropdown-toggle.bs-placeholder:hover,
.bootstrap-select > .dropdown-toggle.bs-placeholder:focus,
.bootstrap-select > .dropdown-toggle.bs-placeholder:active {
color: #999;
}
.bootstrap-select > select {
position: absolute !important;
bottom: 0;
left: 50%;
display: block !important;
width: 0.5px !important;
height: 100% !important;
padding: 0 !important;
opacity: 0 !important;
border: none;
}
.bootstrap-select > select.mobile-device {
top: 0;
left: 0;
display: block !important;
width: 100% !important;
z-index: 2;
}
.has-error .bootstrap-select .dropdown-toggle,
.error .bootstrap-select .dropdown-toggle {
border-color: #b94a48;
}
.bootstrap-select.fit-width {
width: auto !important;
}
.bootstrap-select:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) {
width: 220px;
}
.bootstrap-select .dropdown-toggle:focus {
outline: thin dotted #333333 !important;
outline: 5px auto -webkit-focus-ring-color !important;
outline-offset: -2px;
}
.bootstrap-select.form-control {
margin-bottom: 0;
padding: 0;
border: none;
}
.bootstrap-select.form-control:not([class*="col-"]) {
width: 100%;
}
.bootstrap-select.form-control.input-group-btn {
z-index: auto;
}
.bootstrap-select.form-control.input-group-btn:not(:first-child):not(:last-child) > .btn {
border-radius: 0;
}
.bootstrap-select.btn-group:not(.input-group-btn),
.bootstrap-select.btn-group[class*="col-"] {
float: none;
display: inline-block;
margin-left: 0;
}
.bootstrap-select.btn-group.dropdown-menu-right,
.bootstrap-select.btn-group[class*="col-"].dropdown-menu-right,
.row .bootstrap-select.btn-group[class*="col-"].dropdown-menu-right {
float: right;
}
.form-inline .bootstrap-select.btn-group,
.form-horizontal .bootstrap-select.btn-group,
.form-group .bootstrap-select.btn-group {
margin-bottom: 0;
}
.form-group-lg .bootstrap-select.btn-group.form-control,
.form-group-sm .bootstrap-select.btn-group.form-control {
padding: 0;
}
.form-inline .bootstrap-select.btn-group .form-control {
width: 100%;
}
.bootstrap-select.btn-group.disabled,
.bootstrap-select.btn-group > .disabled {
cursor: not-allowed;
}
.bootstrap-select.btn-group.disabled:focus,
.bootstrap-select.btn-group > .disabled:focus {
outline: none !important;
}
.bootstrap-select.btn-group.bs-container {
position: absolute;
height: 0 !important;
padding: 0 !important;
}
.bootstrap-select.btn-group.bs-container .dropdown-menu {
z-index: 1060;
}
.bootstrap-select.btn-group .dropdown-toggle .filter-option {
display: inline-block;
overflow: hidden;
width: 100%;
text-align: left;
}
.bootstrap-select.btn-group .dropdown-toggle .caret {
position: absolute;
top: 50%;
right: 12px;
margin-top: -2px;
vertical-align: middle;
}
.bootstrap-select.btn-group[class*="col-"] .dropdown-toggle {
width: 100%;
}
.bootstrap-select.btn-group .dropdown-menu {
min-width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.bootstrap-select.btn-group .dropdown-menu.inner {
position: static;
float: none;
border: 0;
padding: 0;
margin: 0;
border-radius: 0;
-webkit-box-shadow: none;
box-shadow: none;
}
.bootstrap-select.btn-group .dropdown-menu li {
position: relative;
}
.bootstrap-select.btn-group .dropdown-menu li.active small {
color: #fff;
}
.bootstrap-select.btn-group .dropdown-menu li.disabled a {
cursor: not-allowed;
}
.bootstrap-select.btn-group .dropdown-menu li a {
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.bootstrap-select.btn-group .dropdown-menu li a.opt {
position: relative;
padding-left: 2.25em;
}
.bootstrap-select.btn-group .dropdown-menu li a span.check-mark {
display: none;
}
.bootstrap-select.btn-group .dropdown-menu li a span.text {
display: inline-block;
}
.bootstrap-select.btn-group .dropdown-menu li small {
padding-left: 0.5em;
}
.bootstrap-select.btn-group .dropdown-menu .notify {
position: absolute;
bottom: 5px;
width: 96%;
margin: 0 2%;
min-height: 26px;
padding: 3px 5px;
background: #f5f5f5;
border: 1px solid #e3e3e3;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
pointer-events: none;
opacity: 0.9;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.bootstrap-select.btn-group .no-results {
padding: 3px;
background: #f5f5f5;
margin: 0 5px;
white-space: nowrap;
}
.bootstrap-select.btn-group.fit-width .dropdown-toggle .filter-option {
position: static;
}
.bootstrap-select.btn-group.fit-width .dropdown-toggle .caret {
position: static;
top: auto;
margin-top: -1px;
}
.bootstrap-select.btn-group.show-tick .dropdown-menu li.selected a span.check-mark {
position: absolute;
display: inline-block;
right: 15px;
margin-top: 5px;
}
.bootstrap-select.btn-group.show-tick .dropdown-menu li a span.text {
margin-right: 34px;
}
.bootstrap-select.show-menu-arrow.open > .dropdown-toggle {
z-index: 1061;
}
.bootstrap-select.show-menu-arrow .dropdown-toggle:before {
content: '';
border-left: 7px solid transparent;
border-right: 7px solid transparent;
border-bottom: 7px solid rgba(204, 204, 204, 0.2);
position: absolute;
bottom: -4px;
left: 9px;
display: none;
}
.bootstrap-select.show-menu-arrow .dropdown-toggle:after {
content: '';
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-bottom: 6px solid white;
position: absolute;
bottom: -4px;
left: 10px;
display: none;
}
.bootstrap-select.show-menu-arrow.dropup .dropdown-toggle:before {
bottom: auto;
top: -3px;
border-top: 7px solid rgba(204, 204, 204, 0.2);
border-bottom: 0;
}
.bootstrap-select.show-menu-arrow.dropup .dropdown-toggle:after {
bottom: auto;
top: -3px;
border-top: 6px solid white;
border-bottom: 0;
}
.bootstrap-select.show-menu-arrow.pull-right .dropdown-toggle:before {
right: 12px;
left: auto;
}
.bootstrap-select.show-menu-arrow.pull-right .dropdown-toggle:after {
right: 13px;
left: auto;
}
.bootstrap-select.show-menu-arrow.open > .dropdown-toggle:before,
.bootstrap-select.show-menu-arrow.open > .dropdown-toggle:after {
display: block;
}
.bs-searchbox,
.bs-actionsbox,
.bs-donebutton {
padding: 4px 8px;
}
.bs-actionsbox {
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.bs-actionsbox .btn-group button {
width: 50%;
}
.bs-donebutton {
float: left;
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.bs-donebutton .btn-group button {
width: 100%;
}
.bs-searchbox + .bs-actionsbox {
padding: 0 8px 4px;
}
.bs-searchbox .form-control {
margin-bottom: 0;
width: 100%;
float: none;
}
/*# sourceMappingURL=bootstrap-select.css.map */

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -205,6 +205,30 @@
var ctl = $('#' + $(this).attr('id').replace('tb_', 'btn_'));
ctl.trigger("click");
});
},
select: function () {
var $this = $(this);
$this.each(function (index, element) {
var $element = $(element);
var $select = $element.find('button').first();
var $options = $element.find('.dropdown-menu > li > a');
$select.addClass('select').data('options', $options);
$options.on('click', function () {
var $op = $(this);
$select.text($op.text()).attr('data-val', $op.attr('data-val'));
});
});
},
selectval: function (value) {
var $this = $(this);
if (value == undefined) return $this.attr('data-val');
$this.data('options').each(function (index, element) {
var $op = $(element);
var val = $op.attr('data-val');
if (value == val) {
$this.text($op.text()).attr('data-val', val);
}
});
}
});
})(jQuery);

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1,35 +0,0 @@
/*!
* Bootstrap-select v1.11.2 (http://silviomoreto.github.io/bootstrap-select)
*
* Copyright 2013-2016 bootstrap-select
* Licensed under MIT (https://github.com/silviomoreto/bootstrap-select/blob/master/LICENSE)
*/
(function (root, factory) {
if (typeof define === 'function' && define.amd) {
// AMD. Register as an anonymous module unless amdModuleId is set
define(["jquery"], function (a0) {
return (factory(a0));
});
} else if (typeof exports === 'object') {
// Node. Does not work with strict CommonJS, but
// only CommonJS-like environments that support module.exports,
// like Node.
module.exports = factory(require("jquery"));
} else {
factory(jQuery);
}
}(this, function (jQuery) {
(function ($) {
$.fn.selectpicker.defaults = {
noneSelectedText: '没有选中任何项',
noneResultsText: '没有找到匹配项',
countSelectedText: '选中{1}中的{0}项',
maxOptionsText: ['超出限制 (最多选择{n}项)', '组选择超出限制(最多选择{n}组)'],
multipleSeparator: ', '
};
})(jQuery);
}));

View File

@ -1,7 +0,0 @@
/*!
* Bootstrap-select v1.11.2 (http://silviomoreto.github.io/bootstrap-select)
*
* Copyright 2013-2016 bootstrap-select
* Licensed under MIT (https://github.com/silviomoreto/bootstrap-select/blob/master/LICENSE)
*/
!function(a,b){"function"==typeof define&&define.amd?define(["jquery"],function(a){return b(a)}):"object"==typeof exports?module.exports=b(require("jquery")):b(jQuery)}(this,function(a){!function(a){a.fn.selectpicker.defaults={noneSelectedText:"没有选中任何项",noneResultsText:"没有找到匹配项",countSelectedText:"选中{1}中的{0}项",maxOptionsText:["超出限制 (最多选择{n}项)","组选择超出限制(最多选择{n}组)"],multipleSeparator:", "}}(a)});

View File

@ -11,7 +11,7 @@
load: function (value) {
for (name in this.options.map) {
var ctl = $("#" + this.options.map[name]);
if (ctl.hasClass('selectpicker')) ctl.selectpicker('val', value[name]);
if (ctl.hasClass('select')) ctl.selectval(value[name]);
else ctl.val(value[name]);
}
},
@ -20,7 +20,7 @@
var ctl = $("#" + this.options.map[name]);
var dv = ctl.attr("data-default-val");
if (dv === undefined) dv = "";
if (ctl.hasClass('selectpicker')) ctl.selectpicker('val', dv);
if (ctl.hasClass('select')) ctl.selectval(dv);
else ctl.val(dv);
}
},
@ -28,9 +28,8 @@
var target = {};
for (name in this.options.map) {
var ctl = $("#" + this.options.map[name]);
if (ctl.hasClass('selectpicker')) {
target[name] = ctl.selectpicker('val');
target[name + 'Name'] = ctl.parentsUntil('bootstrap-select').children('button[data-id="' + this.options.map[name] + '"]').attr('title');
if (ctl.hasClass('select')) {
target[name] = ctl.selectval();
}
else {
var dv = ctl.attr('data-default-val');

View File

@ -16,7 +16,7 @@
$('table').smartTable({
url: Dicts.url,
sortName: 'Category',
queryParams: function (params) { return $.extend(params, { category: $('#txt_dict_cate').val(), name: $("#txt_dict_name").val(), define: $("#txt_dict_define").val() }); },
queryParams: function (params) { return $.extend(params, { category: $('#txt_dict_cate').val(), name: $("#txt_dict_name").val(), define: $("#txt_dict_define").selectval() }); },
columns: [{ checkbox: true },
{ title: "Id", field: "ID", events: bsa.idEvents(), formatter: BootstrapAdmin.idFormatter },
{ title: "字典分项", field: "Category", sortable: true },
@ -46,7 +46,7 @@
}
});
// select
$('select').selectpicker();
$('.btn-select').select();
// autocomplete
$.bc({

View File

@ -15,6 +15,7 @@
var $nestMenuInput = $nestMenu.find('div.dd3-content');
var $parentMenuID = $('#parentId');
var $parentMenuName = $('#parentName');
var $category = $('#category');
$nestMenuInput.find('label:first').hide();
var bsa = new BootstrapAdmin({
@ -101,7 +102,7 @@
$('table').smartTable({
url: Menu.url, //请求后台的URL*
sortName: 'Order',
queryParams: function (params) { return $.extend(params, { parentName: $('#txt_parent_menus_name').val(), name: $("#txt_menus_name").val(), category: $('#sel_menus_category').val() }); }, //传递参数(*
queryParams: function (params) { return $.extend(params, { parentName: $('#txt_parent_menus_name').val(), name: $("#txt_menus_name").val(), category: $('#sel_menus_category').selectval() }); }, //传递参数(*
columns: [{ checkbox: true },
{ title: "Id", field: "ID", events: bsa.idEvents(), formatter: BootstrapAdmin.idFormatter },
{ title: "父级菜单", field: "ParentName", sortable: true },
@ -180,13 +181,13 @@
$btnSubmitMenu.data('type', 'order');
$nestMenuInput.find('label:last').find('input').hide();
$nestMenu.find('li.dd-item').hide().remove('[data-id="0"]');
$nestMenu.find('li[data-category="' + $('#category').selectpicker('val') + '"]').show();
$nestMenu.find('li[data-category="' + $category.selectval() + '"]').show();
// handler new menu
var did = $('#menuID').val();
if (did == "") did = 0;
if (did == 0) {
var menuName = $('#name').val();
var menuCate = $('select').selectpicker('val');
var menuCate = $category.selectval();
if (menuName == "") menuName = "新建菜单-未命名";
$nestMenu.find('ol.dd-list:first').append($.format('<li class="dd-item dd3-item" data-id="0" data-category="{1}"><div class="dd-handle dd3-handle"></div><div class="dd3-content"><label><span>{0}</span></label></div></li>', menuName, menuCate));
}
@ -200,7 +201,7 @@
$btnSubmitMenu.data('type', 'parent');
$nestMenuInput.find('label:last').find('input').show();
$nestMenu.find('li.dd-item').hide().remove('[data-id="0"]');
$nestMenu.find('li[data-category="' + $('#category').selectpicker('val') + '"]').show();
$nestMenu.find('li[data-category="' + $category.selectval() + '"]').show();
$dialogMenu.show().adjustDialog();
});
@ -245,5 +246,5 @@
});
$nestMenu.nestable();
// select
$('select').selectpicker();
$('.btn-select').select();
});

View File

@ -26,11 +26,19 @@
</div>
<div class="form-group col-lg-3">
<label class="control-label" for="txt_dict_define">字典类别</label>
<select class="selectpicker form-control" data-width="auto" id="txt_dict_define">
<option value="">全部</option>
<option value="0">系统使用</option>
<option value="1">自定义</option>
</select>
<div class="btn-group btn-select">
<button id="txt_dict_define" type="button" class="btn btn-success" data-val="">全部</button>
<button type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown">
<span class="caret"></span>
<span class="sr-only">下拉菜单</span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#" data-val="">全部</a></li>
<li class="divider"></li>
<li><a href="#" data-val="0">系统使用</a></li>
<li><a href="#" data-val="1">自定义</a></li>
</ul>
</div>
</div>
<div class="form-group col-lg-2">
<button type="button" id="btn_query" class="btn btn-primary form-control"><span class="glyphicon glyphicon-search" aria-hidden="true"></span>查询</button>
@ -69,10 +77,17 @@
</div>
<div class="form-group col-lg-6">
<label class="control-label" for="dictDefine">字典类别</label>
<select class="selectpicker form-control" data-width="auto" id="dictDefine" data-default-val="1">
<option value="0">系统使用</option>
<option value="1">自定义</option>
</select>
<div class="btn-group dropup btn-select">
<button id="dictDefine" type="button" class="btn btn-success" data-default-val="1" data-val="">全部</button>
<button type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown">
<span class="caret"></span>
<span class="sr-only">下拉菜单</span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#" data-val="0">系统使用</a></li>
<li><a href="#" data-val="1">自定义</a></li>
</ul>
</div>
</div>
</div>
</form>

View File

@ -31,11 +31,19 @@
</div>
<div class="form-group col-xs-12 col-sm-6 col-md-3 col-lg-3">
<label class="control-label" for="sel_menus_category">菜单类别</label>
<select class="form-control selectpicker" data-width="auto" id="sel_menus_category">
<option value="">全部</option>
<option value="0">系统菜单</option>
<option value="1">外部菜单</option>
</select>
<div class="btn-group btn-select">
<button id="sel_menus_category" type="button" class="btn btn-success" data-val="">全部</button>
<button type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown">
<span class="caret"></span>
<span class="sr-only">下拉菜单</span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#" data-val="">全部</a></li>
<li class="divider"></li>
<li><a href="#" data-val="0">系统菜单</a></li>
<li><a href="#" data-val="1">外部菜单</a></li>
</ul>
</div>
</div>
<div class="form-group col-xs-12 col-sm-6 col-md-2 col-lg-2">
<button type="button" id="btn_query" class="btn btn-primary form-control"><span class="glyphicon glyphicon-search" aria-hidden="true"></span>查询</button>
@ -104,21 +112,35 @@
<label class="control-label" for="url">路径</label>
<input type="text" class="form-control form-control-url" id="url" name="url" placeholder="不可为空" />
</div>
<div class="form-group col-xs-12">
<div class="form-group col-sm-6 col-xs-12">
<label class="control-label" for="category">菜单类别</label>
<select class="selectpicker" data-style="btn-danger" data-width="auto" id="category" data-default-val="1">
<option value="0">系统菜单</option>
<option value="1">外部菜单</option>
</select>
<div class="btn-group dropup btn-select">
<button id="category" type="button" class="btn btn-success" data-default-val="1" data-val="1">外部菜单</button>
<button type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown">
<span class="caret"></span>
<span class="sr-only">下拉菜单</span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#" data-val="0">系统菜单</a></li>
<li><a href="#" data-val="1">外部菜单</a></li>
</ul>
</div>
<div class="form-group col-xs-12">
</div>
<div class="form-group col-sm-6 col-xs-12">
<label class="control-label" for="target">目标</label>
<select class="form-control-select selectpicker" data-style="btn-info" data-width="auto" id="target" data-default-val="_self">
<option value="_self">本窗口</option>
<option value="_blank">新窗口</option>
<option value="_parent">父级窗口</option>
<option value="_top">顶级窗口</option>
</select>
<div class="btn-group dropup btn-select">
<button id="target" type="button" class="btn btn-info" data-default-val="_self" data-val="_self">本窗口</button>
<button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown">
<span class="caret"></span>
<span class="sr-only">下拉菜单</span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#" data-val="_self">本窗口</a></li>
<li><a href="#" data-val="_blank">新窗口</a></li>
<li><a href="#" data-val="_parent">父级窗口</a></li>
<li><a href="#" data-val="_top">顶级窗口</a></li>
</ul>
</div>
</div>
</div>
</form>

View File

@ -4,7 +4,6 @@
@section css {
<link href="~/Content/css/bootstrap-table.css" rel="stylesheet" />
<link href="~/Content/css/sweetalert.css" rel="stylesheet" />
<link href="~/Content/css/bootstrap-select.css" rel="stylesheet" />
@RenderSection("css", false)
}
@section header {
@ -20,8 +19,6 @@
<script src="~/content/js/bootstrap-table-zh-CN.js"></script>
<script src="~/content/js/jquery.validate.js"></script>
<script src="~/content/js/messages_zh.js"></script>
<script src="~/Content/js/bootstrap-select.js"></script>
<script src="~/Content/js/defaults-zh_CN.js"></script>
@RenderSection("Javascript", false)
}
@section modal {