Bir PHP formu onClick ile gönderme

Question

Şu anda web sitemde bir e-posta adresi için bir indirme linki ve giriş alanı var.

Dosyayı indirmek için öncelikle e-postanızı koymanız gerekir.

Bunu yapmak için bir form kullanıyorum, e-posta alanı bir giriş alanı ve indirme düğmesi bir gönderme düğmesi.

HTML5'in form doğrulamasını seviyorum (gerekli alanlar, alan türleri vb. Hepsi çok hoş görünüyor).

Sorun şu ki, gönder düğmemde onClick'i kullanırsam, form doğrulamasının hiçbiri işe yaramaz.

<form> 
    <input type="email" id="email" placeholder="Please enter email" required> 

    <input type="submit" class="btn" onclick="downloadWin()" value="Windows"> 
    <input type="submit" class="btn" onclick="downloadOsx()" value="Osx"> 
</form> 


<script> 
    function downloadWin(){ 
     event.preventDefault(); 
     var email = $("#email").val(); 
     if(email != ''){ 
      if(validateEmail(email)){ 
       location.href='http://s/index.php?page=downloadWin&email='+email; 
      } 
     } 
    } 

    function downloadOsx(){ 
     event.preventDefault(); 
     var email = $("#email").val(); 
     if(email != ''){ 
      if(validateEmail(email)){ 
       location.href='http://s/index.php?page=downloadOsx&email='+email; 
      } 
     } 
    } 

</script> 

Bu

sizce eğer öyleyse sen söyle :)

Answer 1

bu deneyin deneyin daha iyi bir yol biliyorum lütfen, bunu yapmak için en temiz yolu olmayabilir:

<form onsubmit="download(this.email.value,this.system.value)" id="form"> 
    <input type="email" id="email" name="email" placeholder="Please enter email" required> 
    <input type="radio" name="system" value="Win" required >Windows 
    <input type="radio" name="system" value="Osx" >Osx 
    <input type="submit" class="btn" value="Download"> 
</form> 

<script type="text/javascript"> 
document.getElementById("form").addEventListener("submit", function(event){ 
    event.preventDefault(); 
}); 

function download(email_value,sys_value){ 
    location.href='http://s/index.php?page=download'+sys_value+'&email='+email_value; 
} 
</script> 

Sonuç:

Answer 2

Bu kodu

function validateEmail(email) { 
    var re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; 
    return re.test(email); 
} 
function downloadWin() { 
    var email = $("#email").val(); 
    if (email != '') { 
     if (validateEmail(email)) { 
      location.href = 'http://s/index.php?page=downloadWin&email=' + email; 
     } 
    } 
    return false; 
} 

function downloadOsx() { 
    var email = $("#email").val(); 
    if (email != '') { 
     if (validateEmail(email)) { 
      location.href = 'http://s/index.php?page=downloadOsx&email=' + email; 
     } 
    } 
    return false; 
} 

Answer 3

altında (HTML5 doğrulama kullanmadan) çalışma kodu snippet'idir. Koşup test edebilirsiniz. jquery'u jquery.validate eklentisiyle kullanmıştım. Kullanıcıyı hedef URL'ye yönlendirmek için yorumlanmış kodu kaldırabilirsiniz. Aradığınızı veya aradığınız şeyi bize bildirin. Kafa karıştırıcı hissettiğiniz bir şey varsa yorum yapmaktan çekinmeyin.

$(document).ready(function(){ 
 
    $(".btn-download").on("click", function(e) { 
 
    \t \t e.preventDefault(); 
 
     e.stopImmediatePropagation(); 
 
     \t if ($("#validateForm").valid()) { 
 
      var name = $(this).val(); 
 
      var email = $("#email").val(); 
 

 
      if (name === "Windows") { 
 
       //location.href = 'http://s/index.php?page=downloadWin&email=' + email; 
 
       console.log('http://s/index.php?page=downloadWin&email=' + email); 
 
      } 
 

 
      if (name === "Osx") { 
 
       console.log('http://s/index.php?page=downloadOsx&email=' + email); 
 
       //location.href = 'http://s/index.php?page=downloadOsx&email=' + email; 
 
      } 
 
     }    
 

 
    }); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.15.1/jquery.validate.min.js"></script> 
 
<form method="post" action="" id="validateForm" novalidate> 
 
    <input type="email" id="email" placeholder="Please enter email" required> 
 
    <input type="submit" name="btnSubmit" class="btn btn-download" value="Windows"> 
 
    <input type="submit" name="btnSubmit" class="btn btn-download" value="Osx"> 
 
</form>