Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 7 years ago.
Improve this question
I have a simple form with two HTML5 buttons. Each button submits the form to a different php page. This is working well, but the 'onsubmit' function is never triggered. I want to show a dialog box before the delete.php page is called.
<form method="post">
<input type="text" name="fname">
<!-- HTML5 FORMACTION -->
<button type="submit" name="update" formaction="update.php">Update</button>
<button type="submit" name="delete" onsubmit="return confirm('Do you really want to delete?');" formaction="delete.php">Delete</button>
</form>
I have tried different variations, but the javascript code is never triggered. Why?
Buttons don't have submit events, forms do.
Buttons have click events.
onsubmit is valid for a form, not for a button. You will have to use onclick instead of onsubmit.
try like this
<form method="post">
<input type="text" name="fname">
<!-- HTML5 FORMACTION -->
<button type="submit" name="update" formaction="update.php">Update</button>
<button type="button" name="delete" onclick="return delete();" formaction="delete.php">Delete</button>
</form>
<script>
function delete(){
if(confirm('Do you really want to delete?')){
// delete code
}
return false;
}
</script>
Related
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 5 years ago.
Improve this question
I would like to use jQuery to update value of attribute "accept" of an input element with type = "file", then active the "click" event of it. But after the value of "accept" is changed, nothing happens.
This is my code
//html elements
<button type="button" class="abc" title="Select files from your computer" id="upload" onclick="updateExtension()"></button>
<input type="file" name="image" id="image" multiple="multiple" /> //this input field is hidden and is applied with jquery-file-upload
//jQuery function
function updateExtension(){
$('#image').attr('accept', '.jpg, .png');
$('#image').click();
}
You can simply use :
$( "#image" ).trigger( "click" );
For more information on jQuery trigger click here.
Simple way use this one:--
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#click").click(function(){
//if update(div)content
$(".update_new_value").html("<h1>Enter content</h1>");
//if change attr value
$("#urls_change").attr("href", "https://www.changers.com/");
});
});
</script>
</head>
<body>
<div class="update_new_value"></div>
<p>change urls</p>
<button name="btn" id="click" type="button">Click Me</button>
</body>
</html>
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
I have a form that is used to update a record, at the bottom I have a submit button. I want it to display a messaging saying "Update Record:" and a Yes and No box.
Every way I've found is just for the confirmation popup, but I don't want a popup I want it to be buttons. So currently I have the below which gives me a confirmation popup
<form class=\"searchForm\" action=\"cd_update.php\" method=\"post\" onsubmit=\"return confirm('Are you sure you want to submit?');\">
<button type="submit" id="editButton">Update</button>
Is this possible to do? I'd need it to cd_update.php on the "Yes" and stay on page for the "No"
Thanks
I believe this code is what you are looking for. Remove the onsubmit handler if you wish, and swap out the onClick event on the no button to do something else. This will allow those buttons to handle your form without a confirm popup.
<form class="searchForm" method="post" onsubmit="alert('Record Updated');">
Update?
<button type="submit" id="yesButton">Yes</button>
<button id="noButton" onClick="alert('Not Updated')">No</button>
</form>
You would have to use a modal in order to customize it how you'd like. This can be as simple as doing it yourself (see below) or using a jQuery modal (which is also simple, but may be overkill.
http://jsfiddle.net/m7w0fcmf/1/
Styles
#confirm {
display:none;
}
HTML
<form id="form" class="searchForm" action="cd_update.php" method="post">
<div id="confirm">
Update Record:
<button id="yes">Yes</button>
<button id="no">No</button>
</div>
<button type="submit" id="editButton">Update</button>
</form>
JavaScript
document.getElementById('editButton').addEventListener('click', showConfirm);
document.getElementById('no').addEventListener('click', clickNo);
function showConfirm(e) {
e.preventDefault();
document.getElementById('confirm').style.display = 'block';
}
function clickNo(e) {
e.preventDefault();
document.getElementById('confirm').style.display = 'none';
}
Working fiddle.
You can create new div for confirmation message that will contain the two buttons you want Yes and No, after that add the js code that will show this confirmation div after the user click on Update button.
HTML :
<form class="searchForm" action="cd_update.php" method="post">
<div id="confirmation-msg" style="display:none">
Update Record?
<button type="submit" id="yesButton">Yes</button>
<button type="button" onClick="$('#confirmation-msg').hide()">No</button>
</div>
<button type="button" id="editButton">Update</button>
</form>
JS :
$('#editButton').click(function(){
$('#confirmation-msg').show();
});
Hope this helps.
Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 7 years ago.
Improve this question
I have a simple little form that takes a number of seconds to process. I'd like to do two things:
Disable the submit button so the user doesn't hit it multiple times
Show a progress bar while the form is being processed.
I have the following:
<script type="text/javascript">
function myFunction() {
document.getElementById('submit').disabled = true;
document.getElementById('prog').style.display = 'block';
}
</script>
<form method="POST" action="/page" onsubmit="myFunction();">
<input type="text" />
<div id="prog" class="progress" style="display:none;">
<div class="bar" style="width: 100%"></div>
</div>
<button id="submit" type="submit">Submit</button>
</form>
When I submit the form, however, I see the submit button gets disabled and the progress bar shows up but the form doesn't actually get processed. If I comment out the part that disables the submit button the form submits as normal and I see the progress bar.
Why does disabling the submit button screw up the form submission?
You could change the button type from submit to button
And, submit the form on click of the button from the javascript function
Try this code..
<script type="text/javascript">
function myFunction() {
document.getElementById('submit').disabled = true;
document.getElementById('prog').style.display = 'block';
document.getElementById('myForm').submit();
}
</script>
<form method="POST" action="/page" id="myForm">
<input type="text" />
<div id="prog" class="progress" style="display:none;">
<div class="bar" style="width: 100%"></div>
</div>
<button id="submit" type="button" onclick="myFunction();">Submit</button>
</form>
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
I've following two javascript code snippets written for same purpose but only one is working. Why so?
The Working script is as below:
<script language="javascript">
function Redirect(){
window.location.assign("login.php")
}
</script>
<button type="button" class="btn btn-primary" name="cancel" id="cancel" onClick="return Redirect()">Cancel</button>
The non-workable code is as follows:
<button type="submit" class="btn btn-primary" name="submit" id="submit" value="" onclick="javascript:window.location.href='login.php'">Back</button>
But I want the script to be written like the second one only. I can't use first approach though it's working. Can any one please correct the second code snippet and make it workable like first script? Thanks in advance.
Instead of submit, try using input type button...
<input type="button" class="btn btn-primary" name="submit" id="submit" value="Back" onclick="javascript:window.location='login.php'" />
The working script uses window.location.assign() whereas the non-working code tries to set window.location.href directly.
Your second example also uses a submit button whereas your first uses a regular button. Since you don't return false from your click handler, the form gets submitted and the fact that you set the href is void. Unless you're actually submitting the form, don't use a submit button.
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking for code must demonstrate a minimal understanding of the problem being solved. Include attempted solutions, why they didn't work, and the expected results. See also: Stack Overflow question checklist
Closed 9 years ago.
Improve this question
I have a page where I display results form database and there are checkboxs which filter ther results. The problem is that I don't want to use submit button because I would like to let the user only click on the checkboxes to get the desired results. So is there anyway using javascript or jquery to submit a form when checkbox is checked with no submit button? if you see on shopping sites there are no submit buttons just the checkboxes..Like that. thanks
<form>
<input type="checkbox" name="size" > Size
</form>
here is the php
<?php if (isset($_POST["size"])){
//do something
?>
<form id="form" method="post" action="">
<input type="checkbox" name="checkbox" class="checkbox"/>
</form>
<script type="text/javascript">
$(function(){
$('.checkbox').on('change',function(){
$('#form').submit();
});
});
</script>
OR
<form id="form" method="post" action="">
<input type="checkbox" onchange="$('#form').submit();" name="checkbox" class="checkbox"/>
</form>
$(input:name=[checkboxname]).change(function(){
$('#form').submit();
});
alternately
$('#checkboxId').click(function(){
$('#formId').submit();
});
of course additional parameters can be passed withing the submit() function for ajax, etc.