AutismPatient
commented
5 years ago I also have the same problem, please reply the administrator
Open pudyasto opened 5 years ago
AutismPatient
commented
5 years ago I also have the same problem, please reply the administrator
JaconsMorais
commented
5 years ago Are you running the method App.select.activate()?
pudyasto
commented
5 years ago Yes, I've running some method on show.bs.modal, like this :
$('#form-modal').on('show.bs.modal', function (event) {
$.AdminBSB.input.activate();
$.AdminBSB.select.activate();
$.AdminBSB.search.activate();
});And dropdownMenu? Can you show me the html of select?
pudyasto
commented
5 years ago Yes, this is my form inside modal, after my modal show then I call this form via ajax I'm using style="z-index: 500" for solve this problem temporary
<div class="modal fade in" id="form-modal" role="dialog" data-backdrop="static" aria-labelledby="form-modal" aria-hidden="true" style="display: block;">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="form-modal-title" style="font-size: 18px;">Tambah Data</h4>
</div>
<div class="modal-body">
<div id="form-modal-content"><form action="http://simmutu.local/indikator/submit" role="form" id="form_add" class="form-horizontal" name="form_add" method="post" accept-charset="utf-8">
<input type="hidden" name="csrf_token" value="7d4b774e2aeaad90b31e01ba58f75185">
<input type="hidden" name="id" value="" placeholder="ID" id="id" class="form-control ">
<div class="row clearfix">
<div class="col-sm-6" style="z-index: 500">
<label class="">Pilih Unit</label> <div class="input-group">
<div class="form-line">
<div class="btn-group bootstrap-select form-control show-tick"><button type="button" class="btn dropdown-toggle btn-default" data-toggle="dropdown" data-id="unit_id" title="-- Pilih Unit --" aria-expanded="false"><span class="filter-option pull-left">-- Pilih Unit --</span> <span class="bs-caret"><span class="caret"></span></span></button><div class="dropdown-menu open" style="max-height: 843px; overflow: hidden; min-height: 132px;"><div class="bs-searchbox"><input type="text" class="form-control" autocomplete="off"></div><ul class="dropdown-menu inner" role="menu" style="max-height: 793px; overflow-y: auto; min-height: 82px;"><li data-original-index="0" class="selected active"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">-- Pilih Unit --</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="1"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">UGD</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="2"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Konservasi</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="3"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Bedah Mulut</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="4"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Kedokteran Gigi Anak</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="5"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Prostodonsia</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="6"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Ilmu Penyakit Mulut</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="7"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Periodonsia</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="8"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Ortodonsia</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="9"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Integrasi</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="10"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Radiologi</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="11"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Lab Klinik</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="12"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Oral Diagnostic</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="13"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Farmasi</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="14"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Rekam Medik</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="15"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Pengelolaan limbah</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="16"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Pelayanan Laundry </span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="17"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Pencegahan dan pengendalian infeksi (PPI) </span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="18"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">IPSRS</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="19"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Administrasi umum dan keuangan</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="20"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Sterilisasi (CSSD)</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="21"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Geriatri</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="22"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Bedah Sentral</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="23"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Klinik (Infeksi HIV)</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="24"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Ambulance</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="25"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Laboratorium Teknik Gigi</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="26"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Transit Jenazah</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="27"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Instalasi Gizi (MoU)</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li></ul></div><select name="unit_id" id="unit_id" class="form-control show-tick" data-live-search="true" tabindex="-98">
<option value="" selected="selected">-- Pilih Unit --</option>
<option value="1">UGD</option>
<option value="2">Konservasi</option>
<option value="3">Bedah Mulut</option>
<option value="4">Kedokteran Gigi Anak</option>
<option value="5">Prostodonsia</option>
<option value="6">Ilmu Penyakit Mulut</option>
<option value="7">Periodonsia</option>
<option value="8">Ortodonsia</option>
<option value="9">Integrasi</option>
<option value="10">Radiologi</option>
<option value="11">Lab Klinik</option>
<option value="12">Oral Diagnostic</option>
<option value="13">Farmasi</option>
<option value="14">Rekam Medik</option>
<option value="15">Pengelolaan limbah</option>
<option value="16">Pelayanan Laundry </option>
<option value="17">Pencegahan dan pengendalian infeksi (PPI) </option>
<option value="18">IPSRS</option>
<option value="19">Administrasi umum dan keuangan</option>
<option value="20">Sterilisasi (CSSD)</option>
<option value="21">Geriatri</option>
<option value="22">Bedah Sentral</option>
<option value="23">Klinik (Infeksi HIV)</option>
<option value="24">Ambulance</option>
<option value="25">Laboratorium Teknik Gigi</option>
<option value="26">Transit Jenazah</option>
<option value="27">Instalasi Gizi (MoU)</option>
</select></div>
</div>
</div>
</div>
<div class="col-sm-6" style="z-index: 499">
<label class="">Jenis Indikator</label> <div class="input-group">
<div class="form-line">
<div class="btn-group bootstrap-select form-control show-tick"><button type="button" class="btn dropdown-toggle btn-default" data-toggle="dropdown" data-id="jenis_id" title="-- Pilih Jenis Unit --" aria-expanded="false"><span class="filter-option pull-left">-- Pilih Jenis Unit --</span> <span class="bs-caret"><span class="caret"></span></span></button><div class="dropdown-menu open" style="max-height: 843px; overflow: hidden; min-height: 132px;"><div class="bs-searchbox"><input type="text" class="form-control" autocomplete="off"></div><ul class="dropdown-menu inner" role="menu" style="max-height: 793px; overflow-y: auto; min-height: 82px;"><li data-original-index="0" class="selected active"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">-- Pilih Jenis Unit --</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="1"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Mutu Unit</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="2"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Mutu Nasional</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="3"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Mutu Prioritas Area Klinis</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="4"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Mutu Prioritas Area Manajemen</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="5"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Mutu Nasional Sasaran keselamatan pasien</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="6"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Kepatuhan Protokol Klinis</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li></ul></div><select name="jenis_id" id="jenis_id" class="form-control show-tick" data-live-search="true" tabindex="-98">
<option value="" selected="selected">-- Pilih Jenis Unit --</option>
<option value="1">Mutu Unit</option>
<option value="2">Mutu Nasional</option>
<option value="3">Mutu Prioritas Area Klinis</option>
<option value="4">Mutu Prioritas Area Manajemen</option>
<option value="5">Mutu Nasional Sasaran keselamatan pasien</option>
<option value="6">Kepatuhan Protokol Klinis</option>
</select></div>
</div>
</div>
</div>
<div class="col-sm-6">
<label class="">Numerator</label> <div class="input-group">
<div class="form-line">
<textarea name="num" cols="40" rows="10" placeholder="Numerator" id="num" class="form-control " style="resize: vertical;height: 50px;min-height: 50px;"></textarea>
</div>
</div>
</div>
<div class="col-sm-6">
<label class="">Denumerator</label> <div class="input-group">
<div class="form-line">
<textarea name="denum" cols="40" rows="10" placeholder="Denumerator" id="denum" class="form-control " style="resize: vertical;height: 50px;min-height: 50px;"></textarea>
</div>
</div>
</div>
<div class="col-sm-6" style="z-index: 498">
<label class="">Frekuensi</label> <div class="input-group">
<div class="form-line">
<div class="btn-group bootstrap-select form-control"><button type="button" class="btn dropdown-toggle btn-default" data-toggle="dropdown" data-id="frekuensi" title="Harian"><span class="filter-option pull-left">Harian</span> <span class="bs-caret"><span class="caret"></span></span></button><div class="dropdown-menu open"><ul class="dropdown-menu inner" role="menu"><li data-original-index="0" class="selected"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Harian</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="1"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Mingguan</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="2"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Bulanan</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="3"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Tahunan</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li></ul></div><select name="frekuensi" id="frekuensi" class="form-control" tabindex="-98">
<option value="Harian">Harian</option>
<option value="Mingguan">Mingguan</option>
<option value="Bulanan">Bulanan</option>
<option value="Tahunan">Tahunan</option>
</select></div>
</div>
</div>
</div>
<div class="col-sm-6">
<label class="">Periode Analisa</label> <div class="input-group">
<div class="form-line">
<input type="number" name="periode_analisa" value="" placeholder="Periode Analisa" min="0" id="periode_analisa" class="form-control " required="">
</div>
</div>
</div>
<div class="col-sm-6" style="z-index: 497">
<label class="">Tipe Indikator</label> <div class="input-group">
<div class="form-line">
<div class="btn-group bootstrap-select form-control"><button type="button" class="btn dropdown-toggle btn-default" data-toggle="dropdown" data-id="tipe_id" title="Input"><span class="filter-option pull-left">Input</span> <span class="bs-caret"><span class="caret"></span></span></button><div class="dropdown-menu open"><ul class="dropdown-menu inner" role="menu"><li data-original-index="0" class="selected"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Input</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="1"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Process</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="2"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Outcome</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="3"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Outcome and Process</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li></ul></div><select name="tipe_id" id="tipe_id" class="form-control" tabindex="-98">
<option value="1">Input</option>
<option value="2">Process</option>
<option value="3">Outcome</option>
<option value="4">Outcome and Process</option>
</select></div>
</div>
</div>
</div>
<div class="col-sm-6">
<label class="">Sumber Data</label> <div class="input-group">
<div class="form-line">
<input type="text" name="sumber_data" value="" placeholder="Sumber Data" id="sumber_data" class="form-control " required="">
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default btn-sm" data-dismiss="modal" aria-label="Close">
Batal
</button>
<button type="submit" class="btn btn-primary btn-sm">
Simpan
</button>
</div>
</form>
<script type="text/javascript">
$(document).ready(function () {
$("#form_add").on("submit", function (event) {
event.preventDefault();
var input = $(this).serialize();
var submit = $(this).attr('action');
$.ajax({
type: "POST",
url: submit,
data: input,
success: function (resp) {
var obj = jQuery.parseJSON(resp);
update_csrf(obj);
if (obj.state === "1") {
swal({
title: obj.title,
html: obj.msg,
type: "success"
}).then((result) => {
if (result.value) {
table.ajax.reload();
$('#form-modal').modal("hide");
}
});
} else {
swal({
title: obj.title,
html: obj.msg,
type: "error"
}).then((result) => {
if (result.value) {
}
});
}
},
error: function (event, textStatus, errorThrown) {
swal({
title: "Kesalahan!",
html: 'Pesan: ' + textStatus + ' , HTTP: ' + errorThrown,
type: "error"
}).then((result) => {
if (result.value) {
//location.reload();
}
});
}
});
});
});
</script></div>
</div>
</div>
</div>
</div>try change input-group class to form-group
Hi, I try using AdminBSB for my new project, that's awsome! But i have problem while using Bootstrap-Select in Modal. When I focused on select option, the dropdown menu not showing perfectly. I think the problem from z-index, so I try using z-index in each div. But it's not efficient, So can you give me another solution for this ?
This is when I using z-index manually :
Thanks!