<script>
function fun(){
let i=document.getElementById("input")
if(i==="sam")
{
alert("welcome SAM")
}
else
{
alert("welcome user")
}
}
</script>
<input id="input"/>
<button onclick="fun()">click</click>
if user type input as 'sam' it should be follow the if block but every time it execute else part .how to change the condition that when user type 'sam' in textbox then only it follow if block or else execute else part
getElementById method returns html element, if you want to get text inside input you should use document.getElementById("input")?.value
Make sure your input is correct.
Instead of writing "if(i===sam)", write "if(i=="sam").
Other than that, I think there's a problem with your input method. Javascript doesn't directly get the input from the box. For further information, check this link: https://www.tutorialspoint.com/How-to-take-user-input-using-HTML-forms
If you want to do it the easier way, just put "document.getElementById("input").value"
If this answer helped you, please mark it as an answer
Just add .value ahead of document.getElementById("input")
Just like that:
let i=document.getElementById("input").value
Basically, you're not passing the text to the variable i that is the reason else is executing
Related
I have a LocationInfo.jsp in which i am calling AddCities.jsp using AJAX
Now the Problem is when i am validating addCities.jsp fields like isEmpty and setting focus on element if it is empty, javascript function searching the element on locationinfo.jsp and it is not setting focus on desired element.
I am new to javascript so plese help me.
here is my code:
function isEmptyField(obj)
{
if((obj.value==null)||(obj.value.length==0))
{
alert("Please Enter Value");
document.getElementById(obj.id).focus();
}
}
and textbox within the AddCities.jsp is like this:
<input class="combo" type="text" name="city" id="ctname" onBlur="isEmptyField(this);">
enter code here
2 comments
1. check that your "if" condition returns true?
2. if yes, try this.focus() instead of document.getElementById(obj.id).focus();
Ok so I am really confused on this whole javascript in HTML stuff.
What I am trying to do is validate a form either "onblur" or on submit with an external file.
Here is the HTML code that works for the first field:
<script>
function notEmpty(rep, errMsg)
{
var errMsg = "Please enter something in Rep";
var rep = document.getElementById('submitted_by_hrrep');
if(rep.value == '')
{
alert(errMsg);
hrrep.focus();
return false;
}
return true;
}
</script>
This is in the body of the form near its field.
<script type="text/javascript">document.getElementById("submitted_by_rep").onblur=notEmpty;</script>
So that DOES work and will pop an alert that tells em to go back
What I CAN'T get to work is doing this for the rest (15 fields) of the form.
The "onsubmit" is confusing me and I think it's right but I am not sure.
<form onsubmit="return formValidation()" method="post" action="process.asp" >
Anything will help
EDIT
function validate()
{
if(document.newempRequest.submitted_by_hrrep.value ==='')
{
alert("Please provide your name");
document.newempRequest.submitted_by_hrrep.focus();
return false;
}
I got so frustrated that I started from scratch and took it a field at a time. Found that this works for the fields that need text, it looks messy for the file but calling it externally works flawlessly.
I wish I could use jquery but it seems to be more complex to setup that I actually need. Thanks for the help :)
You would have to grab all the inputs then iterate over them with a loop of some flavor, maybe a for loop?
with jquery it's really easy since there are already form validator plugins out there, and the selectors are really friendly. Using jquery,
$('#formId input')
would grab all the inputs in the form, then you can use a .each() to iterate through all the inputs
You obviously aren't going to be able to .focus() on all of the fields though, so need another function to handle the entire list instead of just one.
So I am using document.forms[0].onsubmit in my code to check if two duplicate values exist in the text field on my applications , if a user enters two numbers that are the same , then when you click on submit, an alert box pops up telling you that two numbers are the same .. THAT part works fine .. but after changing the values and having different numbers, I still get the same text from the alert box saying that the two numbers are the same .. it looks like my change is not recognized at all after the first error has been corrected .. How can I actually make the submit process recognize that a change to the error was made. Below is the relevant code .. I would like to be able to correct this in Javascript with the code I already have if possible . Thanks
if(duplicate(esnList)){
document.forms[0].onsubmit = function () {
alert ("ERROR: You can have duplicate ESNs in the ESN text field.");
return false;
}
}
<input class="submit" type="submit" name="submit" value="Provision Unit(s)" tabindex="13">
You should do the check inside the function.
document.forms[0].onsubmit = function () {
if(duplicate(esnList)) {
alert ("ERROR: You can have duplicate ESNs in the ESN text field.");
return false;
}
}
Instead of conditionally providing a callback that always displays the error message, you have to always provide a callback that conditionally displays the message.
You can see in the paper form attached what I need to convert into a web form. I want it to show the check boxes and disable the input fields unless the user checks the box next to it. I've seen ways of doing this with one or two elements, but I want to do it with about 20-30 check/input pairs, and don't want to repeat the same code that many times. I'm just not experienced enough to figure this out on my own. Anyone know anywhere that explains how to do this? Thanks!
P.S. Eventually this data is all going to be sent through an email with PHP.
I don't think this is a good idea at all.
Think of the users. First they have to click to enter a value. So they always need to change their hand from mouse to keyboard. This is not very usable.
Why not just give the text-fields? When sending with email you could just leave out the empty values.
in your HTML :
//this will be the structure of each checkbox and input element.
<input type="checkbox" value="Public Relations" name="skills" /><input type="text" class="hidden"/> Public Relations <br/>
in your CSS:
.hidden{
display:none;
}
.shown{
display:block;
}
in your jQuery:
$('input[type=checkbox]').on('click', function () {
// our variable is defined as, "this.checked" - our value to test, first param "shown" returns if true, second param "hidden" returns if false
var inputDisplay = this.checked ? 'shown' : 'hidden';
//from here, we just need to find our next input in the DOM.
// it will always be the next element based on our HTML structure
//change the 'display' by using our inputDisplay variable as defined above
$(this).next('input').attr('class', inputDisplay );
});
Have fun.
Since your stated goal is to reduce typing repetitive code, the real answer to this thread is to get an IDE and the zen-coding plug in:
http://coding.smashingmagazine.com/2009/11/21/zen-coding-a-new-way-to-write-html-code/
http://vimeo.com/7405114
I have created a webpage, in which i have a few input box and a submit button in a
<form action="" method="post" name="password">
On the click of the submit button, it calls a js function, which checks if the passwords are same, and if not it displays the error
if (passwrd1!=passwrd2)
{
document.getElementById("response").innerHTML="<font color='red'>Passwords do not match</font>";
}
It displays the error in:
<div id="response" align="center">Response from js</div>
But the problem is, it displays the function and then the same "Response from js" comes back.
What should i do to solve this porblem??
Best
Zeeshan
Do you also return false from submit button's click function to prevent it from actually posting back the form?
if (passwrd1 != passwrd2)
{
document.getElementById("response").innerHTML = "Passwords don't match";
return false;
}
Because from the small amount of code you've given us it looks like, your form gets posted back anyway.
You need a return false; in your if-statement, as the form will get posted even if the statement is hit. The return false will stop the form from being posted and will display the message.
Even though it's not part of the question, I will recommend you don't use the <font>-element, as it is deprecated and not exactly a good way of just displaying some red text. You can either output the error message in a span with the text color set to red like this:
document.getElementById("response").innerHTML = "<span style=\"color: red;\">Message</span>";
Not much difference, but following the standards of the web is always a good thing.
To give an example of what was said in the comments, you're probably even better off defining a class and styling it with CSS.
.errormsg { color: red; }
document.getElementById("response").innerHTML = "<span class=\"errormsg\">Message</span>";
The result is the same, but as said in the comments; it's easier to maintain, and thus a better solution.