Download anchor validation

2

Next,IneedtovalidatethisformsothatonlyafterthepersonregisterscanIdownloadthefile.WiththetagIcanalreadyhavethisvalidationbutImanagedtoputittodownloadonlywiththetag"ancora".

<section id="e-book">
    <header>
        <h3>Baixe nosso e-book</h3>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod<p>
    </header>
    <form id="for-banner" class="form-inline">
      <div class="form-group">
        <label for="exampleInputName2"></label>
        <input type="text" class="form-control" id="exampleInputName2" placeholder="Nome Completo" required>
      </div>
      <div class="form-group">
            <label for="exampleInputEmail2"></label>
            <input type="email" class="form-control" id="exampleInputEmail2"    placeholder="E-mail Corporativo" required>
        </div>
    <div>
        <a href="/e-book/teste-ebook.pdf" download id="btn-ebook" type="submit" class="btn btn-default">Download</a>
    </div>
    </form>
</section>
    
asked by anonymous 06.10.2017 / 20:20

2 answers

1

If it goes to register, it means that you are going to have a back involved, having this in mind, you just have to send% return% and verify, Ex:

document.getElementById('btn-ebook').onclick = function(){
   // Aqui teria seu ajax, ex utilizando axios
   axios.post('SUA URL', {
      // PARAMS
   })
   .then(response => {
      // vamos supor que sua api tenha retornado o ok, e a URL
      if(response.status == 1){
        window.open(response.url, "_SELF")
      }else{
        alert('Você precisa se cadastrar antes')
      }
   })
   .catch(error => {
      console.log(error)
   })
}
<section id="e-book">
    <header>
        <h3>Baixe nosso e-book</h3>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod<p>
    </header>
    <form id="for-banner" class="form-inline">
      <div class="form-group">
        <label for="exampleInputName2"></label>
        <input type="text" class="form-control" id="exampleInputName2" placeholder="Nome Completo" required>
      </div>
      <div class="form-group">
            <label for="exampleInputEmail2"></label>
            <input type="email" class="form-control" id="exampleInputEmail2"    placeholder="E-mail Corporativo" required>
        </div>
    <div>
        <a href="#" download id="btn-ebook" class="btn btn-default">Download</a>
    </div>
    </form>
</section>

And in this way, you would have your validation.

    
06.10.2017 / 20:35
0

Personally I managed to solve it differently instead of downloading the e-book I placed to access it online with the following code:

<section id="e-book"> <header> <h3>Acesse nosso e-book</h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod<p> </header> <form method="post" action="images/Instalação do Microsoft SQL Server 2014 Express.pdf" download id="for-banner" class="form-inline" target="_blank"> <div class="form-group"> <label for="exampleInputName2"></label> <input type="hidden" name="ipaddress" id="ipaddress" value="<?= $user_ip; ?>"> <input type="text" class="form-control" id="exampleInputName2" name="nome2" placeholder="Nome Completo" required> </div> <div class="form-group"> <label for="exampleInputEmail2"></label> <input type="email" class="form-control" id="exampleInputEmail2" name="email2" placeholder="E-mail Corporativo" required> </div> <div> <button id="btn-ebook" type="submit" class="btn btn-default"> acessar agora </button> </div> </form> </section>

In this way, the user will only be able to access the e-book if they register. Thank you all.

    
06.10.2017 / 22:21