Total members 11872 |It is currently Thu Jan 26, 2023 5:29 pm Login / Join Codemiles

Java

C/C++

PHP

C#

HTML

CSS

ASP

Javascript

JQuery

AJAX

XSD

Python

Matlab

R Scripts

Weka





Prevent user from pressing submit button before completing the form's inputs such as registration form, keyup even function is used with disabled attribute.
javascript code
<html>
<head>
<title>Disable submit button until all form's fields are filled</title>

<!--
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
Note you can download the JQuery package instead of using Google version. -->
<script src="jquery-1.8.3.js"></script>
<script>
$(document).ready(function() {

$(function() {
$('#sbtbtn').attr('disabled', 'disabled');
});

$('input[type=text],input[type=password]').keyup(function() {

if ($('#target1').val() !=''&&
$('#target2').val() != '' &&
$('#target3').val() != ''&&
$('#target4').val() != '') {

$('#sbtbtn').removeAttr('disabled');
} else {
$('#sbtbtn').attr('disabled', 'disabled');
}
});
});
</script>

<style type="text/css">
html { background: #fafafa; }

#myDiv
{
background: #0505C0;
border: 10px solid #11e;
padding: 10px;
color: Yellow;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
line-height: 25px;
text-align: justify;
}

#myDiv { width: 500px; }
</style>

</head>

<body>

<div id="myDiv">
<center>
<form action="#" id="Once">
<table border="1">
<tr>
<td><strong>username:</strong></td>
<td><input type="text" name="username" id="target1" />
</tr>
<tr>
<td><strong>password:</strong></td>
<td><input type="password" name="password" id="target2" />
</tr>
<tr>
<td><strong>Confirm password:</strong></td>
<td><input type="password" name="password2" id="target3" />
</tr>
<tr>
<td><strong>Email</strong></td>
<td><input type="text" name="email" id="target4" />
</tr>
<tr>
<td colspan="2">
<center><input type="submit" value="submit" id="sbtbtn" />

</td>

</form>
</center>
</div>

</body>
</html>




_________________
M. S. Rakha, Ph.D.
Queen's University
Canada


Author:
Mastermind
User avatar Posts: 2715
Have thanks: 74 time
Post new topic Reply to topic  [ 1 post ] 

  Related Posts  to : Disable submit button until all form's fields are filled
 disable button     -  
 avoid multiple submit of form, prevent more than one press     -  
 Clear specific form fields using JQuery     -  
 Earn $2 Per Form Filled. Now Hiring Data Entry Typists     -  
 avoid multiple submit clicks using javascript     -  
 Draw Filled Arc php code     -  
 Draw Filled Ellipse in php     -  
 How to save a search fields...in Struts2.0     -  
 Listing All Rows and Fields in a Table     -  
 Convert link and button to custom button with good style     -  



Topic Tags

JQuery Validation
cron





Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group
All copyrights reserved to codemiles.com 2007-2011
mileX v1.0 designed by codemiles team
Codemiles.com is a participant in the Amazon Services LLC Associates Program, an affiliate advertising program designed to provide a means for sites to earn advertising fees by advertising and linking to Amazon.com