choose tag dialog buttons fixed. see #183
This commit is contained in:
parent
6f9985cdbd
commit
96cf382deb
1 changed files with 27 additions and 18 deletions
|
|
@ -201,10 +201,7 @@ switch (message.command) {
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mzta_dialog_close {
|
.mzta_dialog_btn {
|
||||||
position: absolute;
|
|
||||||
bottom: 10px;
|
|
||||||
right: 10px;
|
|
||||||
background: #007bff;
|
background: #007bff;
|
||||||
border: none;
|
border: none;
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
|
|
@ -214,7 +211,7 @@ switch (message.command) {
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mzta_dialog_close:hover {
|
.mzta_dialog_btn:hover {
|
||||||
background: #0056b3;
|
background: #0056b3;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -232,6 +229,13 @@ switch (message.command) {
|
||||||
background: rgba(0, 0, 0, 0.7);
|
background: rgba(0, 0, 0, 0.7);
|
||||||
z-index: 1000;
|
z-index: 1000;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.div_btns{
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
`;
|
`;
|
||||||
document.head.appendChild(style);
|
document.head.appendChild(style);
|
||||||
|
|
||||||
|
|
@ -267,25 +271,30 @@ switch (message.command) {
|
||||||
form.appendChild(label);
|
form.appendChild(label);
|
||||||
});
|
});
|
||||||
|
|
||||||
// Add the submit button
|
// Add a div for buttons
|
||||||
const submitButton = document.createElement('button');
|
const buttonsDiv = document.createElement('div');
|
||||||
submitButton.type = 'button';
|
buttonsDiv.className = 'div_btns';
|
||||||
submitButton.textContent = 'Submit';
|
form.appendChild(buttonsDiv);
|
||||||
submitButton.style.marginRight = '10px';
|
|
||||||
submitButton.addEventListener('click', () => {
|
|
||||||
const selected = Array.from(form.querySelectorAll('input[type=checkbox]:checked')).map(cb => cb.value);
|
|
||||||
onSubmit(selected);
|
|
||||||
closeDialog();
|
|
||||||
});
|
|
||||||
form.appendChild(submitButton);
|
|
||||||
|
|
||||||
// Add the close button
|
// Add the close button
|
||||||
const closeButton = document.createElement('button');
|
const closeButton = document.createElement('button');
|
||||||
closeButton.type = 'button';
|
closeButton.type = 'button';
|
||||||
closeButton.textContent = 'Close';
|
closeButton.textContent = 'Close';
|
||||||
closeButton.className = 'mzta_dialog_close';
|
closeButton.className = 'mzta_dialog_btn';
|
||||||
closeButton.addEventListener('click', closeDialog);
|
closeButton.addEventListener('click', closeDialog);
|
||||||
form.appendChild(closeButton);
|
buttonsDiv.appendChild(closeButton);
|
||||||
|
|
||||||
|
// Add the submit button
|
||||||
|
const submitButton = document.createElement('button');
|
||||||
|
submitButton.type = 'button';
|
||||||
|
submitButton.textContent = 'Submit';
|
||||||
|
submitButton.className = 'mzta_dialog_btn';
|
||||||
|
submitButton.addEventListener('click', () => {
|
||||||
|
const selected = Array.from(form.querySelectorAll('input[type=checkbox]:checked')).map(cb => cb.value);
|
||||||
|
onSubmit(selected);
|
||||||
|
closeDialog();
|
||||||
|
});
|
||||||
|
buttonsDiv.appendChild(submitButton);
|
||||||
|
|
||||||
content.appendChild(form);
|
content.appendChild(form);
|
||||||
dialog.appendChild(content);
|
dialog.appendChild(content);
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue