Calling a recursive javascript within a form - javascript

I have this problem. I am trying to make a button "click it self" using a setTimeout function in javascript. I need this small piece of code to function to be able to simulate a refresh. The problem is, because the button on which I'm calling the refresh is within a form tag, this operation only occurs once, instead of continuously repeating itself. Here is my javascript
<script language="javascript" type="text/javascript">
function ClickMe(){
setInterval('document.getElementById("auto").click()',5000);
alert("Function works");
}
</script>
Here is the element on which I am calling it.
<form>
<input id="auto" type="submit" value="Click" onClick="ClickMe()" />
</form>
If you remove the "<form></form>" tag, the code runs normally by calling itself again and again every 5 seconds. Byt once you add the "<form>" tag, the function is only called once. If someone could help me out, I'll be really grateful. Thanks

For whatever reason you want to do this, just change your submit to a button like so:
<input id="auto" type="button" value="Click" onClick="ClickMe()" />
also, you should note that you're going to keep creating more and more intervals for this each time it's ran.

When you wrap the input with form, the form is submitted, you can avoid that by returning false in the ClickMe function.
function ClickMe(){
setInterval('document.getElementById("auto").click()',5000);
alert("Function works");
return false;
}

Related

Button being sent automatically?

I need this button to be automatically "pressed" when entering the site, or after X seconds.
<button id='settingsTab' class='all'>||</button>
<div id='settingsContainer'>
<div id='channelInput' style='position:absolute;top:15px;font-size:0;width:330px;'>
<input type="text" id="channel" style='width:215px;' name="channel" value='sodapoppin'>
<button id='join'>Join</button>
</div>
</div>
Is this possible, having the "join" button being sent by just entering the site?
Also, im pretty new to this!
Is this possible, having the "join" button being sent by just entering the site?
yes it is possible.
You will have to use the setTimeout function of javascript or Jquery to achieve this. Also wrap your code in a document ready function so that it executes only when the document has been fully loaded. Make sure to put all your javascript/jquery code within a script tag.
Here is a sample code (in Jquery):
<script>
$(document).ready(function(){
setTimeout(function(){ $("button#join").click(); }, 2000); /* after 2 seconds */
});
</script>

How to fires onClick event before onChange (even if the value has changed)?

Hello everyone and sorry for my english.
Following this jdfiddle, I have a problem I don't understand.
First I change the value of the input, then I click on the button and what I expected to see is "click" but I see "change" meaning onclick is called after onchange.
<input type="text" onChange="alert('change')" />
<button type="button" onClick="alert('click');">Click!</button>
I found on this post that it's because of chrome which fires onchange event before the onclick event. But I don't really have the same need as this post because my event are not declared in the same tag. And secondly, if I click on the button I would like to only execute the onclick function and not onclick and then onchange (this methods consists in using onMouseDown).
Do you have a good method to do that?
Ok so I can see that you really wan't this.
You could let the on change function run first, and then afterward see what has focus, if it is that button, you would know that it was clicked, and thus was the reason for loosing focus.
you cannot check this while the change function is running, as the body still has focus at this time..
<head>
<script language="javascript">
function focussed()
{
var triggerElement = document.activeElement
alert(triggerElement)
console.info(triggerElement)
}
function change()
{
alert("change")
setTimeout(focussed, 1)
return true
}
</script>
</head>
<body>
<input type="text" onChange="alert('change')" />
<button type="button" onClick="alert('click');">Click!</button>
</body>

How can automatically click on an hidden submint input tag when the user click on another shown input tag?

I am absolutely new in JavaScript and I have the following problem.
For some reason in a web page I have 2 input tag having type=submit, these:
<input type="submit" onclick="return myTestFunction();" value="Submit" id="submitEventButton">
<input id="submitButton" type="submit" style="display:none" onclick="return validateForm();" value="Submit" name="action:projectCreationAction">
As you can see the second one is hidden by the use of style="display:none"
Clicking on the first one I can enter into the myTestFunction() JavaScript method (that actually simply perform an alert).
I need to do the following thing: when the user click on the first button (the one having id="submitEventButton") automatically the hidden second button have to be clicked.
How can I do it?
Thanks!
You could place the following inside your myTestFunction, after the alert:
$('#submitButton').trigger("click");
Below is snippet you can run to check this out:
function myTestFunction(){
alert('hi from submit');
$("#submitButton").trigger("click") ;
}
function validateForm(){
alert('hi from validate form');
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="submit" onclick="return myTestFunction();" value="Submit" id="submitEventButton">
<input id="submitButton" type="submit" style="display:none" onclick="return validateForm();" value="Submit" name="action:projectCreationAction">
Instead of simulating a click or even having a second hidden submit button at all, you can just call the function that the second button is hitting from the first function:
function myTestFunction() {
// code here with alert
validateForm();
}
function validateForm() {
// code here
}
functions calling other functions is better practice than buttons triggering other click events.
this way is also pure javascript (no jquery) since i dont think with the implementation of your input code you are currently using jquery.
Your question is not so clear about it, but it seems like you don't really need the second button at least for what you're describing.
What you can do to achieve what you're after is add a call to validateForm() in the body of myTestFunction.
If you do not want to change the function for some reason, you can also change the first button like so:
<input type="submit" onclick="myTestFunction();validateForm();" value="Submit" id="submitEventButton">
It ain't pretty, and note that i assume here that myTestFunction doesn't return something important otherwise you can't discard the return as i suggested here, but other than that it would probably do the trick.

Onclick Trigger functionality

I have a problem in understanding the functionality of onclick.For instance:-
HTML
<input type="button" onclick="yetAnotherAlert()" />
JS
<script type="text/javascript">
function yetAnotherAlert(textToAlert) {
alert(textToAlert);
}
yetAnotherAlert("This is Chapter 2");
</script>
Over here I was expecting that once I click on the button,the function yetAnotherAlert() would be invoked.But as I open the page in my Chrome,it triggers without even clicking on the button[Onclick functionality does work here].My question is:-Why is the function getting triggered before loading the page?
Because you are calling function during page loading
yetAnotherAlert("This is Chapter 2");
Remove it. And you have to pass string during click event like this
<input type="button" onclick="yetAnotherAlert('This is Chapter 2')" />

Executing Commands Javascript

I want to execute a command by the click of a button, and not when the page loads.
function hey() {
alert('bla');
}
Do I add something to the code above or to the button?
<input type="button" value="Click Me" onclick="hey()" />
Have you taken the time to type in your question into the magical Google box yet? Surely you'll see something like this:
<input type="button" value="Click me, now" onclick="hey()" />
Say you have the function that alerts a window to the user.
<script type="text/javascript">
function showMe() {
alert('You clicked on the button');
}
</script>
<button onclick="showMe()">Button</button>
This will make sure that the function is only called when the button is clicked upon and not when the page is loaded.
Okay, so you have a code that should work for alerting something on the click of a button. But you state that the code is running on page load. You have to check you code, looking for:
An onload attribute on the body tag, something like <body onload="hey()">
A call to hey somewhere else on your js code. Look for hey().
Maybe a reference to the button followed by a call to .click()
There is something else on your code causing the function to be called, you'll have to scan your code to find out what it is.

Categories

Resources