I want to submit a data after click "ok" on validate pop up, in my case i can submit data of i'm click ok, but, if i click cancel or press "esc" button, its submiting to.
i dont know why, because this is work on another view.
I'm using Codeigniter Framework btw
This is Code from my problem
<script> $("#btn-selesai").click(function(){
var confirm = window.confirm("Apakah kamu sudah yakin selesai?"); if(confirm)$("#form-soal").submit();}); </script>
This is button for ("btn-selesai")
<Button id="btn-selesai" class="btn btn-primary btn-lg btn-block" >Selesai </Button>
And this is a form method and actions
<form id="form-soal" method="post" action="<?php echo site_url('JawabSoal/jawabanipa'); ?>">
The error is, if i click OK or Done, data is submited to database correctly, but, if i click cancel or press esc, data is submited too. i want if i press esc or click cancel, just close script.
return, however, is needed to pass the return value of confirm to the handler. When Cancel is clicked, false is returned, which then gets passed to the handler and this cancels the default action.
Just add return false; in else condition to stop the form submit.
$("#btn-selesai").click(function(){
if(window.confirm("Apakah kamu sudah yakin selesai?")){
$("#form-soal").submit();
}else{
return false;
}
});
Yo need to prevent default action of the form button.
<script>
$("#btn-selesai").click(function(e){
e.preventdefault() // This will prevent default submit action of the form
var confirm = window.confirm("Apakah kamu sudah yakin selesai?")
if(confirm){
$("#form-soal").submit()
}
})
</script>
Related
Can we run a js function on a submit button and php on the same button. I have a submit button that sends form data to a database using php, but I want a second action (JavaScript function) to take place once the button is clicked as well. Is that possible?
You can add onclick() event to submit button. it will execute before submitting the form.
var buttonClick = () => {
alert("Do what you want to do!"); // Add your second work here
}
<form action="yourfile.php">
<input type="submit" onclick="buttonClick();">
</form>
The correct method is to call the javascript function on the onsubmit attribute in the form with a return state. Thus the form will wait until the JavaScript returns true before proceeding with submit.
The HTML
<form action="something.php" onsubmit="return someJsFunction()">
<!-- form elements -->
<input type="submit" value="submit">
</form>
The JavaScript
function someJsFunction(){
//your validations or code
if(condition == false){
return false; // This will prevent the Form from submitting and lets
// you show error message or do some actions
}else{
return true; // this will submit the form and handle the control to php.
}
}
You can do this with the jQuery submit callback for this
$("form").submit(function(){
alert("Submitted");
});
see. https://www.w3schools.com/jquery/event_submit.asp
I want to submit my form via Ajax. I have done it before but for some reason whenever I click submit it will always submit the form and refresh the page. I made a test function just to console log once submit button is pressed but that doesn't even work.
Once I can get the console log working without page refreshing then I can do the Ajax myself since I know how.
Here is my form (keep in mind Im only going to post one input here just for an example).
function submit_form(e) {
e.preventDefault();
console.log('working');
return false;
};
{!! form_open('myaccount/product_coupon/add',['id' => 'product_coupon_form', 'onsubmit'=> 'submit_form']) !!}
Username <input type="text" name="username" class="form-control">
<input type="submit" class="btn btn-primary" id="submit">
</form>
I have also tried in javascript calling it by $('#submit').click(function()... but that still did nothing
1st: be sure you include jquery
2nd: wrap your code in $(document).ready(function(){ //code here })
3rd: you can use form submit instead of submit button click
$(document).ready(function(){
$('#product_coupon_form').on('submit' , function(e){
submit_form(e);
})
});
I have a form which does a 'post' to java code, on submit.
The requirement is as follows - On submit an alert box should come with 'ok' button where the user will read the info. and then click 'ok'.
This is just a info dialog, and nothing else.
But the alert box should stay there until he clicks 'ok' button.
I have given jquery submit and also tried form submit . The form is getting refreshed and alert box is going out of screen onsuccessful submit , as the entire form is getting posted and refreshes the screen.
You should use the confirmation box, and prevent the default action if it isn't confirmed. See my comments in the code.
$(function() {
$('form').on('submit', function(e) {
if( !window.confirm('Do you want to send this form') ) { /* ask for confirmation */
e.preventDefault(); /* if not confirmed, stop the default action, else send it */
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
<input type="text" />
<input type="submit" value="Send" />
</form>
I have a login form. No doubt it accepts username / password. And I have 2 buttons, submit button and a cancel button.
What I want to do is when user clicks on submit button, login request starts processing. User can see the login screen for 8-10 seconds. When he clicks on cancel button that should allow him to cancel form submission (cancel login).
Please let me know how to do this. I know there can be a js function but I haven't encountered any. Thanks a lot in advance!
Have you tried :
function cancel () {
document.execCommand('Stop')
}
<input type = "button" name="cancel" value = "cancel" onclick = "cancel()" />
When user sends the login request, the request and authentication must be handled by some server side script like php. So, put a link on the cancel button to another server side script. This script should try to logout the user. If he has already logged in, he will log out so the cancel works. In other case, if he hasn't than nothing happens, the script ends doing nothing.
here is simple example with this you can create your own
html code
<form name="f1" action="test.jsp" method="get">
username:<input type="text" name="username">
password:<input type="password" name='password'>
<input id="sub" type="submit" name="subm" value="subm">
<input id="reset" type="button" name="reset" value="reset">
</form>
and jquery code
$(document).ready(function()
{
$('#sub').click(function(){
$('form [name="f1"]').submit();
});
$('#reset').click(function(){
$('input[name="username"]').val('');
$('input[name="password"]').val('');
});
});
this is just a reference and you can modify and create accordingly with your requirements
My suggestion:
"cancel" button is hidden at first.
When "login" button is clicked, send a login request, hide or disable "login" button, and show "canccel" button. then setup a default handler for normal login procedures:
$.post('login', params, function(){handler.loginCallback()});
When "cancel" button is clicked, replace the handler with another procedure:
handler.loginCallback = function() { ... }
If login failed, do nothing; If login succeeded, send another logout request.
Suppose a form has multiple submit buttons:
...
<button type="submit" value="deletefoo">Delete Foo</button>
<button type="submit" value="deletebar">Delete Bar</button>
<button type="submit" value="Edit">Edit</button>
...
I am intercepting the clicks for only the 2 delete buttons and disabling the form submit to trigger a custom modal dialog which has OK and CANCEL buttons on it to confirm user choice. If user presses OK, I want to submit the form. If cancel, then dialog dismissed and nothing happens.
I have the first part wired up to trigger the dialog but I am at a loss on how to get the OK button in the dialog to trigger the form submit contingent on which original submit button was pressed (e.g. if Delete button pressed, I want to confirm with user they want to delete, then if so, submit the form as normal.
I've searched around and look at jQuery docs but haven't found the answer yet so I must be missing something really straightforward.
Update: I don't want to use JS confirm function. In my original question above I'm looking to use a custom modal dialog for various reasons.
Check out the JS confirm function and put it as an onclick event.
You have a nice example here.
Why not have them be regular buttons and then onclick set a variable to determine the action type and then when the form submits include this hidden variable and check that to find what you're supposed to do
First, you'd have to intercept both (all) the buttons, you could do this easily by fetching any of the submit buttons within a specific form, then you can ask your question and given you still have the current event handler, you can figure out what button was pressed and do the callback you'd like. For example:
<form id="myform">
<button type="submit" value="delete">Delete</button>
<button type="submit" value="Edit">Edit</button>
</form>
--
$(function() {
$("form#myform button[type='submit']").click(function(ev) {
ev.preventDefault();
if (confirm("you sure")) {
var action = $(ev.currentTarget).val();
console.log(action);
}
});
});
JSLint is here: http://jsfiddle.net/r48Cb/
Basically, console.log(action) will output either "delete" or "Edit" based on the original click. How you handle that value is up to you. A switch statement, a simple if block could work, but it's up to you, I don't know the scope of your app.
The window.confirm function returns a true if the user selects okay and a false if the user cancels. Using this logic you could do something like this:
<button id="delete" type="submit" value="delete">Delete</button>
<button type="submit" value="Edit">Edit</button>
var question;
$("#delete").click(function(){question=window.confirm("Are you sure?");)
if (question){
//Submit the form here
}
else{
alert("Not deleted!");
}
I think you are making it too complex, you can do something as simple as:
<form >
<input name="foo" value="foo">
<button name="sub0" value="sub0" onclick="
return window.confirm('sure?');
">submit 0</button>
<button name="sub1" value="sub1" onclick="
return window.confirm('sure?');
">submit 1</button>
</form>
If the user clicks OK on the confirm dialog, the form submits from whichever button was pressed. If not, it doesn't.
My 2c:
... (edited: removed the value parameter. buttons don't need that)
<button onclick='deleteFoo(); ' >Delete Foo</button>
<button onclick='deleteBar(); ' >Delete Bar</button>
<button onclick='allowEdit(); ' >Edit</button>
...
function deleteFoo() {
do-your-modal-whichever-way-you-want;
if confirmed,
$('#form-id').attr('action','your-action-for-delete-foo');
$('#form-id').submit();
else-just-return
}
function deleteBar() {
do-your-modal-whichever-way-you-want;
if confirmed,
$('#form-id').attr('action','your-action-for-delete-bar');
$('#form-id').submit();
else-just-return
}
function allowEdit() {
whatever
}