This question already has answers here:
Why does jQuery or a DOM method such as getElementById not find the element?
(6 answers)
Closed 6 years ago.
I'm trying to write a simple code in JavaScript where selecting a button calls a prompt function, but the prompt never pops.
This is the HTML:
<div id="btnDiv">
<button type="submit" id="btn" onclick="submit"> send info </button>
</div>
And this is the JavaScript code:
document.getElementById("btn").onclick = function(){
prompt("Thank you");
}
What am I doing wrong?
Make sure that the JS code is loaded after the HTML content, you can use onLoad event:
window.onload=function(){
document.getElementById("btn").onclick = function(){
prompt("Thank you");
}
};
Related
This question already has answers here:
How do I create an HTML button that acts like a link?
(35 answers)
Closed 1 year ago.
i want to know how to make it when a a button is pressed it will redirect you to a chosen url.
something like this:
<button onclick = "link()">Press to go to link!</button>
function link(){
//leads to url
}
You can use window.open to open in new tab.
function link(){
window.open('http://www.google.com');
}
<button onclick = "link()">Press to go to link!</button>
or
function link(){
window.location.href = 'http://www.google.com'; //Will take you to Google.
}
<button onclick = "link()">Press to go to link!</button>
You can try something like this:
<button class="btn" onclick="window.location.href = 'https://www.stackoverflow.com';">Click this link</button>
or
<button>Click this link</button>
This will direct the page to a expected link
This question already has answers here:
Calling Managed Bean Method From JavaScript [duplicate]
(6 answers)
How to invoke a JSF managed bean on a HTML DOM event using native JavaScript?
(1 answer)
Invoke JSF managed bean action on page load
(4 answers)
Closed 5 years ago.
here is my problem. I have this xhtml page:
<html>
<body>
<script>
function myFunction() {
var link='#{myController.goMyDetails}' + MyId
var MyId = '#{myController.myDetails.getId()}';
self.location=link;
}
</script>
<input type="button" id="LinkBtn" onclick="myFunction()" value="Go Details" />
</body>
</html>
What I need it to do is open itself again but with the called Controller.goMyDetails and the Id in MyId as parameter for the controller.
So I click the button and I get the Controller.goMyDetails called with MyId as parameter.
Is there anyway to do this with javascript. No Primefaces or other stuff.
Thank you for your help, this is driving me mad.
This question already has answers here:
Event binding on dynamically created elements?
(23 answers)
Closed 6 years ago.
On ajax success i have list of generated forms:
...
success: function (data) {
$el.append('<form method="POST" class="submit_form">Name: '+data[i].namen+'
Id: '+data[i].id+'<br> SomethignElse: <label id="red">'+data[i].se+'</label><br> SomethingElse2: '+data[i].se2+'
<input type="text" name="id" value="'+data[i].id+'" id="id_test" />
<input type="button" class="submit_button1" value="Add"/></form><br>');
i = ++ i;
}
...
Also i have a click functionto submit this forms/form:
$(".submit_button1").click(function(){
//do something
});
but nothing happens on click. Is it possible to submit in this way?
Please try .on('click' event listner.
$(document).on('click','.submit_button1',function(){
//do something
});
This question already has answers here:
Why does jQuery or a DOM method such as getElementById not find the element?
(6 answers)
Closed 7 years ago.
If I directly insert the method document.getElementById in the method setTimeout it works fine
1.
<!DOCTYPE html>
<html>
<body>
<p>Click the button to wait 3 seconds, then alert "Hello".</p>
<button onclick="myFunction()">Try it</button>
<script>
function myFunction() {
setTimeout(function(){ alert("Hello"); }, document.getElementById("numbers").value);
}
</script>
<input id="numbers" type="textbox" />
</body>
</html>
2.
<!DOCTYPE html>
<html>
<body>
<p>Click the button to wait 3 seconds, then alert "Hello".</p>
<button onclick="myFunction()">Try it</button>
<script>
var numbers = document.getElementById("numbers").value
function myFunction() {
setTimeout(function(){ alert("Hello"); }, numbers);
}
</script>
<input id="numbers" type="textbox" />
</body>
</html>
Why the second one doesn't work? I think that the var numbers returns null, but I don't know why.
The line var numbers = document.getElementById("numbers").value is being executed on the load of your page, numbers does not exist yet.
In the first version you are retrieving the element and its value when the click event fires and calls the attached handler. In that moment the input field has a value which is returned.
In the 2nd version you are retrieving the input element and its value when the input field does not exists in the DOM, thus null is used when the handler is called. Obviously you should go for the former.
Like #gmiley has said, numbers doesn't exist it yet. You should include:
var numbers = document.getElementById("numbers").value
inside of your function.
Also, on a side note...It's probably not best to put your javascript in the middle of the file. I almost didn't see the 'input' after the 'script' tags.
This question already has answers here:
"Submit is not a function" error in JavaScript
(19 answers)
Closed 8 years ago.
Cannot get my form to submit programmatically, despite trying several ways. Tried pure JS, also tried jQuery. No success.
I have this form tag :
<form action="https://docs.google.com/forms/d/13zex8ZsEsnZz3A8uB4jU4oDb5wZfaqqq2Pq2CGlIe6M/formResponse" method="POST" id="ss-form" target="_self" onsubmit="" name="eForm">
<!--My Form Stuff-->
<input type="submit" name="submit" value="Submit" id="ss-submit">
</form>
Here is what i've tried :
/*jQuery*/
$('#ss-form').submit();
/*Javascript*/
document.getElementById('ss-form').submit();
document.eForm.submit();
None of them work. Not sure why, but I am assuming it has something to do with me trying to submit a google form. If I physically click the submit everything works fine.
Any and all help is greatly apprecaiated.
The problem is that you have a field (HTMLInputElement) with name submit in the form. That's why document.getElementById('ss-form').submit is not a function but an object.
So, you get the following error:
TypeError: object is not a function
The solution is to remove that element. We should be careful to verify if browser thinks it's an element and not a function:
if (typeof document.getElementById('ss-form').submit === "object") {
document.getElementById('ss-form').submit.remove();
}
document.getElementById('ss-form').submit();