Here is the submit button i would like to 'click' using javascript.
<input type="submit" name="REG_BTN" value="Submit Changes">
I am trying to use something along the lines of...
document.getElementsByTagName('submit')[0].click();
to 'click' the button, but it does not work. I am writing a script to run in browsers so i do not have the ability to change any of the aspects of the submit button. I am new to javascript so it may just be something simple that i am not picking up. Is there another way to achieve this?
The tagName for that element is INPUT; there are no elements with tag name submit. Try this:
document.getElementsByName('REG_BTN')[0].click();
If page is complete loading first, and use querySelector (CSS) and click.
'
if (document.readyState=='complete'){
document.querySelector('input[type*="submit"]').click();
}
'
Related
This may be too short and sweet, but this is all I have to ask. When I have two buttons in HTML, I use one button for form submission, and another to trigger a javascript event. However, what is happening is that both buttons perform form submits. I want to use the other button for submits without making it unusable by javascript. WHat are the possible methods I can do this?
To expand on what Saravanan Sachi and aladin8848 already said:
If you are using <input> for your buttons, type="submit" will always submit your form and type="button" will be a plain, non-form submitting button.
If though you are using <button></button> tags for your buttons (as I tend to do), they have a 'default' type of submit, so you have to explicitly set their type to button ex. <button type="button">Do JS click things</button> to prevent it from submitting your form.
Use
<input type="submit">
to submit the form and
<input type="button">
to call JavaScript method
Use
<input type='button' onclick='....'>
instead of what you are probably using
<input type='submit'>
you can do the next:
var buttonList = document.getElelmentsByTagName('button');
buttonList[2].addEventListener('click', function(event){
event.preventDefault();
this.removeEventListener("click", this, false);
//do something, like add your own event
});
you should be more specific getting the buttons, and i don't test the code, but the idea is that, remove events and default behaviour of the second button.
i hope this helps you.
There are a lot of buttons in my HTML. And each time when I click on one button, that button is activated (other buttons are deactivated). And I want that, letters can be directly typed onto that specific button like a textbox (type="text"). Is that possible with javascript? Or do I need other things like JQuery, etc?? Thanks!
Something like this?
<button contenteditable="true">Foobar</button>
One way is to add an input element inside a button element.
For example:
<button>
<input type="text" placeholder="type somthing here" />
Send
</button>
See the working version:
https://jsbin.com/lomufaqoxe/edit?html,output
You can wrap an input tag around a button tag and style it with CSS so that it merges with your button.
I am using Visual Studio 2012 and I want it to generate a simple onclick JavaScript event for an HTML button. I select the button in the Designer, go to properties, but there is no lightning bolt button for events. How to fix this?
The event doesn't exist because the HtmlButton Class is just a wrapper so the render can create a HTML output.
The base ASP.NET equivalent (with events) would be a System.Web.UI.WebControls.Button.
Now, all System.Web.UI.HtmlControls accept the AddAttribute method, which would allow you to programatically specify the control's behavior. For example, let's say you have this code on your HTML page:
<input type='Button' ID='btn1'>
And you want to add a javascript event. First, make it accessible by the server-side code:
<input type='Button' ID='btn1' runat='server'>
Then, on the codebehind, add the content:
this.btn1.AddAttribute("onclick", "doSomething();");
There you go. Hope it works for you!
Use jquery
$("#btnID").click(function() {
///your actions
});
Read more on http://api.jquery.com/click/
I need either a javascript which can click on a button. The thing is, there are 100+ buttons on the page all with the same value. The name is unique but quite long.
The full name of the element is something like :
actions[http://apps.facebook.com/frontierville/giftaccept.php?next=giftaccept.php&senderId=1%3A1325206719&gh=3a8bfdace76051752a9127d1f9b43872&gift=nails×tamp=1285598414&ref=tab&key=29b15e06ed9d7c00a8870c955ab938cf%24%24cfH1PUUZ%217bZYhg8M-o-XQc%218HHRMcvvyhuf4d%21.64qEvlQe&src=request&aff=gift&crt=nails&signature=6dd3fa03fe88f98b6dcab4faf4c7da94]
The value of every button is Accept and Play.
So. Is there a way to have it click on the button with a specific URL in the name?
I tried this:
javascript:(function(){var b=document.getElementsByName('actions[http://apps.facebook.com/frontierville/giftaccept.php?next=giftaccept.php&senderId=1%3A1325206719&gh=3a8bfdace76051752a9127d1f9b43872&gift=nails×tamp=1285598414&ref=tab&key=29b15e06ed9d7c00a8870c955ab938cf%24%24cfH1PUUZ%217bZYhg8M-o-XQc%218HHRMcvvyhuf4d%21.64qEvlQe&src=request&aff=gift&crt=nails&signature=6dd3fa03fe88f98b6dcab4faf4c7da94]');for(var j=0;j<b.length;j++){if(b[j].value.match(/^Accept and Play/i)){b[j].click();break;}}})()
and it did not work. Any suggestions?
EDIT:
If it helps, here is the source of the info for one of the buttons:
<input value="Accept and Play" type="submit" name="actions[http://apps.facebook.com/onthefarm/giftaccept.php?senderId=1259413693&gift=mysterygift×tamp=1285599906&ref=gift_accept_tab&key=78fcc7de3b36b8f9564262fab506893f%24%24ceK5RVRY61bZYhg8M-o-XQcyL%2CzHccEwEeuj4e-%21-dh0AD0A2AgyScd&signature=32db959ce43f8330cf8fd992fbd53a51&srcapp=FarmVille]">
your script works for me.
Are u sure, that you use the exact name in your script?
Are there other elements in the page, that share the same name?
If it does: you better also check the type of these elements. If they are not click()-able Elements(for example hidden-Inputs or text-inputs, this will cause an exception, so your loop will be stopped)
I'm using an image as the submit button for a search form, i.e.:
<input id="search" type="image" alt="Search" src="/images/searchButton.png" name=""/>
This has an unfortunate side effect in Chrome and Firefox--the parameters &x=0&y=0 appear on the end of the search results URL, for example if I search for "food" I am directed to the page:
main/search?search=food&x=0&y=0
Some hunting around online has indicated that this is standard behavior when you use an image to submit a form.
I noticed that Digg.com uses an image to submit its search form but avoids this behavior. I can't figure out how they do it. They don't seem to be using Javascript to submit the form. Can anyone tell?
Digg is using JavaScript to do that. Try submitting the search form with JavaScript disabled in your browser.
Instead of using an <input type="image">, you could use a <button> element:
<button type="submit" style="border: 0; background: transparent">
<img src="image.png"></img>
</button>
Those parameters denote the location in which the click was exercised upon the image, which is the default behavior of most if not all browsers when it comes to using images as submit buttons. You can use a workaround that basically goes through JavaScript to submit your form, much like what you see in watain's example. Or you can create a submit button thats not a form element, by utilizing form.submit() as the action attached to that image.
You could use Javascript to submit the form like that, it's still the easiest way:
<script>
yourForm.onSubmit = function() {
location.href = 'main/search?search=' + encodeURIComponent(yourForm.elements['query'].value);
return false;
}
</script>
Unfortunately I don't know how they do it without Javascript.
EDIT: Btw you could also use a simple which will submit the form when it gets clicked.