What’s the best way to submit a form?

Asked

Viewed 38 times

1

Good morning,

I need to send the form that is completed, on the page I have several forms and I just have to send what will be completed. I wonder if the best way is to make each id for each form and also a php file for each form?

HTML:

<form class="head-quote-seguro" method="post">
    <p class="pclasse">formulario 1</p>
    <input type="hidden" nome="seguro" id="seguro" value="Seguro 1">
    <input type="text" class="form-control" name="quote-name" id="quote-name" placeholder="Nome" required />
    <input type="text" class="form-control" name="quote-name" id="quote-name" placeholder="Nome" required />
    <input type="email" class="form-control" name="quote-email" id="quote-email" placeholder="Email" required />
    <input type="text" class="form-control tel" name="quote-telephone" id="quote-telephone" placeholder="Telefone"
        required />
    <textarea class="form-control" name="quote-message" id="quote-message" placeholder="O que precisa?" rows="2"
        required></textarea>
    <button type="submit" class="btn btn-primary btn-black btn-block">Enviar</button>
    <!--Alert Message-->
    <div id="head-quote-result" class="mt-xs">
    </div>
</form>

<form class="head-quote-seguro" method="post">
    <p class="pclasse">formulario 2</p>
    <input type="hidden" nome="seguro" id="seguro" value="Seguro 2">
    <input type="text" class="form-control" name="quote-name" id="quote-name" placeholder="Nome" required />
    <input type="text" class="form-control" name="quote-name" id="quote-name" placeholder="Nome" required />
    <input type="email" class="form-control" name="quote-email" id="quote-email" placeholder="Email" required />
    <input type="text" class="form-control tel" name="quote-telephone" id="quote-telephone" placeholder="Telefone"
        required />
    <textarea class="form-control" name="quote-message" id="quote-message" placeholder="O que precisa?" rows="2"
        required></textarea>
    <button type="submit" class="btn btn-primary btn-black btn-block">Enviar</button>
    <!--Alert Message-->
    <div id="head-quote-result" class="mt-xs">
    </div>
</form>

SCRIPT:

$(function () {
    var frm = $(".head-quote-seguro");
    frm.submit(function (e) {
        $.ajax({
            type: "POST",
            url: "./form-seguros.php",
            data: frm.serialize(),
            success: function () {
                $(".head-quote-seguro").append("<div class='alert alert-success'><button type='button' class='close' data-dismiss='alert' aria-hidden='true'>×</button><i class='fa fa-thumbs-o-up'></i><strong>Obrigado!</strong> Sua mensagem foi enviada!</div>")
            }
        }), e.preventDefault()
    }), jQuery(".tap-title").each(function () {
        jQuery(this).on('click', function () {
            return jQuery(this).parent().parent().hasClass("toggle-accordion") ? (jQuery(this).parent().find("li:first .tap-title").addClass("active"), jQuery(this).parent().find("li:first .tap-title").next(".accordion-inner").addClass("active"), jQuery(this).toggleClass("active"), jQuery(this).next(".accordion-inner").slideToggle().toggleClass("active"), jQuery(this).find("i").toggleClass("fa-plus").toggleClass("fa-minus")) : jQuery(this).next().is(":hidden") ? (jQuery(this).parent().parent().find(".tap-title").removeClass("active").next().slideUp(200), jQuery(this).parent().parent().find(".tap-title").next().removeClass("active").slideUp(200), jQuery(this).toggleClass("active").next().slideDown(200), jQuery(this).next(".accordion-inner").toggleClass("active"), jQuery(this).parent().parent().find("i").removeClass("fa-minus").addClass("fa-plus"), jQuery(this).find("i").removeClass("fa-plus").addClass("fa-minus")) : (jQuery(this).toggleClass("active").next().slideToggle(200), jQuery(this).next(".accordion-inner").toggleClass("active"), jQuery(this).parent().parent().find("i").removeClass("fa-minus").addClass("fa-plus")), !1
        })
    });     
});


