ऑनक्लिक

Question

के साथ एक PHP फॉर्म सबमिट करना, इसलिए मेरे पास वर्तमान में एक डाउनलोड लिंक और मेरी वेबसाइट पर एक ईमेल पते के लिए एक इनपुट फ़ील्ड है।

फ़ाइल डाउनलोड करने के लिए आपको पहले अपना ईमेल डालना होगा।

मैं ऐसा करने के लिए एक फॉर्म का उपयोग करता हूं, ईमेल फ़ील्ड इनपुट फ़ील्ड और डाउनलोड बटन सबमिट बटन होने के साथ।

मुझे HTML5 के फॉर्म सत्यापन (आवश्यक फ़ील्ड, फ़ील्ड प्रकार इत्यादि पसंद हैं, यह सब बहुत अच्छा लग रहा है)।

समस्या यह है कि यदि मैं अपने सबमिट बटन पर क्लिक पर क्लिक करता हूं तो कोई भी अच्छा फॉर्म सत्यापन कार्य नहीं करता है।

<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> 

यह यह करने के लिए स्पष्ट तरीका नहीं हो सकता है, इसलिए कृपया अगर आपको लगता है कि आप एक बेहतर तरीका पता है मुझे बताओ :)

Answer 1

इस प्रयास करें का प्रयास करें:

<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> 

परिणाम:

Answer 2

इस कोड

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

नीचे काम कर कोड का टुकड़ा (एचटीएमएल 5 सत्यापन का उपयोग किए बिना) है। आप इसे चला सकते हैं और परीक्षण कर सकते हैं। मैंने jquery.validate प्लगइन के साथ jquery का उपयोग किया है। आप लक्षित यूआरएल पर उपयोगकर्ता को रीडायरेक्ट करने के लिए टिप्पणी कोड को असम्बद्ध कर सकते हैं। हमें बताएं कि क्या आप यह खोज रहे हैं या नहीं। अगर आप कुछ भी भ्रमित महसूस करते हैं तो टिप्पणी करने के लिए स्वतंत्र महसूस करें।

$(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>