THis is the code :
<script>
function searchFor(searchEngine,searchQuery){
if (searchEngine="google"){
var x="http://google.com.hk/search?q="+searchQuery;
window.location=x
}
if (searchEngine="yahoo"){
var x="http://hk.search.yahoo.com/search?p="+searchQuery;
window.location=x
}
}
</script>
<form>
<input type="radio" name="searchLoc" value="google"> Google <input type="radio" name="searchLoc" value="yahoo"> Yahoo
<br>
<input type="text" name="searchContent">
<input type="submit" onclick="searchFor(this.form.searchLoc.value,this.form.searchContent.value);return false;" value="Search"
</form>
Why is it not working?
Once i click the submit button, nothing happened.
Pls help. Thx.
You should write
<script>
function searchFor(searchEngine,searchQuery){
if (searchEngine=="google"){
var x="http://google.com.hk/search?q="+searchQuery;
window.location=x
}
if (searchEngine=="yahoo"){
var x="http://hk.search.yahoo.com/search?p="+searchQuery;
window.location=x
}
}
</script>
'==' instead of '=' in comparison
Change submit button also,
<input type="submit" onclick="searchFor(this.form.searchLoc.value,this.form.searchContent.value);return false;" value="Search" />
Certain error
a) it should be window.location.href
b) close the submit button tag
c) use '==' equal to for comparision
<script>
function searchFor(searchEngine,searchQuery){
for (var i = 0; i < searchEngine.length; i++) {
if (searchEngine[i].type === 'radio' && searchEngine[i].checked) {
value = searchEngine[i].value;
}
}
if (value=="google"){
var x="http://google.com.hk/search?q="+searchQuery;
window.location.href=x
}
if (value=="yahoo"){
var x="http://hk.search.yahoo.com/search?p="+searchQuery;
window.location.href=x
}
}
</script>
<form>
<input type="radio" name="searchLoc" value="google"> Google <input type="radio" name="searchLoc" value="yahoo"> Yahoo
<br><input type="text" name="searchContent">
<input type="submit" onclick="searchFor(this.form.searchLoc,this.form.searchContent.value);return false;" value="Search" />
</form>
<script type="text/javascript">
function searchFor(searchEngine,searchQuery){
if (searchEngine=="google"){
var x="http://google.com.hk/search?q="+searchQuery;
window.location=x
}
if (searchEngine=="yahoo"){
var x="http://hk.search.yahoo.com/search?p="+searchQuery;
window.location=x;
}
}
</script>
<form onsubmit="searchFor(this.form.searchLoc.value,this.form.searchContent.value);return false;">
<input type="radio" name="searchLoc" value="google"> Google <input type="radio" name="searchLoc" value="yahoo"> Yahoo
<br><input type="text" name="searchContent">
<input type="submit" value="Search"/>
</form>
Modify the code as above. searchEngine="google" should be searchEngine == "google" and use onsubmit on tag instead of onclick on submit button.
instead of:
if (searchEngine="google")
try this:
if (searchEngine === "google")
Related
So basically I want to take the data in the form and use it in a function.
HTML:
<form id="form1" onsubmit="Ordering()">
<input id="X" type="checkbox">
<input id="Y" type="checkbox">
<input type="submit" value="order">
<input type="reset">
</form>
Java Script:
function Ordering()
{
alert("Hello! I am an alert box!!");
if(document.getElementById('X')==true;)
{
action='whatsapp://send?abid=&text=';
}
if(document.getElementById('Y')==true;)
{
action='ailto:pizza#manheten.co.il?subject=Pizza%20order&body=123';
}
but i cant activate the script at all... i tried to use an alert to see if its even getting there ... but with no success .. any suggestions?
There are some typos and you need to use value to get the value and compare as follows:
function Ordering() {
alert('hello');
if (document.getElementById('X').value) {
action = 'whatsapp://send?abid=&text=';
}
if (document.getElementById('Y').value) {
action = 'ailto:pizza#manheten.co.il?subject=Pizza%20order&body=123';
}
}
<form id="form1" onsubmit="Ordering()">
<input id="X" type="checkbox">
<input id="Y" type="checkbox">
<input type="submit" value="order">
<input type="reset">
</form>
Cant get my function to work and add the value of the button to the text field when clicked by user.
HTML
<form name="testing" action="test.php" method="get">Chords:
<textarea name="field"></textarea>
<input type="button" value="G" onClick="addToField('G');">
<input type="button" value="C" onClick="addToField('C');">
<input type="button" value="Am" onClick="addToField('Am');">
<input type="button" value="F" onClick="addToField('F');">
JavaScript
<script language="javascript" type="text/javascript">
function addToField(crd){
document.testing.field.value += crd;
}
</script>
Really stuck trying to understand whats wrong here.
Hope this shows what I am trying to achieve: https://jsfiddle.net/034hyjo2/6/
You're accessing the object incorrectly
<script language="javascript" type="text/javascript">
function addToField(crd){
document.getElementByName("testing").value += crd;
}
</script>
Or, give the element an ID and use getElementByID("testing").value.
I usually find that works better anyway...
If you're just getting it in the fiddle, it works by putting the script tag above your HTML:
<script>
var addToField = function(c) {
document.testing.field.value += c;
};
</script>
<form name="testing" action="test.php" method="get">Chords:
<textarea name="field"> </textarea>
<input type="button" value="G" onClick="addToField('G');">
<input type="button" value="C" onClick="addToField('C');">
<input type="button" value="Am" onClick="addToField('Am');">
<input type="button" value="F" onClick="addToField('F');">
</form>
Your JSFiddle is way wrong. You're question here is better. You want to be using document.getElementById('field').value += crd; instead of document.testing.field.value += crd;
try this:
<form name="testing" action="test.php" method="get">Chords:
<textarea id="field" name="field"> </textarea> ---note the addition of the ID parameter
<input type="button" value="G" onClick="AddToField('G');">
<input type="button" value="C" onClick="AddToField('C');">
<input type="button" value="Am" onClick="AddToField('Am');">
<input type="button" value="F" onClick="AddToField('F');">
</form>
<script>
function AddToField(c) {
document.getElementById('field').value += c;
};
</script>
Also functions shouldn't be camelCase but Pascal case ;)
What I want the program to do is make a form and have 2 radio buttons and 1 text.
Then I want it to collapse the text and radio value together into one and take me to that page:
If I input text with like "facebook" and the radiobutton value is .com I want it to take facebook + .com and send me to that page.
<!doctype html>
<html>
<head>
<title>A Basic Form</title>
<style type="text/css">
</style>
</head>
<body onunload="Bye()">
<form>
<fieldset>
<legend>Redirection: </legend>
<div>
<label>Where do you want to go?</label>
<input type="text" id="input" name="input" size="7">
<input type="submit" id="submit" name="submit" value="Submit" onclick="go()">
</div>
<div>
<input type="radio" id="no" name="end" value=".no">
<label for=".no">.no</label>
<br />
<input type="radio" id="com" name="end" value=".com">
<label for=".com">.com</label>
</div>
</fieldset>
</form>
<script type="text/javascript">
function go() {
var end = "";
if (document.getElementById("no").checked) {
end = document.getElementById("no").value;
} else {
end = document.getElementById("com").value;
}
var input = document.getElementById("input").value;
var together = input + end;
window.location.replace("http://www." + together);
}
</script>
</body>
</html>
Change type="submit" to type="button".
Change this line:
<input type="submit" id="submit" name="submit" value="Submit" onclick="go()">
to:
<input type="button" id="submit" name="submit" value="Submit" onclick="go()">
In this case you don't need to submit a form. You are just trying to redirect the url. You didn't specify where to submit the form so it is submitting to itself that is your problem.
Alternatively, return false from the onclick handler to prevent the form submit.
Try this code:
<html>
<head>
</head>
<body>
<form>
<fieldset>
<legend>Redirection: </legend>
<div>
<label>Where do you want to go?</label>
<input type="text" id="input" name="input" size="7">
<input type="submit" id="submit" name="submit" value="Submit" onclick="return go()">
</div>
<div>
<input type="radio" id="no" name="end" value=".no">
<label for=".no">.no</label>
<br />
<input type="radio" id="com" name="end" value=".com">
<label for=".com">.com</label>
</div>
</fieldset>
</form>
<script type="text/javascript">
function go() {
var end = "";
if (document.getElementById("no").checked) {
end = document.getElementById("no").value;
} else {
end = document.getElementById("com").value;
}
var input = document.getElementById("input").value;
var together = input + end;
window.location.replace("http://www." + together);
return false;
}
</script>
</body>
</html>
brso05's analysis seems to be spot on... But I can't really explain it. It seems that Chrome is delaying the side effects of the location.href.replace (which should be navigating away from the page) until after the form submit... I have a feeling you have hit a browser bug here. I can't imagine this is spec-compliant.
I have a code like this and I want to compare in a loop the attribute values of name with user entered input stored in variable "user". How can I do this?
<form>
<input type="radio" name="two">
<input type="radio" name="three">
<input type="radio" name="four">
<input type="radio" name="five">
<input type="radio" name="six">
</form>
See this answer for an example of how to loop through radio buttons in native javascript, quoted here for convenience:
<html>
<head>
<script>
var userChoice;
var setUserChoice = function(event) {
event.preventDefault();
var choices = event.target.userChoice;
for (var i =0; i < choices.length; i++) {
if (choices[i].checked) {
userChoice = choices[i].value;
}
}
event.target.choice.value = userChoice;
}
window.onload = function() {
var form = document.getElementById('userInput');
form.addEventListener('submit', setUserChoice, false);
};
</script>
</head>
<body>
<form id="userInput">
<input type="radio" name="userChoice" id="userChoice_rock" value="rock">Rock</input> </br>
<input type="radio" name="userChoice" id="userChoice_paper" value="paper">Paper</input> </br>
<input type="radio" name="userChoice" id="userChoice_scissors"value="scissors">Scissors</input> </br>
<input type="radio" name="userChoice" id="userChoice_lizard" value="lizard">Lizard</input> </br>
<input type="radio" name="userChoice" id="userChoice_spock" value="spock">Spock</input> </br>
<input type="submit" value="Enter" /></br>
<output name="choice"></output>
</form>
</body>
</html>
You can compare tha values like in this fiddle: http://jsfiddle.net/5wd8p/
HTML
<form action="demo.html" id="myForm">
<form>
<input type="radio" name="two">
<input type="radio" name="three">
<input type="radio" name="four">
<input type="radio" name="five">
<input type="radio" name="six">
</form>
<input type="submit" value="Submit">
</form>
JQuery
$(function () {
// Handler for .ready() called.
var user = "three"; //default value: depends on youur code..
//Loop through each radio element of the DOM
$("input[type=radio]").each(function(){
//Compare values of the "name" attribute and the user var
if (user == $(this).attr("name")){
alert("Same: " + $(this).attr("name"));
}else{
alert("Different: " + $(this).attr("name"));
}
});
});
try this:
document.getElementsByName(user)[0]
Hey guys i am having some problems with javascript, and i was wondering whether you could help me out?
This is my HTML code
<div class="Answer1">
<form name="form">
Enter your answer here :
<input type="text" size="10" name="answer" value="">
<input type="button" value="Check" onclick="result();">
</form>
</div>
<!--2st sum -->
<div class="Answer2">
<form name="form">
Enter your answer here :
<input type="text" size="10" name="answer" value="">
<input type="button" value="Check" onclick="result2();">
</form>
</div>
and this is my javascript
function result() {
var score = (document.form.answer.value);
if(score == 8) {
document.location.href="CorrectAdditionAnswer.html"
} else {
document.location.href="IncorrectAddition.html"
}
}
function result2() {
var score = (document.form.answer.value);
if(score == 8) {
document.location.href="CorrectAdditionAnswer2.html"
} else {
document.location.href="IncorrectAddition.html"
}
}
If I comment out one of these it works perfectly fine but if its not commented it doesnt work :( I dont understand what ive done wrong :(
You have two form with the same value for name attribute and two input with the same value for name.
js
function result()
{
var score =document.getElementsByName('answer1')[0].value;
if(score == 8)
{
document.getElementsByName('form1')[0].action = "http://www.wordpress.com";
document.getElementsByName('form1')[0].submit();
}
else
{
document.getElementsByName('form1')[0].action = "http://www.bing.com";
document.getElementsByName('form2')[0].submit();
}
}
function result2()
{
var score = document.getElementsByName('answer2')[0].value;
if(score == 8)
{
document.getElementsByName('form2')[0].action = "http://www.wordpress.com";
document.getElementsByName('form2')[0].submit();
}
else
{
document.getElementsByName('form2')[0].action = "http://www.bing.com";
document.getElementsByName('form2')[0].submit();
}
}
html
<div>
<form name="form1">
Enter your answer here :
<input type="text" size="10" name="answer1" value="">
<input type="button" value="Check" onclick=" result();">
</form>
</div>
<!--2st sum -->
<div class="Answer2">
<form name="form2">
Enter your answer here :
<input type="text" size="10" name="answer2" value="">
<input type="button" value="Check" onclick=" result2();">
</form>
</div>
To have same id for several elements put javascript in 'gridlock'. Identify your element with an unique id name is usually faster and easier for DOM / Javascript / jQuery to find the node/element faster.
This format is appropriate method if all of elements are in the same page.
<form name="form1">
Enter your answer here :
<input type="text" size="10" id="answer1" name="answer1" value="">
<input type="button" value="Check" onclick="result1();">
</form>
</div>
<!--2st sum -->
<div class="Answer2">
<form name="form2">
Enter your answer here :
<input type="text" size="10" id="answer2" name="answer2" value="">
<input type="button" value="Check" onclick="result2();">
</form>