"use strict";

const KTSupportModal = function (){
let modal,
form,
validator;
const handle = function (){
validator = FormValidation.formValidation(form, {
fields: {
subject: {
validators: {
notEmpty: {
message: "The site name is required"
}
}
},
"message": {
validators: {
notEmpty: {
message: "The message is required"
}
}
}
},
plugins: {
trigger: new FormValidation.plugins.Trigger(),
bootstrap: new FormValidation.plugins.Bootstrap5({
rowSelector: ".fv-row",
eleInvalidClass: "",
eleValidClass: ""
})
}
});
form.addEventListener("submit", function (e){
e.preventDefault();
console.log(this);
})
}
return {
init: function (){
modal = document.getElementById("kt_create_ticket");
form = document.getElementById("create_ticket");
handle();
}
};
}();

KTUtil.onDOMContentLoaded(function (){
KTSupportModal.init();
});

<div class="form-group fv-row">
<label class="form-label">Subject</label>
<select name="subject" class="form-select form-select-solid">
<option value="" selected hidden disabled>Select subject of your ticket</option>
@foreach($subjects as $subject)
<option value="{{ $subject->id }}">{{ $subject->name }}</option>
@endforeach
</select>
</div>