anwi_website/dist/js/form.js

let formHTML = `  <!-- pop up -->
<!-- enquire-form pop up -->
<div class="modal fade style" id="enquireModal" tabindex="-1" role="dialog">
  <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable mx-md-3 mx-3 mx-lg-auto" role="document">
    <div class="wrap-contact100">
      
    <div class="modal-content contact100-form validate-form">
      <div class=" justify-content-center position-absolute btn" style="right:0;z-index:10;">
        <!-- <h5 class="modal-title" id="itemTitle"> </h5> -->
        <button type="button" class="close btn" data-bs-dismiss="modal" >
          <span >&times;</span>
        </button>
      </div>
       <div class="d-flex w-100">
      <div class="enquire-form-img col-md-6 col-lg-6 col-12 d-none d-lg-block d-md-block d-xl-block">
      <img class="h-100 img-fluid" src="../backups/anwi-old-website/assets/img/quote-image.png">
      </div>
  <div class="enquire-form position-relative col-12 col-md-6 col-lg-6 pt-lg-5 pt-md-5 pt-2 px-30">
  <div class="p-3">
     <div>
          <h3 class="contact-page-title">Request a Quote</h3>
    </div>
    <div>
    
                        <div id="pageloader" class="d-none">
                            <img src="http://cdnjs.cloudflare.com/ajax/libs/semantic-ui/0.16.1/images/loader-large.gif"
                                alt="processing..." />
                        </div>
    <form id="anwi-enquire-form" action="">
      <div class="form-floating">
        <input type="text" class="form-control" id="userName" name="name" placeholder="name@example.com"  required>
        <label for="name">Your Name</label>
      </div>
      <div class="form-floating">
        <input type="text" class="form-control" id="itemTitle" name="Title" placeholder="Password" disabled>
        <label for="name">Product</label>
      </div>
      <div class="form-floating ">
        <input type="email" class="form-control" id="floatingEmail" name="email" placeholder="name@example.com"  required>
        <label for="floatingEmail">Email address</label>
      </div>
      <div class="form-floating">
        <input type="number" class="form-control" id="floatingPhonenumber" name="phone" placeholder="Password"  required>
        <label for="floatingPhonenumber">Mobile No</label>
      </div>
      <div class="form-floating ">
        <input type="text" class="form-control" id="floatingSubject" name="subject" placeholder="name@example.com"  required>
        <label for="floatingSubject">Subject</label>
      </div>
      <div class="form-floating">
        <textarea name="contactMessage" class="form-control" id="contactMessage" name="message" placeholder="Your Message" required style="height:100px"></textarea>
        <label for="floatingPassword">Message</label>
      </div>
      <div class="form-floating text-center my-4">
        <button type="submit"  class="bg-black btn btn-lg text-white w-50" >
          submit
        </button>
      </div>
    </form>
    </div>
    </div>
  </div>
</div>
    </div>
    </div>
  </div>
</div>
<!-- end popup -->`;

$("#enquire").html(formHTML);
$(".close").on("click", function () {
    $("body").removeClass("open");
  });