Cannot submit a form in jquery - php

I am using jquery smarty, php. I am validating a form using jquery but the submit button is not working.
In checkemail.php I am echoing no of rows;
$(document).ready(function() { //newly added
$("#formpge").submit(function(event) {
event.preventDefault();
var emailVal = $('#useremail').val();
alert(emailVal);
// assuming this is a input text field
$.post("checkemail.php", {
"useremail": emailVal
}, function(data) {
alert(data);
if (data == 0) {
alert("has to be added");
$("#formpge")[0].submit();
} else
$("#useremail").focus();
});
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form id="formpge" name="frmadduser" method="post">
<div class="input1">
<input type="text" placeholder="Your Full Name" id="username" name="username">
</div>
<div class="input2">
<input type="text" placeholder="Your Email Address" id="useremail" name="useremail">
<p color="blue" id="emailexist"></p>
</div>
<div class="input1">
<input type="hidden" value="Y" name="active">
</div>
<div class="clear"></div>
<div class="iwant_text2">
<input type="submit" id="formsubmit" name="formsubmit" value="I Want One!">
</div>
</form>

try this code its working: -
<form id="formpge" name="frmadduser" method="post">
<div class="input1">
<input type="text" placeholder="Your Full Name" id="username" name="username">
</div>
<div class="input2">
<input type="text" placeholder="Your Email Address" id="useremail" name="useremail">
<p color="blue" id="emailexist"></p>
</div>
<div class="input1">
<input type="hidden" value="Y" name="active">
</div>
<div class="clear"></div>
<div class="iwant_text2">
<input type="submit" id="formsubmit" name="formsubmit" value="I Want One!" >
</div>
</form>
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script>
$(document).ready(function(){ //newly added
$("#formpge").submit(function(event) {
event.preventDefault();
var emailVal = $('#useremail').val();
alert(emailVal);
// assuming this is a input text field
$.post("checkemail.php", {"useremail" : emailVal}, function(data) {
alert(data);
if(data == 0){
alert("has to be added");
$("#formpge")[0].submit();
}
else
$("#useremail").focus();
});
});
});
</script>
try fiddle here

First of all thanks to mplungjan, Gaurav Srivastava andStarscream1984. The problem is, in checkemail.php I checked isset($_REQUEST['formsubmit'], but this is not set only the text fields are set. I dont know why type submit is not set.
Again, Thanks.

Related

Why is my AJAX call in jQuery not working?

What am I trying to achieve:
After form is being filled-out and submit button being clicked, I want to be able to submit form and do an AJAX call - payment.php file (I did integration of PayPal, I am sending following values via mail firstname, surname, email, phone, number, date of birth, CV, photo, etc...) and I am also trying to store it into the database.
Where am I failing at?
This is multiple-step form, the problem is occuring when I get to the last step of filling-out form and by clicking "Submit" button nothing happens - my AJAX call is not working...
My jQuery code:
$(document).ready(function(){
var current_fs, next_fs, previous_fs; //fieldsets
var opacity;
var current = 1;
var steps = $("fieldset").length;
setProgressBar(current);
$(".next").click(function(){
current_fs = $(this).parent();
next_fs = $(this).parent().next();
//Add Class Active
$("#progressbar li").eq($("fieldset").index(next_fs)).addClass("active");
//show the next fieldset
next_fs.show();
//hide the current fieldset with style
current_fs.animate({opacity: 0}, {
step: function(now) {
// for making fielset appear animation
opacity = 1 - now;
current_fs.css({
'display': 'none',
'position': 'relative'
});
next_fs.css({'opacity': opacity});
},
duration: 500
});
setProgressBar(++current);
});
$(".previous").click(function(){
current_fs = $(this).parent();
previous_fs = $(this).parent().prev();
//Remove class active
$("#progressbar li").eq($("fieldset").index(current_fs)).removeClass("active");
//show the previous fieldset
previous_fs.show();
//hide the current fieldset with style
current_fs.animate({opacity: 0}, {
step: function(now) {
// for making fielset appear animation
opacity = 1 - now;
current_fs.css({
'display': 'none',
'position': 'relative'
});
previous_fs.css({'opacity': opacity});
},
duration: 500
});
setProgressBar(--current);
});
function setProgressBar(curStep){
var percent = parseFloat(100 / steps) * curStep;
percent = percent.toFixed();
$(".progress-bar")
.css("width",percent+"%")
}
$(".submit").click(function(){
var request;
//moj kod
event.preventDefault();
// Abort any pending request
if (request) {
request.abort();
}
// setup some local variables
var $form = $("#msform");
// Let's select and cache all the fields
var $inputs = $form.find("input, select, button, textarea");
// Serialize the data in the form
var serializedData = $form.serialize();
// Let's disable the inputs for the duration of the Ajax request.
// Note: we disable elements AFTER the form data has been serialized.
// Disabled form elements will not be serialized.
$inputs.prop("disabled", true);
// Fire off the request to /form.php
request = $.ajax({
url: "payment.php",
type: "post",
data: serializedData
});
// Callback handler that will be called on success
request.done(function (response, textStatus, jqXHR){
// Log a message to the console
console.log("Request uspjeĆĄno poslat!");
});
// Callback handler that will be called on failure
request.fail(function (jqXHR, textStatus, errorThrown){
// Log the error to the console
console.log(JSON.stringify(errorThrown));
console.error(
"Desio se sljedeci error: "+
textStatus, errorThrown
);
});
// Callback handler that will be called regardless
// if the request failed or succeeded
request.always(function () {
// Reenable the inputs
$inputs.prop("disabled", false);
});
//moj kod ->end
return false;
})
});
This is jQuery code (obviously) - and here I am handling the form and its data (at least it's what I intended to do with it)
This is form inside of HTML:
<form class="paypal" action="payment.php" method="post" name="Form" id="msform">
<?php
$paket = $_GET['paket'];
if($paket == "standard")
{
?>
<input type="hidden" name="standard" value="standard">
<input type="hidden" name="item_number" value="1">
<?php
}
else if($paket == "bewerbungscheck")
{
?> <input type="hidden" name="bewerbungscheck" value="bewerbungscheck">
<input type="hidden" name="item_number" value="2">
<?php
}
else if($paket == "premium")
{
?> <input type="hidden" name="premium" value="premium">
<input type="hidden" name="item_number" value="3">
<?php
}
else if($paket == "lowbudget")
{
?>
<input type="hidden" name="lowbudget" value="lowbudget">
<input type="hidden" name="item_number" value="4">
<?php
}
else{
echo "There's no package with this name, please go back and choose again, wisely!";
?>
<button class="btn">
Go Back
</button>
<?php
exit();
}
?>
<!-- progressbar -->
<ul id="progressbar">
<li class="active" id="account"><strong>Personal Info</strong></li>
<li id="personal"><strong>Appointment</strong></li>
<li id="payment"><strong>Documents</strong></li>
<li id="confirm"><strong>Finish</strong></li>
</ul>
<div class="progress">
<div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar"
aria-valuemin="0" aria-valuemax="100"></div>
</div>
<br>
<!-- fieldsets -->
<fieldset>
<div class="form-card">
<div class="row">
<div class="col-7">
<h2 class="fs-title">Personal Information:</h2>
</div>
<div class="col-5">
<h2 class="steps">Step 1 - 4</h2>
</div>
</div>
<!-- FOR PAYPAL -->
<input type="hidden" name="cmd" value="_xclick" />
<input type="hidden" name="no_note" value="1" />
<input type="hidden" name="lc" value="DE" />
<input type="hidden" name="bn" value="PP-BuyNowBF:btn_buynow_LG.gif:NonHostedGuest" />
<input type="hidden" id="first_name" name="first_name" value="Customer's First Name" />
<input type="hidden" id="last_name" name="last_name" value="Customer's Last Name" />
<input type="hidden" id="payer_email" name="payer_email" value="customer#example.com" />
<!-- END OF SECTION FOR PAYPAL -->
<label class="fieldlabels">Email: *</label>
<input id="email" type="email" name="email" placeholder="example#meinegutebewerbung.de" />
<label class="fieldlabels">Name: *</label>
<input id="fn" type="text" name="uname" placeholder="Name" />
<label class="fieldlabels">Surname: *</label>
<input id="sur" type="text" name="usur" placeholder="Surname" />
<label class="fieldlabels">Expertised in: *</label>
<input type="text" name="expert" placeholder="ex.:Bachelor in Computer science" />
<label class="fieldlabels">Phone number: *</label>
<input type="tel" name="phone" placeholder="+000000000000000" />
<label class="fieldlabels">Birth Date: *</label>
<input type="date" name="date" placeholder="Date" />
</div>
<input type="button" name="next" onclick="populate()" class="next action-button"
value="Next" />
</fieldset>
<fieldset>
<div class="form-card">
<div class="row">
<div class="col-7">
<h2 class="fs-title">Appointment details:</h2>
</div>
<div class="col-5">
<h2 class="steps">Step 2 - 4</h2>
</div>
</div>
<label class="fieldlabels">Select appointment date: *</label>
<input id="date_picker" type="date" name="date-res" />
<label class="fieldlabels">Which time span is the most fitting for you: *</label> <br>
<select name="suitabletime " id="suitable">
<option value="09-14">09:00 - 14:00</option>
<option value="14-20">14:00 - 20:00</option>
</select>
</div>
<input type="button" name="next" class="next action-button" value="Next" />
<input type="button" name="previous" class="previous action-button-previous"
value="Previous" />
</fieldset>
<fieldset>
<div class="form-card">
<div class="row">
<div class="col-7">
<h2 class="fs-title">Upload documents:</h2>
</div>
<div class="col-5">
<h2 class="steps">Step 3 - 4</h2>
</div>
</div>
<label class="fieldlabels">Upload Your Photo:</label>
<input type="file" name="pic" accept="image/*">
<label class="fieldlabels">Upload CV (must be PDF):</label>
<input type="file" name="pic" accept=".pdf">
</div>
<input type="button" name="next" class="next action-button" value="Submit" />
<input type="button" name="previous" class="previous action-button-previous"
value="Previous" />
</fieldset>
<fieldset>
<div class="form-card">
<div class="row">
<div class="col-7">
<h2 class="fs-title">Finish:</h2>
</div>
<div class="col-5">
<h2 class="steps">Step 4 - 4</h2>
</div>
</div>
<br><br>
<h2 class="purple-text text-center"><strong>SUCCESS !</strong></h2>
<br>
<div class="row justify-content-center">
<div class="col-3">
<img src="https://i.imgur.com/GwStPmg.png" class="fit-image">
</div>
</div>
<br><br>
<div class="row justify-content-center">
<div class="col-7 text-center">
<h5 class="purple-text text-center">You Have Successfully Signed Up</h5>
</div>
</div>
</div>
</fieldset>
</form>
How did I came to conclusion that this is not working?
I have actually inserted console.log() so I can get some output after the code is executed, but I am not getting anything. The second thing is that I also setted up PHP to do echo and again I am not getting anything.
As #kikon already stated inside of the comments, the problem was that I did not put the class="submit" as a attribute to the <button>, therefore element with the class of submit didn't exist, so the jQuery couldn't trigger the code inside of the function for AJAX.

How can I send a form with jQuery

I need to code an AJAX request with jQuery (3.2.1) and display email input value after the form was sended.
When I click on submit button, i have this following message, I didn't understand what is wrong with my code.
<form action="process.php" method="post" id="myForm">
<div class="form-line">
<input type="email" name="emailaddress" id="emailaddress" />
</div>
<div id="emailMsg"></div>
<div class="form-line">
<input type="password" name="psw" id="password" />
<button type="submit" id="submit"><span>OK</span></button>
</div>
<div id="passMsg"></div>
</form>
And this is what i have done on jQuery code
$("#myForm").on('submit',function(e) {
e.preventDefault();
var email = $("#emailaddress").val();
$.post("../process.php", {
emailaddress:emailaddress
}, function(response) {
$("#connexion-rollover").html(email);
});
});
I have also create this PHP file to add this code
<?php
echo $_POST['emailaddress'];
?>
I hope that my first message on this site was clear.

Ajax request is retrieving an empy array in PHP

I have a "form" with this code:
<div class="form-wrap" id="contact-form">
<div class="form-innerwrap">
<div class="text-input">
<input type="text" name="name" id="name" required />
<label for="name"><?= CONTACT_FORM_NAME ?></label>
</div>
<div class="text-input">
<input type="email" name="email" id="email" pattern="[a-z0-9._%+-]+#[a-z0-9.-]+\.[a-z]{2,4}$" required />
<label for="email">E-mail</label>
</div>
<div class="text-input">
<input type="text" name="contact" id="contact" required />
<label for="name"><?= CONTACT ?></label>
</div>
<div class="text-input text-textarea">
<textarea type="info" id="info" name="info">
</textarea>
<label for="email"><?= CONTACT_FORM_MENSSAGE ?></label>
</div>
<input type="hidden" name="lang" id="lang" value="<?= $_SESSION['language'] ?>">
<div class="form-button">
<button type="submit" class="btn contacts-button btn-gowe" id="btn-info" data-btnhover="<?= CONTACT_FORM_BTN ?>"> <span><?= CONTACT_FORM_BTN ?></span> </button>
</div>
</div>
</div>
Then I have a ajax request to sent the input values to php:
$("#btn-info").click(function(){
var name = $("#name").val();
var email = $("#email").val();
var contact = $("#contact").val();
var info = $("#info").val();
var lang = $("#lang").val();
// Returns successful data submission message when the entered information is stored in database.
var dataString = 'name='+ name + '&email='+ email +'&contact='+contact+'&info='+info+'&lang='+lang;
$.ajax({
type: "POST",
url: "includes/sendEmail.php",
data: dataString,
cache: false,
success: function(result){
var result = result.split("||");
if (result[0]== "true"){
$("#contact-modal").show();
}
}
});
return false;
});
However when I make a var_dump of $REQUEST the return is an empty array.
Can anyone help me with this problem?
I had already spent several hours to try to understand what is wrong in my code.
Thanks for helping.

In jquery form validation ajax not responding

I am trying to validate my code with jquery. Its working but when it come to ajax it not loading any page. Rather my path is wrong or something other. Please help me to solve this.
this is my view file
admin_view.php
<?php include('assets/header.php'); ?>
<div class="container">
<h1>Welcome to Admin Login</h1>
<?if($this->session->flashdata('flashError')):?>
<p class='flashMsg flashError'>
<?= $this->session->flashdata('flashError') ?> </p>
<?endif?>
<!-- new line inserted -->
<form method="post" name="myForm" accept-charset="utf-8" class="login" id="form" >
<div class="form-group">
<div class="col-xs-4">
<!--<label for="admin">Admin</label>
<input type="text" name="admin" class="form-control" id="admin" value="" placeholder="admin name" />-->
Admin Name: <input type="text" name="admin" id="admin" class="form-control" value="<?php echo set_value('admin'); ?>" placeholder="admin name" >
<?php echo form_error("admin"); ?>
<p id='p1'></p>
<br>
<!-- <label for="password">password</label>
<input type="text" name="password" class="form-control" id="password" value="" placeholder="password" required/>
-->
Admin Password: <input type="password" name="password" id="password" class="form-control" value="" placeholder="password" >
<?php echo form_error("password"); ?>
<p id='p2'></p>
<br>
<br>
<input type="button" name="submit" value="submit" id="submit" class="btn btn-primary" >
</div>
</div>
<div class="error"></div>
</form>
</div>
<script>
$(document).ready(function () {
$("#submit").click(function () {
var admin = $("#admin").val();
var password = $("#password").val();
$("#returnmessage").empty(); // To empty previous error/success message.
// Checking for blank fields.
if (admin == '')
{
$('div.error').html("Please Fill Admin Required Fields");
} else if (password == '')
{
$('div.error').html("Please Fill Password Required Fields");
} else
{//alert('hello world');
// Returns successful data submission message when the entered information is stored in database.
$.ajax({
type: "POST",
url: "<?php base_url() ?>index.php/admin_login/login",
data: {"admin": admin, "password": password},
dataType: "json"
}).done(function (data) {
if (data.error != "")
{
//alert('hello if');
$('div.error').html(data.error);
} else
{
// alert('hello else');
window.location.href="admin_view";
}
});
}
});
});
</script>
<?php include('assets/footer.php'); ?>
You have provide wrong path to ajax url,
url: "<?php base_url() ?>index.php/admin_login/login"
this statement will not works directly, because <?php base_url() ?> is a php statement and you are using this in javascript, this is not acceptable.
use like this:
<script type="text/javascript">var path= "<?php echo base_url();?>";</script>
Write this statement in your head section,this statement will define your base url to path variable, which is a javascript variable and you can use it in your javascript code.
then append url like:
url: path+"/index.php/admin_login/login",
hope this will help to you.

Form validation before Submit

I have the following form that needs to feed into the database but I would like it to be validated before it can be saved into the database :
<form name="add_walkin_patient_form" class="add_walkin_patient_form" id="add_walkin_patient_form" autocomplete="off" >
<div class="form-line">
<div class="control-group">
<label class="control-label">
Patient Name
</label>
<div class="controls">
<input type="text" name="patientname" id="patientname" required="" value=""/>
</div>
</div>
<div class="control-group">
<label class="control-label">
Patient Phone Number
</label>
<div class="controls">
<input type="text" name="patient_phone" id="patient_phone" required="" value=""/>
</div>
</div>
<div class="control-group">
<label class="control-label">
Department
</label>
<div class="controls">
<select name="department" required="" class="department" id="department">
<option value="">Please select : </option>
<option value="Pharmacy">Pharmacy</option>
<option value="Laboratory">Laboratory</option>
<option value="Nurse">Nurse</option>
</select>
</div>
</div>
</div>
<button name="add_walkin_patient_button" type="submit" id="add_walkin_patient_button" class="btn add_walkin_patient_button btn-info pull-right">
Add Walk In Patient
</button>
</form>
And the submit is done by a jquery script using the following script :
<script type="text/javascript">
$(document).ready(function () {
//delegated submit handlers for the forms inside the table
$('#add_walkin_patient_button').on('click', function (e) {
e.preventDefault();
//read the form data ans submit it to someurl
$.post('<?php echo base_url() ?>index.php/reception/add_walkin', $('#add_walkin_patient_form').serialize(), function () {
//success do something
// $.notify("New Patient Added Succesfully", "success",{ position:"left" });
$(".add_walkin_patient_form").notify(
"New Walkin Patient Added Successfully",
"success",
{position: "center"}
);
setInterval(function () {
var url = "<?php echo base_url() ?>index.php/reception/";
$(location).attr('href', url);
}, 3000);
}).fail(function () {
//error do something
$(".add_walkin_patient_form").notify(
"There was an error please try again later or contact the system support desk for assistance",
"error",
{position: "center"}
);
})
})
});
</script>
How can I put form validation to check if input is empty before submitting it into the script?
I am using javascript to do the validations.
Following is the form code:
<form action="upload.php" method="post" onSubmit="return validateForm()">
<input type="text" id="username">
<input type="text" password="password">
<input type="submit" value='Login' name='login'>
</form>
To perform validation write a javascript function:
<script>
function checkform(){
var uname= document.getElementById("username").value.trim().toUpperCase();
if(uname=== '' || uname=== null) {
alert("Username is blank");
document.getElementById("username").backgroundColor = "#ff6666";
return false;
}else document.getElementById("username").backgroundColor = "white";
var pass= document.getElementById("password").value.trim().toUpperCase();
if(pass=== '' || pass=== null) {
alert("Password is blank");
document.getElementById("password").backgroundColor = "#ff6666";
return false;
}else document.getElementById("password").backgroundColor = "white";
return true;
}
</script>
You are using,
<button name="add_walkin_patient_button" type="submit" id="add_walkin_patient_button" class="btn add_walkin_patient_button btn-info pull-right">
Add Walk In Patient
</button>
Here, submit button is used for submitting a form and will never trigger click event. Because, submit will be triggered first thus causing the click event skip.
$('#add_walkin_patient_button').on('click', function (e) {
This would have worked if you have used normal button instead of submit button
<input type="button">Submit</button>
Now to the problem. There are two solution for it ,
If you use click event, then you should manually trigger submit on correct validation case,
<input type="button" id="add_walkin_patient_button">Submit</button>
//JS :
$("#add_walkin_patient_button").click(function() {
if(valid){
$("#form-id").submit();
}
Another option is to use submit event;which is triggered just after you click submit button. Here you need to either allow form submit or halt it based on your validation criteria,
$("#form-id").submit(function(){
if(invalid){
//Suppress form submit
return false;
}else{
return true;
}
});
P.S
And i would recommend you to use jQuery Validate as suggested by #sherin-mathew
make a javascript validation method (say, validateForm(), with bool return type). add [onsubmit="return validateForm()"] attribute to your form and you are done.
You need to prevent default action.
$('#add_walkin_patient_form').on('submit', function(e) {
e.preventDefault();
//Validate form and submit
});
<html>
<head>
<title></title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!-- Popper JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
</head>
<body>
<style>
#first{
display: none;
}
</style>
<div class="container"><br>
<div class="col-lg-6 m-auto d-block">
<form action="" method="" onsubmit="return validation()" class="bg-light">
<div class="form-group">
<label for="">Title</label>
<span class="text-danger">*</span>
<!-- <input class="form-control" type="text" > -->
<select name="title" id="title" class="form-control" >
<option value=""class="form-control" >Select</option>
<option value="Mr" class="form-control">Mr</option>
<option value="Mrs" class="form-control">Mrs</option>
</select>
<span id="tit" class="text-danger font-weight-bold"> </span>
</div>
<div class="form-group">
<div class="row">
<div class="col">
<label for="firstName">FirstName</label>
<span class="text-danger">*</span>
<input type="text" class="form-control" placeholder="First name" id="firstName" >
<span id="first" class="text-danger font-weight-bold"> </span>
</div>
<div class="col">
<label for="lastName">LastName</label>
<span class="text-danger">*</span>
<input type="text" class="form-control" placeholder="Last name" id="lastName">
<span id="last" class="text-danger font-weight-bold"> </span>
</div>
</div>
</div>
<div class="form-group">
<label for="email">Your Email</label>
<span class="text-danger">*</span>
<input type="text" class="form-control" placeholder="Email" id="email">
<span id="fillemail" class="text-danger font-weight-bold"> </span>
</div>
<div class="form-group">
<label for="contact">Your Contact</label>
<span class="text-danger">*</span>
<input type="text" class="form-control" placeholder="Contact Number" id="contact">
<span id="con" class="text-danger font-weight-bold"> </span>
</div>
<div class="form-group">
<label for="password">Your Password</label>
<span class="text-danger">*</span>
<input type="text" class="form-control" placeholder="Password" id="password">
<span id="pass" class="text-danger font-weight-bold"> </span>
</div>
<div class="form-group">
<label for="conPassword">Confirm Password</label>
<span class="text-danger">*</span>
<input type="text" class="form-control" placeholder="Password" id="conPassword">
<span id="conPass" class="text-danger font-weight-bold"> </span>
</div>
<div class="checkbox">
<label><input type="checkbox"> I accept Terms and Conditions</label>
</div>
<div class="checkbox">
<label><input type="checkbox"> I agree to recieve Email Terms and Conditions</label>
</div>
<div class="checkbox">
<label><input type="checkbox"> I agree to recieve SMS Terms and Conditions</label>
</div>
<input type="submit" name="submit" value="SignUp" id="signUp" class="btn btn-success" autocomplete="off">
</form><br><br>
</div>
</div>
<script type="text/javascript">
function validation(){
var title = document.getElementById('title').value;
var firstName = document.getElementById('firstName').value;
var email=document.getElementById('email').value;
var contact=document.getElementById('contact').value;
var password=document.getElementById('password').value;
var conPassword=document.getElementById('conPassword').value;
var signBut=document.getElementById('signUp');
console.log(firstName);
if(title == ""){
document.getElementById("tit").innerHTML =" Please select the title feild first field";
return false;
}
// if(firstName == "" & firstName.length<=3){
// document.getElementById("first").innerHTML =" Please Enter First Name";
// return false;
// document.getElementById("signUp").addEventListener("click", function(event){
// event.preventDefault()
// });
// }
signBut.addEventListener('click',function(e){
if(firstName=="" & firstName<3)
{
document.getElementById("first").innerHTML="Please Enter proper Name";
e.preventDefault();
}
},false);
if(lastName == ""){
document.getElementById("last").innerHTML =" Please Enter Last Name";
return false;
}
else if(email ==""){
document.getElementById("fillemail").innerHTML="Please Enter Email";
}
else if(contact ==""){
document.getElementById("con").innerHTML="Please Enter Your Contact";
}
else if(password ==""){
document.getElementById("pass").innerHTML="Please Enter Your Password";
}
else if(conPassword ==""){
document.getElementById("conPass").innerHTML="Please Confirm Password";
}
}
</script>
</body>
</html>
I think you should use type button
and then eventClick function of jquery

Categories