Я новичок в кодировании, и мне нужно подготовить POC. У меня есть некоторые проблемы с модалом. От его создания я больше не могу нажимать на определенные кнопки, которые у меня уже были. Кто-то знает, как сохранить эти кнопки доступными, даже когда модал подходит? Я могу видеть их, но больше не могу нажимать на них (они казались позади модальной). Вы можете видеть это на приложенной картинке.
Кнопки включены в исходный код javascript, который я получил от открытого API Autodesk), модал сам кодировал в html-файл.
Я смотрю вокруг, но ничего не нашел. Я также пытался настроить z-index для модального, но ничего не произошло.
Я бы хотел, чтобы при создании моего модального режима оставалось действие onclick и было разрешено само действие.
function prepareAppBucketTree() {
$('#appBuckets').jstree({
'core': {
'themes': { "icons": true },
'data': {
"url": '/api/forge/oss/buckets',
"dataType": "json",
'multiple': false,
"data": function (node) {
return { "id": node.id };
}
}
},
'types': {
'default': {
'icon': 'glyphicon glyphicon-question-sign'
},
'#': {
'icon': 'glyphicon glyphicon-cloud'
},
'bucket': {
'icon': 'glyphicon glyphicon-folder-open'
},
'object': {
'icon': 'glyphicon glyphicon-file'
}
},
"plugins": ["types", "state", "sort", "contextmenu"],
contextmenu: { items: autodeskCustomMenu }
}).on('loaded.jstree', function () {
$('#appBuckets').jstree('open_all');
}).bind("activate_node.jstree", function (evt, data) {
if (data != null && data.node != null && data.node.type == 'object') {
$("#forgeViewer").empty();
var urn = data.node.id;
getForgeToken(function (access_token) {
jQuery.ajax({
url: 'https://developer.api.autodesk.com/modelderivative/v2/designdata/' + urn + '/manifest',
headers: { 'Authorization': 'Bearer ' + access_token },
success: function (res) {
if (res.status === 'success') launchViewer(urn);
else $("#forgeViewer").html('Conversion en cours: ' + res.progress + '. Merci de réessayer plus tard.');
},
error: function (err) {
var msgButton = 'Fichier pas encore convertis! ' +
'<button class="btn btn-xs btn-info" onclick="translateObject()"><span class="glyphicon glyphicon-eye-open"></span> ' +
'Start translation</button>'
$("#forgeViewer").html(msgButton);
}
});
})
}
});
}
function autodeskCustomMenu(autodeskNode) {
var items;
switch (autodeskNode.type) {
case "bucket":
items = {
uploadFile: {
label: "Télécharger",
action: function () {
uploadFile();
},
icon: 'glyphicon glyphicon-cloud-upload'
}
};
break;
case "object":
items = {
translateFile: {
label: "Convertir",
action: function () {
var treeNode = $('#appBuckets').jstree(true).get_selected(true)[0];
translateObject(treeNode);
},
icon: 'glyphicon glyphicon-eye-open'
}
};
break;
}
return items;
}
function uploadFile() {
$('#hiddenUploadField').click();
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!-- Navigation bar: https://getbootstrap.com/examples/navbar-fixed-top/ -------------------------------------------------------------------------->
<nav class="navbar navbar-default navbar-fixed-top">
<div id="navigation" class="container-fluid">
<div id="leftSide">
<button id="navbaricons" type="button" class="glyphicon glyphicon-menu-hamburger" data-toggle="modal" data-target="#myModal" onclick="masquer_div('Arborescence')"></button>
<a href="http://www.overdrive.fr/accueil/" target="_blank">
<img alt="Logo Overdrive" src="img/logo_overdrive_blanc.png"></a>
<a id="nom">- bimDrive -</a>
<button id="navbaricons" class="glyphicon glyphicon-user" style="float: right" onclick="document.getElementById('id01').style.display='block'"></button>
<button id="navbaricons" type="button" class="glyphicon glyphicon-map-marker" style="float: right" data-toggle="modal" data-target="#MapModal" onclick="masquer_div('MiniMap')"></button>
</div>
</div>
</nav>
<!-- END of navigation bar ----------------------------------------------------------------------------------------------------------->
<!-- Arborescence Modal -------------------------------------------------------------------------------------------------------------->
<div class="modal" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="false">
<div class="arbomodal-dialog">
<!-- Modal content---------------------------------------------------------------------------------------------------------------------->
<div class="arbomodal-content">
<div class="modal-header" data-toggle="tooltip">
<button class="glyphicon glyphicon-plus-sign" style="float: left" id="showFormCreateBucket" data-toggle="modal" data-target="#createBucketModal"></button>Maquettes
<span id="refreshBuckets" class="glyphicon glyphicon-refresh" style="cursor: pointer; float: right"></span>
</div>
<div id="appBuckets" class="modal-body"></div>
</div>
</div>
</div>