$(function () {
    var frm = $(".head-quote-form");
    frm.submit(function (e) {
        $.ajax({
            type: "POST",
            url: "./form-seguros.php",
            data: frm.serialize(),
            success: function () {
                $(".head-quote-form").append("<div class='alert alert-success'><button type='button' class='close' data-dismiss='alert' aria-hidden='true'>×</button><i class='fa fa-thumbs-o-up'></i><strong>Obrigado!</strong> Sua mensagem foi enviada!</div>")
            }
        }), e.preventDefault()
    }), jQuery(".tap-title").each(function () {
        jQuery(this).on('click', function () {
            return jQuery(this).parent().parent().hasClass("toggle-accordion") ? (jQuery(this).parent().find("li:first .tap-title").addClass("active"), jQuery(this).parent().find("li:first .tap-title").next(".accordion-inner").addClass("active"), jQuery(this).toggleClass("active"), jQuery(this).next(".accordion-inner").slideToggle().toggleClass("active"), jQuery(this).find("i").toggleClass("fa-plus").toggleClass("fa-minus")) : jQuery(this).next().is(":hidden") ? (jQuery(this).parent().parent().find(".tap-title").removeClass("active").next().slideUp(200), jQuery(this).parent().parent().find(".tap-title").next().removeClass("active").slideUp(200), jQuery(this).toggleClass("active").next().slideDown(200), jQuery(this).next(".accordion-inner").toggleClass("active"), jQuery(this).parent().parent().find("i").removeClass("fa-minus").addClass("fa-plus"), jQuery(this).find("i").removeClass("fa-plus").addClass("fa-minus")) : (jQuery(this).toggleClass("active").next().slideToggle(200), jQuery(this).next(".accordion-inner").toggleClass("active"), jQuery(this).parent().parent().find("i").removeClass("fa-minus").addClass("fa-plus")), !1
        })
    });     
});

PHP:

<script language= "JavaScript">
setTimeout("document.location = http://ninerscorretora.com.br",1000);
</script>

    <?php
    // Check for empty fields
    if(empty($_POST['quote-name']) || empty($_POST['quote-telephone']) || empty($_POST['quote-message']) || empty($_POST['quote-email']) || !filter_var($_POST['quote-email'],FILTER_VALIDATE_EMAIL)){
        echo json_encode(array('error'=>'true'));
        return false;
    }

    $seguro = $_POST['seguro'];
    $nome = $_POST['quote-name'];
    $email = $_POST['quote-email'];
    $telefone = $_POST['quote-telephone'];
    $mensagem = $POST['quote-message'];

    $subject = ($_POST['subject'] ? $_POST['subject'] : "Novo envio de formulário de contato");


    // Create the email and send the message
    $to = '[email protected]';// Add your email address inbetween the '' replacing [email protected] - This is where the form will send a message to.
    $email_subject = $subject;
    $email_body = "Tipo de seguro: $seguro <br><br>
                Nome: $nome <br><br>
                E-mail: $email <br><br>
                Telefone: $telefone <br><br>
                Mensagem: $mensagem";
    $headers = "MIME-Version: 1.1\r\n".
        "Content-type: text/html; charset=utf-8\r\n".
        "Content-Transfer-Encoding: 8bit\r\n".
        "From: ". $_POST['quote-name'] ." <". $_POST['quote-email'] .">\r\n".
        "Reply-to: ". $_POST['quote-name'] ." <". $_POST['quote-email'] .">\r\n".
        "Date: ". date( "r" );
    mail($to,$email_subject,$email_body,$headers);
    echo json_encode(array('Mensagem enviada com sucesso'));
    return true;            
    ?>
  • If I may, what is the need for 2 forms? their content is different? could not put everything in a single no?

  • yes, it is one for each insurance, there are several on the page, if you want to check it out, http://ninerscorretora.com.br/para_voce.html

1 answer

0


I think there are several ways to do this, I prefer it this way:

<!-- form 1 -->    
<form class="head-quote-seguro" method="post" action="./form-seguros.php?form=Seguro1">
<!-- form 2 -->    
<form class="head-quote-seguro" method="post" action="./form-seguros.php?form=Seguro2">

continues using the "head-quote-safe" class, only it adds the actions that will be called in JS, like this:

$.ajax({
            type: frm.attr("method"),
            url: frm.attr("action"),
            data: frm.serialize(),
            success: function (data) {
//evento quando funciona
}})

there in the same PHP you can take the respective $_GET to separate the forms or use different urls in the action (I particularly prefer to make separate php Submit files for each form).

Cool? I hope I helped. I use it a lot here at www.ecowebdesign.com.br

Abs

  • I understood, so here on this page http://ninerscorretora.com.br/para_voce.html that has many forms, one for each box, it is good to do so?

  • That’s it, makes the JS unique calling the "action" as I showed and each modal will have its <form>. It seems that there is little variation between the fields, in this case I would have a single Submit.php; I separate when the forms are very different.

  • Blz, thank you very much.

  • It is nuts. If it is possible to give some Thumbs up there. Abs and good luck

Browser other questions tagged

You are not signed in. Login or sign up in order to post.