2021-07-09 22:18:22 +00:00
|
|
|
<!-- Button to Open the Modal -->
|
|
|
|
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#redeemVoucherModal">
|
|
|
|
Open modal
|
|
|
|
</button>
|
|
|
|
|
|
|
|
<!-- The Modal -->
|
|
|
|
<div class="modal fade" id="redeemVoucherModal">
|
|
|
|
<div class="modal-dialog">
|
|
|
|
<div class="modal-content">
|
|
|
|
|
|
|
|
<!-- Modal Header -->
|
|
|
|
<div class="modal-header">
|
|
|
|
<h4 class="modal-title">Redeem voucher code</h4>
|
|
|
|
<button type="button" class="close" data-dismiss="modal">×</button>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<!-- Modal body -->
|
|
|
|
<div class="modal-body">
|
2021-07-10 06:58:11 +00:00
|
|
|
<form id="redeemVoucherForm" onsubmit="return false" method="post" action="{{route('voucher.redeem')}}">
|
2021-07-09 22:18:22 +00:00
|
|
|
<div class="form-group">
|
2021-07-10 06:58:11 +00:00
|
|
|
<label for="redeemVoucherCode">Code</label>
|
2021-07-09 22:18:22 +00:00
|
|
|
<div class="input-group">
|
|
|
|
<div class="input-group-prepend">
|
|
|
|
<div class="input-group-text">
|
|
|
|
<i class="fas fa-money-check-alt"></i>
|
|
|
|
</div>
|
|
|
|
</div>
|
2021-07-10 06:58:11 +00:00
|
|
|
<input id="redeemVoucherCode" name="code" placeholder="SUMMER" type="text" class="form-control">
|
2021-07-09 22:18:22 +00:00
|
|
|
</div>
|
2021-07-10 06:58:11 +00:00
|
|
|
<span id="redeemVoucherCodeError" class="text-danger"></span>
|
|
|
|
<span id="redeemVoucherCodeSuccess" class="text-success"></span>
|
2021-07-09 22:18:22 +00:00
|
|
|
</div>
|
|
|
|
</form>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<!-- Modal footer -->
|
|
|
|
<div class="modal-footer">
|
|
|
|
<button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
|
2021-07-10 06:58:11 +00:00
|
|
|
<button name="submit" id="redeemVoucherSubmit" onclick="redeemVoucherCode()" type="button" class="btn btn-primary">Redeem</button>
|
2021-07-09 22:18:22 +00:00
|
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<script>
|
2021-07-10 06:58:11 +00:00
|
|
|
function redeemVoucherCode(){
|
|
|
|
let form = document.getElementById('redeemVoucherForm')
|
|
|
|
let button = document.getElementById('redeemVoucherSubmit')
|
|
|
|
let input = document.getElementById('redeemVoucherCode')
|
|
|
|
|
|
|
|
console.log(form.method , form.action)
|
|
|
|
button.disabled = true
|
|
|
|
|
2021-07-09 22:18:22 +00:00
|
|
|
$.ajax({
|
2021-07-10 06:58:11 +00:00
|
|
|
method : form.method,
|
|
|
|
url : form.action,
|
|
|
|
dataType: 'json',
|
|
|
|
data: {
|
|
|
|
code : input.value
|
|
|
|
},
|
|
|
|
success : function (response) {
|
|
|
|
resetForm()
|
|
|
|
redeemVoucherSetSuccess(response)
|
|
|
|
},
|
|
|
|
error : function (jqXHR, textStatus, errorThrown) {
|
|
|
|
resetForm()
|
|
|
|
redeemVoucherSetError(jqXHR.responseJSON)
|
|
|
|
console.error(jqXHR.responseJSON)
|
|
|
|
},
|
|
|
|
|
2021-07-09 22:18:22 +00:00
|
|
|
})
|
|
|
|
}
|
2021-07-10 06:58:11 +00:00
|
|
|
|
|
|
|
function resetForm(){
|
|
|
|
let button = document.getElementById('redeemVoucherSubmit')
|
|
|
|
let input = document.getElementById('redeemVoucherCode')
|
|
|
|
let successLabel = document.getElementById('redeemVoucherCodeSuccess')
|
|
|
|
let errorLabel = document.getElementById('redeemVoucherCodeError')
|
|
|
|
|
|
|
|
input.classList.remove('is-invalid')
|
|
|
|
input.classList.remove('is-valid')
|
|
|
|
successLabel.innerHTML = ''
|
|
|
|
errorLabel.innerHTML = ''
|
|
|
|
button.disabled = false
|
|
|
|
}
|
|
|
|
|
|
|
|
function redeemVoucherSetError(error){
|
|
|
|
let input = document.getElementById('redeemVoucherCode')
|
|
|
|
let errorLabel = document.getElementById('redeemVoucherCodeError')
|
|
|
|
|
|
|
|
input.classList.add("is-invalid")
|
|
|
|
errorLabel.innerHTML = error.errors.code[0]
|
|
|
|
}
|
|
|
|
|
|
|
|
function redeemVoucherSetSuccess(response){
|
|
|
|
let input = document.getElementById('redeemVoucherCode')
|
|
|
|
let successLabel = document.getElementById('redeemVoucherCodeSuccess')
|
|
|
|
|
|
|
|
successLabel.innerHTML = response.success
|
|
|
|
input.classList.remove('is-invalid')
|
|
|
|
input.classList.add('is-valid')
|
|
|
|
}
|
2021-07-09 22:18:22 +00:00
|
|
|
</script>
|