<div class="card card-custom">
<div class="card-header">
<h3 class="card-title">
بوت استرپ جداکننده چندگانه
</h3>
</div>
<!--begin::Form-->
<form class="form">
<div class="card-body">
<div class="form-group row">
<label class="col-form-label text-right col-lg-3 col-sm-12">استاندارد گروه انتخاب</label>
<div class="col-lg-4 col-md-9 col-sm-12">
<select class="form-control">
<optgroup label="دسته بندی 1">
<option value="1">انتخاب 1</option>
<option value="2">انتخاب 2</option>
<option value="3">انتخاب 3</option>
<option value="4">انتخاب 4</option>
</optgroup>
<optgroup label="دسته بندی 2">
<option value="5">انتخاب 5</option>
<option value="6">انتخاب 6</option>
<option value="7">انتخاب 7</option>
<option value="8">انتخاب 8</option>
</optgroup>
<optgroup label="دسته بندی 3">
<option value="5">انتخاب 9</option>
<option value="6">انتخاب 10</option>
<option value="7">انتخاب 11</option>
<option value="8">انتخاب 12</option>
</optgroup>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-form-label text-right col-lg-3 col-sm-12">انتخاب جداکننده 1</label>
<div class="col-lg-4 col-md-9 col-sm-12">
<select class="form-control" id="kt_multipleselectsplitter_1">
<optgroup label="دسته بندی 1">
<option value="1" >انتخاب 1</option>
<option value="2">انتخاب 2</option>
<option value="3">انتخاب 3</option>
<option value="4">انتخاب 4</option>
</optgroup>
<optgroup label="دسته بندی 2">
<option value="5">انتخاب 5</option>
<option value="6" selected>انتخاب 6</option>
<option value="7">انتخاب 7</option>
<option value="8">انتخاب 8</option>
</optgroup>
<optgroup label="دسته بندی 3">
<option value="5">انتخاب 9</option>
<option value="6">انتخاب 10</option>
<option value="7">انتخاب 11</option>
<option value="8">انتخاب 12</option>
</optgroup>
</select>
</div>
</div>
<div class="row">
<label class="col-form-label text-right col-lg-3 col-sm-12">انتخاب جداکننده 2</label>
<div class="col-lg-4 col-md-9 col-sm-12">
<select class="form-control" id="kt_multipleselectsplitter_2">
<optgroup label="گروه 1">
<option value="1" selected>گزینه 1</option>
<option value="2">گزینه 2</option>
<option value="3">گزینه 3</option>
<option value="4">گزینه 4</option>
</optgroup>
<optgroup label="گروه 2">
<option value="5">گزینه 5</option>
<option value="6">گزینه 6</option>
<option value="7">گزینه 7</option>
<option value="8">گزینه 8</option>
</optgroup>
<optgroup label="گروه 3">
<option value="5">گزینه 9</option>
<option value="6">گزینه 10</option>
<option value="7">گزینه 11</option>
<option value="8">گزینه 12</option>
</optgroup>
<optgroup label="گروه 4">
<option value="5">گزینه 13</option>
<option value="6">گزینه 14</option>
<option value="7">گزینه 15</option>
<option value="8">گزینه 16</option>
</optgroup>
<optgroup label="گروه 5">
<option value="5">گزینه 17</option>
<option value="6">گزینه 18</option>
<option value="7">گزینه 19</option>
<option value="8">گزینه 20</option>
</optgroup>
</select>
</div>
</div>
</div>
<div class="card-footer">
<div class="row">
<div class="col-lg-9 ml-lg-auto">
<button type="reset" class="btn btn-primary mr-2">ارسال</button>
<button type="reset" class="btn btn-secondary">لغو</button>
</div>
</div>
</div>
</form>
<!--end::Form-->
</div>
// کلاس definition
var KTبوت استرپچندگانهانتخابsplitter = function () {
// خصوصی functions
var demos = function () {
// minimum setup
دلار('#kt_multipleselectsplitter_1, #kt_multipleselectsplitter_2').multiselectsplitter();
}
return {
// public functions
init: function() {
demos();
}
};
}();
jQuery(document).ready(function() {
KTبوت استرپچندگانهانتخابsplitter.init();
});