zydronium/manage.get.gov
1
0
Fork 0
mirror of https://github.com/cisagov/manage.get.gov.git synced 2025-08-12 20:49:41 +02:00
Code Issues Projects Releases Packages Wiki Activity

Add conditional "confirm" logic

Browse source
This commit is contained in:
zandercymatics 2024-02-08 11:43:56 -07:00
parent 612f967c6f
commit df70a179e8
No known key found for this signature in database
GPG key ID: FF4636ABEC9682B7
3 changed files with 25 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

33
src/registrar/assets/js/get-gov-admin.js
View file

@ -44,27 +44,24 @@ function openInNewTab(el, removeAttribute = false){
domainSubmitButton.addEventListener("mouseover", () => openInNewTab(domainFormElement, true)); domainSubmitButton.addEventListener("mouseover", () => openInNewTab(domainFormElement, true));
domainSubmitButton.addEventListener("mouseout", () => openInNewTab(domainFormElement, false)); domainSubmitButton.addEventListener("mouseout", () => openInNewTab(domainFormElement, false));
} }
let extendExpirationDateButton = document.getElementById("extend-expiration-button")
let confirmationButtons = document.querySelector(".admin-confirmation-buttons")
let cancelExpirationButton = document.getElementById("cancel-extend-button")
if (extendExpirationDateButton && confirmationButtons && cancelExpirationButton){
let extendExpirationDateButton = document.getElementById("extend_expiration_date_button") // Tie logic to the extend button to show confirmation options
if (extendExpirationDateButton){
extendExpirationDateButton.addEventListener("click", () => { extendExpirationDateButton.addEventListener("click", () => {
form = document.getElementById("domain_form") extendExpirationDateButton.hidden = true
/* console.log("these are the buttons: ")
For some reason, Django admin has the propensity to ignore nested console.log(confirmationButtons)
inputs and delete nested form objects. confirmationButtons.hidden = false
The workaround is to manually create an element as so, after the DOM })
has been generated.
Its not the most beautiful thing every, but it works. // Tie logic to the cancel button to hide the confirmation options
*/ cancelExpirationButton.addEventListener("click", () => {
var input = document.createElement("input"); confirmationButtons.hidden = true
input.type = "hidden"; extendExpirationDateButton.hidden = false
input.name = "_extend_expiration_date";
// The value doesn't matter, just needs to be present
input.value = "1";
// Add the hidden input to the form
form.appendChild(input);
form.submit();
}) })
} }
} }

5
src/registrar/assets/sass/_theme/_admin.scss
View file

@ -283,6 +283,11 @@ h1, h2, h3,
} }
} }
.usa-button{
font-size: 14px;
font-weight: normal;
}
// Button groups in /admin incorrectly have bullets. // Button groups in /admin incorrectly have bullets.
// Remove that! // Remove that!
.usa-button-group .usa-button-group__item { .usa-button-group .usa-button-group__item {

6
src/registrar/templates/django/admin/domain_change_form.html
View file

@ -11,7 +11,11 @@
</div> </div>
<div class="desktop:flex-align-self-end"> <div class="desktop:flex-align-self-end">
{% if original.state != original.State.DELETED %} {% if original.state != original.State.DELETED %}
<input type="submit" value="Extend expiration date" name="_extend_expiration_date" class="custom-link-button"> <span class="admin-confirmation-buttons" hidden>
<button type="submit" class="usa-button" name="_extend_expiration_date">Confirm extension</button>
<button type="button" id="cancel-extend-button" class="usa-button usa-button--secondary">Cancel</button>
</span>
<input id="extend-expiration-button" type="button" value="Extend expiration date" class="custom-link-button">
{% endif %} {% endif %}
<span class="margin-left-05 margin-right-05 text-middle"> | </span> <span class="margin-left-05 margin-right-05 text-middle"> | </span>
{% if original.state == original.State.READY %} {% if original.state == original.State.READY %}