芝麻web文件管理V1.00

编辑当前文件:/home/krishnamexports/www/panel/global_assets/js/demo_pages/form_multiselect.js

/* ------------------------------------------------------------------------------

*  # Bootstrap multiselect

*  Demo JS code for form_multiselect.html page

* ---------------------------------------------------------------------------- */

// Setup module

// ------------------------------

var BootstrapMultiselect = function() {

// Setup module components

// Default file input style

var _componentMultiselect = function() {

if (!$().multiselect) {

console.warn('Warning - bootstrap-multiselect.js is not loaded.');

return;

}

// Basic examples

// ------------------------------

// Basic initialization

$('.multiselect').multiselect();

// Limit options number

$('.multiselect-number').multiselect({

numberDisplayed: 1

});

// Custom empty text

$('.multiselect-nonselected-text').multiselect({

nonSelectedText: 'Please choose'

});

// Select All option

$('.multiselect-select-all').multiselect({

includeSelectAllOption: true

});

// Enable filtering

$('.multiselect-filtering').multiselect({

enableFiltering: true,

enableCaseInsensitiveFiltering: true

});

// Select All and Filtering features

$('.multiselect-select-all-filtering').multiselect({

includeSelectAllOption: true,

enableFiltering: true,

enableCaseInsensitiveFiltering: true

});

// Linked button style

$('.multiselect-link').multiselect({

buttonClass: 'btn btn-link'

});

// Clickable optgroups

$('.multiselect-clickable-groups').multiselect({

enableClickableOptGroups: true

});

// Disable if empty

$('.multiselect-disable-empty').multiselect({

disableIfEmpty: true

});

// Menu background color

$('.multiselect-menu-bg-color').multiselect({

templates: {

ul: '<div class="multiselect-container bg-teal-400 dropdown-menu"></div>'

}

});

// Combined colors

$('.multiselect-combine-all').multiselect({

buttonClass: 'btn bg-slate',

templates: {

ul: '<div class="multiselect-container bg-slate dropdown-menu"></div>'

}

});

// Full featured example

$('.multiselect-full-featured').multiselect({

includeSelectAllOption: true,

enableFiltering: true

});

// With max height

$('.multiselect-max-height').multiselect({

maxHeight: 200

});

// Prevent deselect

var $preventDeselectElement = $('.multiselect-prevent-deselect');

$preventDeselectElement.multiselect({

onChange: function(option, checked) {

if (checked === false) {

$preventDeselectElement.multiselect('select', option.val());

}

});

// Remove active option class

$('.multiselect-no-active-class').multiselect({

selectedClass: null

});

// Events

// ------------------------------

// onChange

$('.multiselect-onchange-notice').multiselect({

onChange: function(element, checked){

new PNotify({

text: '<code>onChange</code> callback fired.',

addclass: 'bg-teal border-teal'

});

}

});

// onChange desktop

$('.multiselect-onchange-desktop').multiselect({

onChange:function(element, checked){

PNotify.desktop.permission();

(new PNotify({

title: 'Desktop Notice',

text: 'onChange callback desktop notification.',

desktop: {

desktop: true,

addclass: 'bg-blue',

icon: 'assets/images/pnotify/info.png'

}

})).get().on('click', function(e) {

if ($('.ui-pnotify-closer, .ui-pnotify-sticker, .ui-pnotify-closer *, .ui-pnotify-sticker *').is(e.target)) return;

alert('Hey! You clicked the desktop notification!');

});

}

});

// onShow

$('.multiselect-show-event').multiselect({

onDropdownShow: function() {

new PNotify({

text: '<code>onDropdownShow</code> event fired.',

addclass: 'bg-teal border-teal'

});

}

});

// onHide

$('.multiselect-hide-event').multiselect({

onDropdownHide: function() {

new PNotify({

text: '<code>onDropdownHide</code> event fired.',

addclass: 'bg-teal border-teal'

});

}

});

// Methods

// ------------------------------

// Create and destroy

// Initialize

$('.multiselect-method-destroy').multiselect();

// Destroy

$('.multiselect-destroy-button').on('click', function() {

$('.multiselect-method-destroy').multiselect('destroy');

});

// Create

$('.multiselect-create-button').on('click', function() {

$('.multiselect-method-destroy').multiselect();

});

// Refresh

// Initialize

$('.multiselect-method-refresh').multiselect();

// Select option

$('.multiselect-select-button').on('click', function() {

$('option[value="tomatoes"]', $('.multiselect-method-refresh')).attr('selected', 'selected');

$('option[value="tomatoes"]', $('.multiselect-method-refresh')).prop('selected', true);

$('option[value="mushrooms"]', $('.multiselect-method-refresh')).prop('selected', true);

$('option[value="mushrooms"]', $('.multiselect-method-refresh')).attr('selected', 'selected');

$('option[value="onions"]', $('.multiselect-method-refresh')).prop('selected', true);

$('option[value="onions"]', $('.multiselect-method-refresh')).attr('selected', 'selected');

alert('Selected Tomatoes, Mushrooms and Onions.');

});

// Deselect

$('.multiselect-deselect-button').on('click', function() {

$('option', $('.multiselect-method-refresh')).each(function(element) {

$(this).removeAttr('selected').prop('selected', false);

});

// Refresh

$('.multiselect-refresh-button').on('click', function() {

$('.multiselect-method-refresh').multiselect('refresh');

});

// Rebuild

// Initialize

$('.multiselect-method-rebuild').multiselect();

// Add option

$('.multiselect-add-button').on('click', function() {

$('.multiselect-method-rebuild').append('<option value="add1">Addition 1</option><option value="add2">Addition 2</option><option value="add3">Addition 3</option>');

});

// Remove option

$('.multiselect-delete-button').on('click', function() {

$('option[value="add1"]', $('.multiselect-method-rebuild')).remove();

$('option[value="add2"]', $('.multiselect-method-rebuild')).remove();

$('option[value="add3"]', $('.multiselect-method-rebuild')).remove();

});

// Rebuild menu

$('.multiselect-rebuild-button').on('click', function() {

$('.multiselect-method-rebuild').multiselect('rebuild');

});

// Select

// Initialize

$('.multiselect-method-select').multiselect();

// Select first option

$('.multiselect-select-cheese-button').on('click', function() {

$('.multiselect-method-select').multiselect('select', 'cheese');

});

// Select second option

$('.multiselect-select-onions-button').on('click', function() {

$('.multiselect-method-select').multiselect('select', 'onions');

});

// Deselect

// Initialize

$('.multiselect-method-deselect').multiselect();

// Deselect first option

$('.multiselect-deselect-cheese-button').on('click', function() {

$('.multiselect-method-deselect').multiselect('deselect', 'cheese');

});

// Deselect second option

$('.multiselect-deselect-onions-button').on('click', function() {

$('.multiselect-method-deselect').multiselect('deselect', 'onions');

});

// Disable

// Initialize

$('.multiselect-method-disable').multiselect();

// Enable

$('.multiselect-enable1-button').on('click', function() {

$('.multiselect-method-disable').multiselect('enable');

});

// Disable

$('.multiselect-disable1-button').on('click', function() {

$('.multiselect-method-disable').multiselect('disable');

});

// Enable

// Initialize

$('.multiselect-method-enable').multiselect();

// Enable

$('.multiselect-enable2-button').on('click', function() {

$('.multiselect-method-enable').multiselect('enable');

});

// Disable

$('.multiselect-disable2-button').on('click', function() {

$('.multiselect-method-enable').multiselect('disable');

});

// Advanced examples

// ------------------------------

// Simulate selections

$('.multiselect-simulate-selections').multiselect({

onChange: function(option, checked) {

var values = [];

$('.multiselect-simulate-selections option').each(function() {

if ($(this).val() !== option.val()) {

values.push($(this).val());

}

});

$('.multiselect-simulate-selections').multiselect('deselect', values);

}

});

// Close dropdown automaticallywhen options are selected

$('.multiselect-close-dropdown').multiselect({

onChange: function(option, checked) {

var selected = 0;

$('option', $('.multiselect-close-dropdown')).each(function() {

if ($(this).prop('selected')) {

selected++;

}

});

if (selected >= 3) {

$('.multiselect-close-dropdown').siblings('div').children('.dropdown-menu').dropdown('toggle');

}

});

// Templates

$('.multiselect-templates').multiselect({

templates: {

divider: '<div class="multiselect-item dropdown-divider border-danger"></div>'

}

});

// Display values

// Initialize

$('.multiselect-display-values').multiselect();

// Select options

$('.multiselect-display-values-select').on('click', function() {

$('.multiselect-display-values').multiselect('select', 'cheese');

$('.multiselect-display-values').multiselect('select', 'tomatoes');

$('.values-area').addClass('alert alert-info').text('Selected: ' + $('.multiselect-display-values').val().join(', '));

});

// Deselect options

$('.multiselect-display-values-deselect').on('click', function() {

$('.multiselect-display-values').multiselect('deselect', 'cheese');

$('.multiselect-display-values').multiselect('deselect', 'tomatoes');

$('.values-area').addClass('alert alert-info').text('Selected: ' + $('.multiselect-display-values').val() > 0 ? $('.multiselect-display-values').val().join(', ') : 'Nothing selected');

});

// Toggle selection

// Select all/Deselect all

function multiselect_selected($el) {

var ret = true;

$('option', $el).each(function(element) {

if (!!!$(this).prop('selected')) {

ret = false;

}

});

return ret;

}

function multiselect_selectAll($el) {

$('option', $el).each(function(element) {

$el.multiselect('select', $(this).val());

});

}

function multiselect_deselectAll($el) {

$('option', $el).each(function(element) {

$el.multiselect('deselect', $(this).val());

});

}

function multiselect_toggle($el, $btn) {

if (multiselect_selected($el)) {

multiselect_deselectAll($el);

$btn.text('Select All');

}

else {

multiselect_selectAll($el);

$btn.text('Deselect All');

}

// Initialize

$('.multiselect-toggle-selection').multiselect();

// Toggle selection on button click

$('.multiselect-toggle-selection-button').on('click', function(e) {

e.preventDefault();

multiselect_toggle($('.multiselect-toggle-selection'), $(this));

});

// Order options

var orderCount = 0;

// Initialize

$('.multiselect-order-options').multiselect({

buttonText: function(options) {

if (options.length == 0) {

return 'None selected';

}

else if (options.length > 3) {

return options.length + ' selected';

}

else {

var selected = [];

options.each(function() {

selected.push([$(this).text(), $(this).data('order')]);

});

selected.sort(function(a, b) {

return a[1] - b[1];

});

var text = '';

for (var i = 0; i < selected.length; i++) {

text += selected[i][0] + ', ';

}

return text.substr(0, text.length -2);

}

onChange: function(option, checked) {

if (checked) {

orderCount++;

$(option).data('order', orderCount);

}

else {

$(option).data('order', '');

}

});

// Order selected options on button click

$('.multiselect-order-options-button').on('click', function() {

var selected = [];

$('.multiselect-order-options option:selected').each(function() {

selected.push([$(this).val(), $(this).data('order')]);

});

selected.sort(function(a, b) {

return a[1] - b[1];

});

var text = '';

for (var i = 0; i < selected.length; i++) {

text += selected[i][0] + ', ';

}

text = text.substring(0, text.length - 2);

alert(text);

});

// Reset selections

// Initialize

$('.multiselect-reset').multiselect();

// Reset using reset button

$('#multiselect-reset-form').on('reset', function() {

$('.multiselect-reset option:selected').each(function() {

$(this).prop('selected', false);

})

$('.multiselect-reset').multiselect('refresh');

});

};

// Uniform

var _componentUniform = function(element) {

if (!$().uniform) {

console.warn('Warning - uniform.min.js is not loaded.');

return;

}

// Default initialization

$('.form-control-styled').uniform();

};

// Return objects assigned to module

return {

init: function() {

_componentMultiselect();

_componentUniform();

}

}();

// Initialize module

// ------------------------------

document.addEventListener('DOMContentLoaded', function() {

BootstrapMultiselect.init();

});