I have a form and some buttons which are not related to the form. Also I have a blur validation on fields of the form. When field of the form is focused and I'm clicking on none-form button first time I fire blur action of redux-form field. And only on second click the button onClick is working. I want to fire onClick of none-form button on first click(when redux-form field blur action is firing). What should I do?
UPD: So far the best option is to replace onClick with OnMouseDown
Related
Naively you might assume that the event is triggered that when the (a?) input button of type "submit" is clicked.
In fact, as far as I'm able to ascertain, every button within a form triggers the event.
Is there some way to set a button to not trigger the event?
every button within a form triggers the event
No. Only submit buttons do. (As well as a few other cases such as when the Enter key is pressed in a text input).
Note that <button> elements are type="submit" by default and should be type="button" if you want a non-submit button for handing JS from.
You can also attach a JavaScript click event listener to a button and call preventDefault on the event object.
Button's default type is submit. If you want buttons that don't submit, you have to change their type to button.
So I tried a couple of things when I using JS and try submitting inputs, and there are odd things I didn't understand the logic.
There is a difference between <input tpye="submit/> inside and outside of <form> tag. If it's inside the form tag I need to use preventDefault() function, but if it's outside form tag I am not required to do that if write simple js vanilla code.
Why is that?
What the difference between onsubmit and onclick ? especially in a form tag. Because If I use onsubmit the js code doesn't really work.
If I use preventDefault(event) it's preventing from the form to be sended into a server, and instead it doing the calculations with the browser only ?
Thanks !
By default, if you have an input of type "submit" in a form then clicking that input (or hitting enter after filling in ANY inputs in the form) will send a post or get request to the server, redirecting the current page to the server's response.
This was the original way to submit form data to a server, without using javascript. If you want to prevent this from happening, you can either replace the submit input with a plain button (<button onclick="doSomething()">Submit</button>), or prevent the default submission event: (form.onsubmit = event => event.preventDefault()).
The difference between onsubmit and onclick is that onsubmit only fires when a submission event is emitted from the form. To emit a submit event, the form needs an <input type="submit"> to be clicked, or for the user to trigger a submission by hitting enter.
Another way to prevent this default behavior is to return false in the submission handler.
onclick only gets fired when an element is clicked. Because events in javascript propagate up to parents, this will also trigger any onclick handlers on all parent elements.
If you want to completely ignore the default form submission behavior, then you can define a button with an onclick handler to handle your custom submission logic.
If you have a type="submit" input (Note, The default value for the type attribute of button elements is "submit") inside a form, the default action on click is to submit that form. To prevent it from submitting, place the button outside the </form>. This works because the button doesn't refer to any form to submit. You can instead, add a listener and call event.preventDefault(). This works because you are telling the browser NOT to take the default action (submitting the form)
onsubmit is used mostly on <form> elements. It triggers right before the form is submitted regardless of how it is submitted. onclick can be emitted from just about any element. It occurs when you click on an element. This could be on an <input>, a <button>. or even an entire <form>
Don't use this.
I reask this question because no one could give a answer yet and the problem still remains. After filling a form the submit button remains disabled and I don't know how I can fix it. When I click with my mouse into one inputfield the disabled attribute of the Submit button disappears and it is clickable. I couldn't simulate this mouseclick by the Click() Method for this input field.
This is what I've tried yet:
browser.TextField(Find.ById("pvpnet-account-email")).Click();
browser.TextField(Find.ById("pvpnet-account-email")).Focus();
browser.TextField(Find.ById("pvpnet-account-email")).Select();
browser.TextField(Find.ById("pvpnet-account-email")).KeyDown();
browser.TextField(Find.ById("pvpnet-account-email")).KeyUp();
browser.TextField(Find.ById("pvpnet-account-email")).Change();
browser.TextField(Find.ById("pvpnet-account-email")).Blur();
How can I fix it ?
How can I stop triggering the onChange event of a textbox in below mentioned scenario?
I have two text boxes on an aspx page;
If user change first text box value and its onChange event there is an asynchronous service call which updating the second textbox. During service call the control shifted on the second textbox. As the second text box value has been changed before it got focus, It triggers the second TextBox onChange event.
I have an html form and within the form I have a <button> element. I am using jquery to redirect the page upon clicking the button (essentially I wanted to nest form elements but since its not valid xhtml I used a javascript workaround).
Furthermore, clicking the button grabs text from an input field, appends it to the query string then redirects the page (note that both the input field and the button are inside of the html form).
Now for what I want to do: I also want to have the same functionality when the user hits the 'enter' key from within the previously mentioned input field (i.e. same functionality as if the <button> was pressed. I have already written code that binds to the enter key (when I press enter in the input field I can get an alert to pop up). The problem is that since this input field is within <form> tags, I cannot seem to override the default action which is: upon pressing enter trigger the submit button. Is it even possible to override this and have the pressing enter event redirect the page to something other than whatever <form action is set to? Thanks.
Try
$('form').submit(function () {
return false;
});
This would really go against accessibility, but I think you could cancel the default action which is on the 'submit' event, with:
$('form#foo').submit(function(e) { e.preventDefault(); });
If I'm understanding correctly... or program that function to be dynamic and have it submit or not submit depending on a factor/flag.