The text box should accept onli decimal values in javascript. Not any other special characters. It should not accept "." more than once. For ex. it should not accept 6.....12
Can anybody help???
You can use regex:
function IsDecimal(str)
{
mystring = str;
if (mystring.match(/^\d+\.\d{2}$/ ) ) {
alert("match");
}
else
{
alert("not a match");
}
}
http://www.eggheadcafe.com/community/aspnet/3/81089/numaric-validation.aspx
You can use Regex.test method:
if (/\d+(\.\d{1,2})/.test(myTextboxValue)) //OK...
JQuery Mask plug in is the way to go!
http://www.meiocodigo.com/projects/meiomask/#mm_demos
If you mean you do not want anything but an integer or a decimal to be typed into the field, you'll need to look at the value
as each key is pressed. To catch pasted input, check it again onchange.
textbox.onkeyup=textbox.onchange=function(e){
e= window.event? event.srcElement: e.target;
var v= e.value;
while(v && parseFloat(v)!= v) v= v.slice(0, -1);
e.value= v;
}
probably you want to validate a form input before sending it to the server. Here is some example:
<html>
<head>
<title>Form Validation</title>
<script type="text/javascript">
function validate(){
var field = document.getElementById("number");
if(field.value.match(/^\d+(\.\d*)?$/)){
return true;
} else {
alert("Not a number! : "+field.value);
return false;
}
}
</script>
</head>
<body>
<form action="#" method="post" onsubmit="return validate();">
<input type="text" id="number" width="15" /><br />
<input type="submit" value="send" />
</form>
</body>
</html>
I just whipped this up. Useful?
<html>
<head>
<script type="text/javascript">
function validNum(theField) {
val = theField.value;
var flt = parseFloat(val);
document.getElementById(theField.name+'Error').innerHTML=(val == "" || Number(val)==flt)?"":val + ' is not a valid (decimal) number';
}
window.onload=function(){
validNum(document.getElementById('num'));
}
</script>
</head>
<body>
<form>
<input type="text" name="num" id="num"
onkeyup="return validNum(this)" /> <span id="numError"></span>
</form>
</body>
</html>
Related
I have a problem. There is something wrong with the code as even when the input like abc56, it still alert "Enter your name". Or when the input is abc, it should be displayed "Perfect" instead of "Enter your name". The input only allows characters not number and I think the regex is correct, the only wrong is the logic. Can you guys help me?
var check=document.forms["check"]["name"].value;
var reg=/^[a-zA-Z]+$/;
function ipt(){
if(check !== ""){
if(check.match(reg)===false){
alert("Only enter character please");
}
else{
alert("Perfect");
}
}
else{
alert("Enter your name");
}
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Check</title>
<script src="./check.js" defer></script>
</head>
<body>
<form name="check" onsubmit="ipt()">
<label for="name">Name</label>
<input type="text" id="name" name="name">
<button type="submit">Submit</button>
</form>
</body>
</html>
you get the value of document.forms["check"]["name"] on page load.
not the value onsubmit event
and your regex usage is wrong, use RegExp.prototype.test()
it return a boolean value ( true or false)
do
const name_elm = document.forms.check.name
, reg = /^[a-zA-Z]+$/
;
function ipt() {
if (!!name_elm.value) // or if (name_elm.value !== '')
{
if (reg.test(name_elm.value))
{ alert('Perfect') }
else
{ alert('Only enter character please') }
}
else {
alert('Enter your name');
} }
You can clean up the if statement by using an else if.
When you check for a value in a form, use value when you need to see what the current value is.
var check = document.forms["check"]["name"];
var reg = /^[a-zA-Z]+$/;
function ipt(){
// check if its empty
if (check.value === "") {
alert("Enter your name");
// check if it matches the pattern
} else if (!check.value.match(reg)) {
alert("Only enter character please");
} else {
// Success!
alert("Perfect");
}
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Check</title>
<script src="./check.js" defer></script>
</head>
<body>
<form name="check" onSubmit="return ipt()">
<label for="name">Name</label>
<input type="text" id="name" name="name">
<button type="submit">Submit</button>
</form>
</body>
</html>
I'm trying to make sure the input in a particular field is just an 11 digit number, however my if condition does not seem to be working:
Javascript:
<script>
function check() {
var x = document.forms["myform"]["mobile"].value;
if (!/^\d{11}$/.test(x)) {
myform.action="gender.html";
else {
myform.action="mobilerror.html"
}
}
</script>
And the HTML is:
<form id="myform" onsubmit="check();" >
<input class="input" type="text" name="mobile" required="required"
oninvalid="this.setCustomValidity('Number is empty')" oninput="setCustomValidity('')" />
</form>
Please help!
You can try maxlength and type attribute of input field:
<input class="input" type="text" name="mobile" maxlength="11" type="number" required="required"/>
If it satisfy your case then you don't need to call javascript function.
Your regular expression is working just fine. I think the error lies in the "if" condition. Try changing
if (!/^\d{11}$/.test(x)) {
myform.action="gender.html";
else {
myform.action="mobilerror.html"
}
to this
if (/^\d{11}$/.test(x)) {
myform.action="gender.html";
else {
myform.action="mobilerror.html"
}
As you can see I just took off the negation in the expression.
Note: Assuming that the "mobilerror.html" is shown when the user didn't type the 11 digit as expected.
Try this
function check() {
var x = document.forms["myform"]["mobile"].value;
var pattern = new RegExp("^1?([1-9])(\\d{10})");
if (pattern.test(x)) {
myform.action="gender.html";
} else {
myform.action="mobilerror.html"
}
}
^1?([1-9]) checks if the first number is not zero, so that the input value is numerically a 11-digit number. If you don't want it you can remove it.
This help you :
use type 'number':
<input type="number" id="number" class="input">
and test number digits is 11 or not with :
var patt = /.{11}/;
Example :
<html>
<head>
<style>
</style>
</head>
<body>
<form id="myform" onsubmit="check()" >
<input id="number" class="input" type="number">
<button type="submit">Submit</button>
</form>
<script>
var patt = /.{11}/;
function check(){
var num = document.getElementById("number").value;
var frm = document.getElementById("myform");
if(patt.test(num))
frm.action ="mobilerror.html"
else
frm.action = "gender.html";
}
</script>
</body>
</html>
I want, If balance field is <0, If Recharge amount filed >0 then form not submit, Can you give me Java script or php code please. Here is my editing code but not working I dont understand. Please give me solutions
<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script type="text/javascript">
form.onsubmit = function(e){
if(document.getElementById("bal").value==30){
e.preventDefault();
alert("Value must not be equal to 30");
}
if(document.getElementById("bal").value<0){
e.preventDefault();
alert("error msg");
return false;
}
if(document.getElementById("amount").value>0){
e.preventDefault();
alert("error msg");
return false;
}
};
</script>
</head>
<body>
<form action = '' method='post' name="recharge">
<input type="text" id="bal" name="bal" value="">Balance</><br>
<input type="text" id=="number" name="number" value="">Rehcarge number</><br>
<input type="text" id="amount" name="amount" value="">Amount</><br>
<input type="submit" name="submit" value="SUBMIT">
</form>
</body>
</html>
Try:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
jQuery("input[name='button']").click(function(e){
//getting your balance amount
bal = jQuery("input[name='balance']").val();
//if balance is lesser than 0, form will be submitted
if(bal<0){
jQuery('form').submit();
}
});
});
</script>
Make sure your input fields are enclosed inside <form></form> tags.
You can check the submitted balance value like
$balance = $_REQUEST['balance']; if($balance <=30){ echo "cant submit form"; header("location: your form path ") ; }
Or you can user jQuery to check the value and show alert message to user
You can do this via javascript or using any of the js libraries, check on form submit as below:
Try
var form = document.getElementById("fr");
form.onsubmit = function(e){
if(document.getElementById("bal").value==30){
e.preventDefault();
alert("Value must not be equal to 30");
}
return true
};
See demo here
do in jquery like this
$("input[type=submit]").click(function(e){
if($("input[name=amount]").val() == "30")
{
alert("you have entered amount as 30. Form not submitted");
return false;
}
else if($("input[name=amount]").val() > $("input[name=balance]").val())
{
alert("you dont have enough balance");
return false;
}
});
And Add this
<script type="text/javascript" src="code.jquery.com/jquery-1.10.2.min.js"></script>
to head of html
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function($)
{
jQuery("input[name='submit']").click(function(e)
{
balance = jQuery("input[name='balance']").val();
amount = jQuery("input[name='amount']").val();
if(balance < 0 && amount > 0)
{
alert('Balance is less than 0 and amount is greater than 0 : So not submitting');
jQuery('form').submit();
}
else
{
alert('Balance is greater than 0 : So not submitting');
}
});
});
</script>
<form action = '' method='post'>
<input type="text" name="balance" value="">Balance</><br>
<input type="text" name="number" value="">Rehcarge number</><br>
<input type="text" name="amount" value="">Amount</><br>
<input type="submit" name="submit" value="SUBMIT">
</form>
I'm trying to make a form where you input a number to a textbox and based upon that a text response is put in a textbox.
This is an example of what I have been trying to make work:
<html>
<head>
<script type="text/javascript">
function calculate()
{
var ph = document.test.ph.value;
if (ph > 7.45) {
var str = "Alkalosis";
}
else if (ph < 7.35) {
var str = "Acidosis";
}
else {
var str = "Normal";
}
document.test.acidalk.value = str;
}
</script>
</head>
<body>
<form name="test">
pH<input type="textbox" name="ph"><br>
<input type="submit" value="Calculate"><br>
<input type="textbox" id="acidalk" >
</form>
</body>
</html>
The idea of what I'm trying to achieve is if a number higher than 7.45 is put in the first text box, the button clicked, then the word "Alkalosis" is put in the second text box, but if the number is less than 7.35, the word is "Acidosis" instead.
Any help would be greatly appreciated
Well, you're most of the way there. Instead of having the button be a submit button, try
<input type="button" onclick="calculate();" value="Calculate" />
Base of your code This will be a way to do it:
<html>
<head>
<script type="text/javascript">
function calculate(){
var ph = document.getElementById('ph').value;
if(ph > 7.45){
var str="Alkalosis";
}else if(ph < 7.35){
var str="Acidosis";
} else{
var str="Normal";
}
document.getElementById('acidalk').value =str;
}
</script>
</head>
<body>
pH<input type="textbox" name="ph"><br>
<button onclick="calculate()">Calculate</button>
<input type="textbox" id="acidalk" >
</body>
</html>
hope helps!
You have the form, you have the function, you just need a way to tie them together. Do it by assigning calculate() as an event handler for the form's submit event. Make sure to return false else the form will be submitted and the result of calculate() will not be seen.
<form name="test" onsubmit="calculate(); return false">
jsfiddle.net/UhJG2
Binding to the form's submit event rather than button's click event has the added benefit of calling the function when enter is pressed. It also ensures the form is not ever accidentally submitted.
With jQuery:
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
</head>
<body>pH
<input type="textbox" name="ph" id="ph">
<br>
<button id="calculate">Calculate Acid Level</button>
<br />
<input type="textbox" id="acidalk" value="" />
</body>
<script type="text/javascript">
$("#calculate").click(function () {
var ph = $("#ph").val();
if (ph > 7.45) str = "Alkalosis";
else if (ph < 7.35) var str = "Acidosis";
else var str = "Normal";
$("#acidalk").val(str);
});
</script>
</html>
Should I use window.open() inside window.onload function in Javascript? If not how to use that in window.onload="url". Please show me some example. Here below is what am trying to do. The text validation is working fine. Once I enter run string its not going to open the `evovle.jsp (concern url)
e.g.:
<html>
<head>
<script type="text/javascript">
function validatetxtbox()
{ var txtfield;
txtfield =document.getElementById('txtbox').value;
if(txtfield == "run")
{ alert("you entered string right");
window.onload=function(){window.open('evolve.jsp''welcome' 'width=500,height=500,menubar=yes,status=yes,location=yes,toolbar=yes,scrollbars=yes');}
}
else { alert("Try again"); }
}
</script>
</head>
<body>
<input type="text" id="txtbox" maxlength="3">
<input type="button" id="btn" value="Send" onclick="validatetxtbox()">
</body>
</html>
<html>
<head>
<script ="text/javascript">
function check() {
var txtfield; txtfield =document.getElementById('txtbox').value;
if(txtfield == "run")
{ alert("you entered string right");
var newwin=window.open('evolve.jsp','welcome','width=500,height=500,menubar=yes,status=yes,location=yes,toolbar=yes');
newwin.focus();
}
else { alert("Try again"); }
}
</script>
</head>
<body>
Enter a Keayword
<input type="text" id="txtbox" onblur="check()" />
</body>
</html>
Use querystring and check in evolve.jsp
Ex evolve.jsp#alertme