preview fields

This commit is contained in:
Corban-Lee Jones 2024-07-02 00:46:41 +01:00
parent 7adf6b5bf6
commit bc0166b3ce
2 changed files with 74 additions and 50 deletions

View File

@ -329,30 +329,31 @@
</div>
</div>
<div id="confirmContent" class="tab-pane fade flex-column h-100">
<h5 class="mb-3">Preview:</h5>
<div class="row">
<div class="col-12">
<div class="form-floating mb-3">
<input type="text" name="" id="" class="form-control-plaintext" placeholder="" readonly value="Chequered Lake">
<label for="" class="form-label">Venue Name</label>
<div class="form-floating mb-3 venue-preview-field">
<input type="text" class="form-control-plaintext" placeholder="" readonly data-linked-field="#venueName">
<label class="form-label">Venue Name</label>
</div>
</div>
<div class="col-lg-6">
<div class="form-floating mb-3">
<input type="text" name="" id="" class="form-control-plaintext" placeholder="" readonly value="Some description...">
<label for="" class="form-label">Description</label>
<div class="form-floating mb-3 venue-preview-field">
<input type="text" class="form-control-plaintext" placeholder="" readonly data-linked-field="#venueDesc">
<label class="form-label">Description</label>
</div>
</div>
<div class="col-lg-6">
<div class="form-floating mb-3">
<input type="text" name="" id="" class="form-control-plaintext" placeholder="" readonly value="Fishery">
<label for="" class="form-label">Venue Type</label>
<div class="form-floating mb-3 venue-preview-field">
<input type="text" class="form-control-plaintext" placeholder="" readonly data-linked-field="#venueType">
<label class="form-label">Venue Type</label>
</div>
</div>
</div>
<div class="mt-5 mt-md-auto d-flex justify-content-end">
<button class="btn btn-outline-secondary me-3" type="button" onclick="$('#watersTab').click();">Back</button>
<button class="btn btn-primary" type="submit">Save Changes</button>
<button id="submitVenueBtn" class="btn btn-primary" type="submit">Save Changes</button>
</div>
</div>
</div>

View File

@ -1,57 +1,80 @@
$("#confirmTab").on("click", function() {
$(".venue-preview-field").each(function() {
var input = $(this).find("input");
linkedFieldId = input.attr("data-linked-field");
linkedFieldType = input.attr("type")
if (linkedFieldType === "check") {
input.val($(`input[name="${linkedFieldId}"]:checked`).val());
}
else
input.val($(linkedFieldId).val());
});
})
async function viewVenueModal(venueId) {
await openVenueModal(venueId)
$("#venueForm input, #venueForm textarea").prop("disabled", true)
$("#venueForm input, #venueForm textarea").attr("disabled", true);
$("#submitVenueBtn").hide();
}
async function openVenueModal(venueId) {
// showPage($("#newVenuePages .page:first"));
$("#detailsTab").click();
setTimeout(() => { $("#venueName").focus() }, 300);
$("#venueForm input, #venueForm textarea").prop("disabled", false)
$("#venueForm").attr("data-id", venueId)
$("#venueForm input, #venueForm textarea").prop("disabled", false);
$("#submitVenueBtn").show();
$("#venueForm").attr("data-id", venueId);
if (venueId===-1){
$("#venueName").val("")
$("#venueDesc").val("")
$(`#venueForm input[name="venueType"]`).prop("checked", false)
$("#venueActive").prop("checked", true)
$("#venueStreet").val("")
$("#venueCity").val("")
$("#venueCounty").val("")
$("#venuePost").val("")
$("#venueCountry").val("")
$("#venueLat").val("")
$("#venueLng").val("")
$("#venuePhone").val("")
$("#venueEmail").val("")
$("#venueWebsite").val("")
$("#venueFacebook").val("")
$("#venueInstagram").val("")
$("#venueTwitter").val("")
$("#venueName").val("");
$("#venueDesc").val("");
$(`#venueForm input[name="venueType"]`).prop("checked", false);
$("#venueActive").prop("checked", true);
$("#venueStreet").val("");
$("#venueCity").val("");
$("#venueCounty").val("");
$("#venuePost").val("");
$("#venueCountry").val("");
$("#venueLat").val("");
$("#venueLng").val("");
$("#venuePhone").val("");
$("#venueEmail").val("");
$("#venueWebsite").val("");
$("#venueFacebook").val("");
$("#venueInstagram").val("");
$("#venueTwitter").val("");
}
else {
const venue = await getVenue(venueId)
$("#venueName").val(venue.name)
$("#venueDesc").val(venue.description)
$(`#venueForm input[name="venueType"][value=${venue.venue_type}]`).prop("checked", true)
$("#venueActive").prop("checked", venue.active)
// $("#venueStreetNum").val(venue.name)
$("#venueStreet").val(venue.street_address)
$("#venueCity").val(venue.city)
$("#venueCounty").val(venue.provence)
$("#venuePost").val(venue.postal_code)
$("#venueCountry").val(venue.country)
$("#venueLat").val(venue.latitude)
$("#venueLng").val(venue.longitude)
$("#venuePhone").val(venue.phone_number)
$("#venueEmail").val(venue.email_address)
$("#venueWebsite").val(venue.website_url)
$("#venueFacebook").val(venue.facebook_url)
$("#venueInstagram").val(venue.instagram_url)
$("#venueTwitter").val(venue.twitter_url)
const venue = await getVenue(venueId);
$("#venueName").val(venue.name);
$("#venueDesc").val(venue.description);
$(`#venueForm input[name="venueType"][value=${venue.venue_type}]`).prop("checked", true);
$("#venueActive").prop("checked", venue.active);
// $("#venueStreetNum").val(venue.name);
$("#venueStreet").val(venue.street_address);
$("#venueCity").val(venue.city);
$("#venueCounty").val(venue.provence);
$("#venuePost").val(venue.postal_code);
$("#venueCountry").val(venue.country);
$("#venueLat").val(venue.latitude);
$("#venueLng").val(venue.longitude);
$("#venuePhone").val(venue.phone_number);
$("#venueEmail").val(venue.email_address);
$("#venueWebsite").val(venue.website_url);
$("#venueFacebook").val(venue.facebook_url);
$("#venueInstagram").val(venue.instagram_url);
$("#venueTwitter").val(venue.twitter_url);
}
new bootstrap.Modal("#venueModal").show();
$("#venueModal").modal("show");
}
async function deleteVenueBtn(venueId){