I open bootstrap modal and close it without any issue
when I try to reopen again for second time after closing it
it not open so how to fix issue
so how to solve this issue
I can open bootstrap modal for display data and can close it without any issue
but when try to reopen again it not accept and not open bootstrap modal
<button id="BtnAddDisplay" class="btn custom-button col-12" type="button" onclick="INSERT_REQUEST_DEGREE_EQUATION_MODAL(); return false;">
ارسال الى جهه جديده
</button>
<div class="modal fade" id="INSERT_REQUEST_DEGREE_EQUATIONModal" tabindex="-1" aria-labelledby="INSERT_REQUEST_DEGREE_EQUATIONModalLabel" aria-hidden="true">
<div class="modal-dialog custom-modal-dialog">
<div class="modal-content">
<div class="modal-header btn-dark text-center w-100">
<h5 class="modal-title text-white w-100" id="INSERT_REQUEST_DEGREE_EQUATIONModalLabel">اضافه جهه جديده</h5>
<button type="button" class="close text-white" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header">
<h6 class="card-subtitle line-on-side text-muted text-center font-small-4 pt-1">دراسة مواد للشهادة ذاتها بجامعات أخرى</h6>
</div>
<div class="card-body">
<div id="dvTransfersInputs" class="row transfers">
<div class="col-12 col-md-4">
<div class="form-group">
<label class="control-label">
<asp:Literal Text="<%$ Resources:Resource1, P_COUNTRY_ID %>" runat="server" />
</label>
<asp:DropDownList ID='ddlP_COUNTRY_ID_equation' runat='server'
CssClass='chosen-select chosen-rtl form-control'
data-placeholder="<%$ Resources:Resource1, ddl-placeholder %>"
ClientIDMode='Static'
onchange="handleDropdownChange_country(this)">
<asp:ListItem Value="" Text="" Selected="True"></asp:ListItem>
</asp:DropDownList>
</div>
</div>
<div class="col-12 col-md-4">
<div class="form-group">
<label class="control-label">
<asp:Literal Text="<%$ Resources:Resource1, P_UNIVERSITY_ID %>" runat="server" />
</label>
<asp:DropDownList ID='ddlP_UNIVERSITY_ID_equation' runat='server' CssClass='chosen-select chosen-rtl form-control' data-placeholder="<%$ Resources:Resource1, ddl-placeholder %>" ClientIDMode='Static' onchange="handleDropdownChange_university(this)">
<asp:ListItem Value="" Text="" Selected="True"></asp:ListItem>
</asp:DropDownList>
</div>
</div>
<div class="col-12 col-md-4">
<div class="form-group">
<label class="control-label">
<asp:Literal Text="<%$ Resources:Resource1, P_OFFICE_ID %>" runat="server" />
</label>
<asp:DropDownList ID='ddlP_OFFICE_ID_equation' runat='server' CssClass='chosen-select chosen-rtl form-control' data-placeholder="<%$ Resources:Resource1, ddl-placeholder %>" ClientIDMode='Static' onchange="handleDropdownChange_office(this)">
<asp:ListItem Value="" Text="" Selected="True"></asp:ListItem>
</asp:DropDownList>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer justify-content-center">
<button type="button" onclick="INSERT_UPD_E_TRANS_REQUEST_DEGREE_EQUATION_TRANSFARED()" class="btn btn-success">اضافه</button>
<button type="button" class="btn btn-danger" data-dismiss="modal">الغاء</button>
</div>
</div>
</div>
</div>
i open it using
function INSERT_REQUEST_DEGREE_EQUATION_MODAL() {
debugger;
//$('.chosen-select').chosen({
// no_results_text: "No results matched",
// width: "100%"
//});
// check values of country
$('#ddlP_OFFICE_ID_equation').val('').trigger('chosen:updated');
$('#ddlP_UNIVERSITY_ID_equation').val('').trigger('chosen:updated');
$('#ddlP_COUNTRY_ID_equation').val('').trigger('chosen:updated');
var hiddenCountryValue = $('#HiddenCountry').val();
var countries = JSON.parse(hiddenCountryValue);
// Clear the dropdown and add a default empty option
var $ddlCountry = $('#ddlP_COUNTRY_ID_equation');
$ddlCountry.empty();
$ddlCountry.append($('<option>', {
value: '',
text: 'اختر من القائمه'
}));
// Populate the dropdown with the JSON data
$.each(countries, function (index, country) {
$ddlCountry.append($('<option>', {
value: country.COUNTRY_ID,
text: country.COUNTRY_NAME
}));
});
// Set the selected index to 0 (default option)
$ddlCountry.prop('selectedIndex', 0);
// Trigger the chosen update if you are using the chosen plugin
$ddlCountry.trigger('chosen:updated');
//========== Check university
// Get the JSON data from the hidden field for Universities
var hiddenUniversityValue = $('#HiddenUniversity').val();
var universities = JSON.parse(hiddenUniversityValue);
// Clear the University dropdown and add a default empty option
var $ddlUniversity = $('#ddlP_UNIVERSITY_ID_equation');
$ddlUniversity.empty();
$ddlUniversity.append($('<option>', {
value: '',
text: 'اختر من القائمه'
}));
// Populate the University dropdown with the JSON data
$.each(universities, function (index, university) {
$ddlUniversity.append($('<option>', {
value: university.UNIVERSITY_ID,
text: university.UNIVERSITY_DESC
}));
});
// Set the selected index to 0 (default option)
$ddlUniversity.prop('selectedIndex', 0);
// Trigger the chosen update for University dropdown
$ddlUniversity.trigger('chosen:updated');
//=========== Check office
var hiddenOfficeValue = $('#HiddenOffice').val();
var offices = JSON.parse(hiddenOfficeValue);
// Clear the Office dropdown and add a default empty option
var $ddlOffice = $('#ddlP_OFFICE_ID_equation');
$ddlOffice.empty();
$ddlOffice.append($('<option>', {
value: '',
text: 'اختر من القائمه'
}));
// Populate the Office dropdown with the JSON data
$.each(offices, function (index, office) {
$ddlOffice.append($('<option>', {
value: office.OFFICE_ID,
text: office.OFFICE_NAME
}));
});
// Set the selected index to 0 (default option)
$ddlOffice.prop('selectedIndex', 0);
// Trigger the chosen update for Office dropdown
$ddlOffice.trigger('chosen:updated');
//============
$('#INSERT_REQUEST_DEGREE_EQUATIONModal').find('input:text, select').val('').trigger('chosen:updated');
// Optionally, if you are using other plugins or components, reset their states here
// Show the modal
$('#INSERT_REQUEST_DEGREE_EQUATIONModal').modal('show').on('hidden.bs.modal', function () {
// Perform any clean-up if necessary when the modal is hidden
// Reset dropdowns or other inputs here if needed
populateDropdown($('#ddlP_COUNTRY_ID_equation'), countries, 'اختر من القائمه');
populateDropdown($('#ddlP_UNIVERSITY_ID_equation'), universities, 'اختر من القائمه');
populateDropdown($('#ddlP_OFFICE_ID_equation'), offices, 'اختر من القائمه');
});
//if ($.fn.chosen) {
// $ddlCountry.chosen('destroy'); // Destroy previous instance if any
// $ddlCountry.chosen({
// // Custom Chosen Options if required
// 'width': '100%', // adjust as needed
// 'no_results_text': 'لا توجد نتائج' // Example
// });
// $ddlUniversity.chosen('destroy'); // Destroy previous instance if any
// $ddlUniversity.chosen({
// // Custom Chosen Options if required
// 'width': '100%', // adjust as needed
// 'no_results_text': 'لا توجد نتائج' // Example
// });
// $ddlOffice.chosen('destroy'); // Destroy previous instance if any
// $ddlOffice.chosen({
// // Custom Chosen Options if required
// 'width': '100%', // adjust as needed
// 'no_results_text': 'لا توجد نتائج' // Example
// });
//}
/* $('#INSERT_REQUEST_DEGREE_EQUATIONModal').modal('hide');*/
// Reset input fields (optional, since they'll be reset when hidden)
//$('#ddlP_OFFICE_ID').val('').trigger('chosen:updated');
//$('#ddlP_UNIVERSITY_ID').val('').trigger('chosen:updated');
//$('#ddlP_COUNTRY_ID').val('').trigger('chosen:updated');
//$('#INSERT_REQUEST_DEGREE_EQUATIONModal').modal('show');
return false;
}
and i close it using
$('#INSERT_REQUEST_DEGREE_EQUATIONModal').modal('hide');