Как сделать, чтобы форма отправлялась в bootstrap 4

Question

Мне нужна помощь в создании этой формы. Мне нужно, чтобы отправить на мой адрес электронной почты.

У меня есть bootstrap.js, bootstrapjquery.js и popper.js

Я надеялся, что в нем будет что-то, что заставит форму отправляться без создания отдельной. JS файл. но если мне нужно, пожалуйста, не могли бы вы включить код JS. Я новичок в этом, делаю свой собственный местный сайт. Поэтому мне нужна вся помощь, которую я могу получить.

Заранее спасибо.

<!-- Newsletter -->

<section>
  <div class="container text-center">
    <div class="newsletter p-4">
      <form>
        <h5>Sign up to our newsletter</h5>
        <p>Recieve the lastest news and offers by signing up today.</p>
        <div class="form-group text-center">
          <label for="input-name" class="sr-only">Your Name:</label>
          <input type="text" class="form-control text-center" placeholder="full name" id="input-name">
        </div>
        <div class="form-group text-center">
          <label for="input-email" class="sr-only">Your Email:</label>
          <input type="email" class="form-control text-center" placeholder="mail@example.com" id="input-email">
        </div>
        <div class="form-check">
          <label class="form-check-label">
              <input type="checkbox" class="form-check-input" id="input-terms" value="terms">
              I have read and accept the <a href="#" data-toggle="modal" data-target="#modal"> terms and conditions.</a>
            </label>
        </div>
        <div>
          <small class="form-text">You can unsubscribe from the mailing list at anytime</small>
          <button type="submit" class="m-1 btn btn-light">SIGN UP</button>
        </div>
      </form>
      <div class="modal fade" id="modal" tabindex="-1" role="dialog" aria-labelledby="modalTitle" aria-hidden="true">
        <div class="modal-dialog modal-lg" role="document">
          <div class="modal-content">
            <div class="modal-header">
              <h5 class="modal-title" id="modalTitle">Terms and Conditions</h5>
              <button type="button" class="close" data-dismiss="modal" aria-label="close">
                    <span aria-hidden="true">&times;</span>
                  </button>
            </div>
            <div class="modal-body">
              <p> Bristol Plumber 24-7 do not sell or forward any personal information, we use highly reliable And stable service which is protected by the latest technology. We are unable like every other company to protect your information 100%, but we
                take this very seriously and have every form of protection in place to ensure all areas are covered and protected to our best ability.
              </p>
              <p> The only information we hold is your email and name, this is forward on only back to you or our system administrators for the marketing of our own products, offers and services. Under no circumstances would we ever give or use your details
                for third-party companies.
              </p>
              <p> Should you wish for your details to be removed from our system simple send an email to unsubscribe@bristolplumber247.co.uk, This process may take up to 48 hours. We promise not to spam and to only share information and offers that will benefit
                our customers.
              </p>
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-secondary" data-dismiss="modal">close</button>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>


<!-- NEWSLETTER END-->

Answer 1

вы можете использовать ajax для получения значения из формы и функции sendmail на серверной части

<script>

    $(function () {
        $('.m-1').attr('type', 'button');
        $('.m-1').click(function () {
            let val_check = $('#input-terms').is(":checked");
            if(val_check){
                let val_name = $('#input-name').val();
                let val_email = $('#input-email').val();
                $.ajax()
                $.ajax({
                    method: "POST",
                    url: "some.php",//url sendmail
                    data: { name: val_name, email: val_email }
                })
                .done(function( msg ) {
                    alert( "Data Saved: " + msg );
                });
            } else{
                alert('please accept the terms and conditions');
            }
        })
    });
</script>

Answer 2

В /url введите конечную точку внутренней службы, которая будет принимать ввод html-формы.

<html>
 <body>
 <form action="/url" method="post">
 </form>
</body>
</html>