I need to open from the index.php receipt.php and hide the button as receipt is already made, ie. two events in one submit button. This hides the button but the submit doesn't trigger.
<action =receipt.php target="_blank"><input type="submit" value="Receipt" onClick="hideme();this.form.submit()" id="abc"> ... *rest of the form inputs* </form>
<script>
function hideme() {
,document.getElementById("abc").innerHTML = "";
}
</script>
If you use the hideme function to submit the form in addition to hiding/modifying the submit button you could try like this:
Add an event argument to the inline onclick function call - that allows the function to access all the properties of the event and the important one here is the target
This should disabled the button and modify the value AND submit the form to a new window with a single event..
You could uncomment the line that removes the button as alternative or simply set the button's value as empty.
function hideme(e) {
e.preventDefault();
e.target.parentNode.submit();
//e.target.parentNode.removeChild(e.target);//to remove the button completely or...
e.target.value='Submitted';
e.target.disabled=true;
}
<form action='receipt.php' target='_blank'>
<input type="submit" value="Receipt" onclick="hideme(event);" />
<!--
*rest of the form inputs*
-->
</form>
Related
<button id="Submit" onclick= "write_task_content()"> Submit.</button>
I have this code written on my page for submit button. write_task_content() function is writing the activity of users into the file. I need to redirect to another page which is in another directory when same submit button being clicked.
for example:
Current path C:\xampp\htdocs\CC_real task\3GBCJUK5B10I32J9O2EJNNQ339GPKH.html where Submit is written. where write_task_content() function needs to be executed to save user activity and with the same button redirect to another page in the same window browser C:\xampp\htdocs\IA_real task\3RKALKFQG14FDCEAT1S123EW94A792.
How could I do that?
First create your submit button:
<form action="destination-page.html">
<input type="Submit" value="Submit" />
</form>
Then, in the <script>...</script>, attach an onsubmit event to the form either using javascript or jquery:
Javascript:
var form = document.getElementsByTagName('form')[0];
form.addEventListener('submit',write_task_content,false);
jQuery:
$(document).ready(
$('form').submit(write_task_content);
);
When the submit button is clicked, write_task_content() will execute first and then the browser will request destination-page.html.
After saving the details use
window.location = "http://www.example.com";
This redirects to another location.
I have a JavaScript that changes the attribute of the input button to "disabled", so the user don't submit the page twice.
// Disables multiple submit
function disableSubmit (btn, submitForm) {
// Sets button as disabled, changes class and cursor
$(btn).attr("disabled", true);
$(btn).toggleClass("disabled alt2");
$(btn).css('cursor', 'initial');
$(btn).attr("value", "Sender...");
// Submits form
$(submitForm).submit();
}
// Disables submit for order form
$("#send-order").click(function () {
return disableSubmit(this, "#order");
});
The problem is that I need to track the name of the button submitting the page so I can handle it in my Django view.py file.
HTML
<input value="Send bestilling" id="foo" name="send-order" type="submit" class="button alt2">
View.py
request.POST.get("send-order", False)
But if I use my script to submit the page, I can't get the name of the input submitting the page. Is there any way to set a name for the button submitting the page in my script?
I tried this but didn't work:
$(submitForm).submit().attr("name", "send-order");
Solution
I had to change the code inside views.py in order to make this work.
you can use preventdefault or return false
$("#send-order").click(function (event) {
event.preventDefault();
return disableSubmit(this, "#order");
});
Or
<input id="send-order" value="Send" type="submit" onclick="disableSubmit(this, '#order');return false" />
One way you can do this is by creating a hidden input on your form, with a name of its own. Something like below.
<input type="hidden" name="buttonName" id="buttonName" />
Then, in your disableSubmit function, make it set the value of that input before submitting.
$(submitForm)
.find("input[name=buttonName]")
.attr("value",
$(btn).attr("name")
);
From there, you can just retrieve the "buttonName" value in your View.py.
I have a div. That div has an action. The div also has a form tag as a child. That form tag has an on submit action. While there is an action on my div the form submit action is never called. Is this correct?
http://emberjs.jsbin.com/jeyaxodugi/1/edit?html,js,console,output
In the above fiddle try removing the div's action and then the form submit action will work fine. How can I ensure that both actions are called not just the parent.
By default the action helper will call Event#preventDefault so when you click in the submit button, the divClick is executed, preventDefault is called and as a consequence formSubmit will not be called. To avoid this you can use the option preventDefault=false like {{ action "divClick" preventDefault=false}}>.
After this you will notice that both divClick and formSubmit will be triggered if you click in the submit button, this happen because the click event bubbles from the button to the div, if you don't want this behavior you can use bubbles=false in your submit button, like the following <input type="submit" value="submit" {{action "formSubmit" bubbles=false}}>
This is the final code
<div id="my-div" {{ action "divClick" preventDefault=false}}>
Hello World
<form {{action "formSubmit" on="submit" }}>
<input type="submit" value="submit" {{action "formSubmit" bubbles=false}}>
</form>
</div>
And the updated jsbin http://emberjs.jsbin.com/doroqocafu/1/edit?html,js,output
You can find more info about this in action helper docs
I hope it helps
I am trying to call a JavaScript function when the submit button of a form is clicked.
For some reason, the function is not called when it is named 'submit', but when it is named anything else, it works.
I should also note that when the button is taken out of the form tags, the function also works.
Can anyone please explain why when it is inside the form it does not work with that name?
Here is the code:
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
function submit(){
console.log('test');
}
</script>
</head>
<body>
<form>
<input type="text"/>
<input type="submit" onclick="submit()"/>
</form>
</body>
</html>
Because submit() is the reserved function to submit a form in core JS.
For example, if your form had an id like myform, you could do this to submit it via JS:
document.form['myform'].submit();
So calling that function you're actually submitting the form and not calling your custom function.
EDIT: I forgot to mention, it only works inside the form because it's calling the submit function of that form. Out of it it's not available anymore (since the body tag doesn't have a submit function).
Form elements are placed on the scope chain of listeners within the form as if by:
with (form) {
/* run listener code */
}
so the identifier submit is first resolved in the context of the handler, then on the form before the rest of the scope chain. This is unique to forms and can be seen in the following:
<form>
<input name="foo">
<input type="button" value="Do click" onclick="
function submit(){console.log('click')};
submit();
">
</form>
where clicking the button runs the submit function within listener, and removing the function declaration runs the form's submit method. This is unique to forms.
Note that when a form's submit method is called directly, its submit handler is not called.
Outside of the form, the identifier submit is resolved in the normal way.
We are currently building an application using Dojo Mobile and there are several areas where we have input fields and submit buttons. These input fields and submit buttons do are not in a form, and we just use onclick events to "submit" the values in the fields to be utilized in the javascript. Is there a way to make it so that when we press "enter", or, in the case of mobile applications, when the user presses "search" or "go" on their soft keyboard, it will trigger that particular button? We could potentially have multiple submit buttons on the same page.
...
<div>
<input dojoType="dijit.form.TextBox" />
<button dojoType="dijit.form.Button" type="submit">
Filter
</button>
<div>
...
Place your related fields in a form. Register an "onsubmit" event handler and make it the same as your "onclick" handler for the button. When you return from the event handler, you should either return false or you should call event.preventDefault(). This will prevent the form from being submitted (via POST) to the server.
solution in JQuery:
//when you a key on an input
$("input").keyup(function (e) {
//if it is enter
if (e.keyCode == 13) {
//look for the next submit button a trigger a click
$(this).next("button[type='submit']").click();
}
});
I'm not a dojo-coder but the documentation seems quite good:
http://dojotoolkit.org/documentation/tutorials/1.6/key_events/
http://dojotoolkit.org/api/1.6/dojo/keys/ENTER
see here for related answer:
Enter key press event in JavaScript
http://dojo-toolkit.33424.n3.nabble.com/want-enter-key-in-ValidationTextBox-to-submit-the-form-td977303.html
Overriding the Default Form Submit Action
You can override the default submit action on a form. It's semantically wise to keep your forms within <form> tags, even when you want to override the default behavior, and do what you want, as the strong, independent black woman that you are.
jsFiddle
HTML:
<form id="myForm">
<input type="text" />
<button type="submit">Submit</button>
</form>
JavaScript:
var myForm = document.getElementById('myForm');
myForm.addEventListener('submit',function(event){
alert('submit pressed -- do as you please');
event.preventDefault(); // cancels form submission
});
//Chase.