I'm still a learner on PHP.
I have a button, and it shall run a JavaScript after clicking it, but I want it to show an alert / pop up for users to confirm whether to continue or to abort.
Can I do the function in my PHP file in the button code?
<TD style='text-align:left;padding:0;margin:0;'>
<INPUT type='button' onmouseup="javascript:JS1();" value='JS1'></INPUT>
</TD>
you need to make function and use confirm();
<TD style='text-align:left;padding:0;margin:0;'>
<INPUT type='button' onmouseup="myFunction();" value='JS1'></INPUT>
</TD>
And
<script>
function myFunction() {
confirm("Please confrim");
}
</script>
Writing code is not what is supposed here.
But, still following pseudo code and concepts should work.
Steps:
If you are using jQuery, bind the event of click. If you are using core Javscript, use onclick attribute.
In the onclick function, add a confirmation popup.
confirm() returns true if user selects yes, or else it will return false.
Now, you have to proceed only if true is returned by confirm().
And javascript code:
<script>
function JS1() {
if (confirm('Your confirmation message')) {
// Write your code of form submit/button click handler.
}
else {
return false;
}
}
</script>
Have you tried bootstrap modal?
https://www.w3schools.com/bootstrap/bootstrap_modal.asp
https://getbootstrap.com/docs/4.0/components/modal/
https://getbootstrap.com/docs/3.3/javascript/
I have provided 3 links. I think these might help you a little. Do a research and it won't be very hard. Good luck.
Related
I want to add a button on my website, where a User can delete his Account. Unfortunately I don't know how to realize it...
my Code so far:
Javascript:
<script language = "JavaScript" >
function delete(id) {
if (confirm("Do your really want to delete your account?"))
{
header("refresh:1;url=intern.php?act=account");
}
else
{
}
}
</script>
my .html file:(there are no tags like html title head... it begins with ?php..)
<td></form><input type='submit' name='deleteuser' value='Delete Account' onClick='return delete()'/></form></td>
Also i have an if clause in the .html file:
if(isset($_POST['deleteuser'])) {
if(delete() == true){
delete_user;
}
else{
header("refresh:1;url=intern.php?act=account");
}
}
The Button is there and when I click on it, it asks me if I'm sure to delete my account, but afterwards I got an error: "Fatal Error:Call to undefined function delete() "
I have a stored procedure named: sp_deleteAccount. In my config.php I declared it as:
$SQL_delete_user = "CALL sp_deleteAccount('";
Now I don't know how to bind that stored procedure in the code so that the Account will be deleted after pressing "Yes I want to delete my Account".
Hope I didn't miss anything and someone can help me
JOP
In this portion you're calling a php redirect(i think?) in javascript without php open tag so that's not going to work. Instead you can use a javascript reditrect if the 'if' statement returns true(yes) then redirect to a url with a get variable of delete or something, see below.
edit -- you'll probably want the id as well so i made adjustments. PLus in the onclick in the form you'll need to pass the id, unless it's stored in a session variable or something, in which case you don't need to pass it into the url. your sql should end with "WHERE id=" then just tack the id onto the query. This is just a simple example to get you started, always be cautious of sql injection, but i'll leave preventing it up to you.
<script language = "JavaScript" >
function deleteUser(id) {
if (confirm("Do your really want to delete your account?"))
{
window.location.href= 'intern.php?delete=true&id='+id;
}
else
{
window.location.href = 'intern.php?act=account';
}
}
</script>
next in intern.php check for the get variable
if(isset($_GET['delete'])) {
$mysqli = new mysqli(connection variables here);
$mysqli->query($SQL_delete_user.(int)$_GET['id']);
}
give that a try, rearrange the code as you like but that should get it done.
as for the error, you can't use the keyword delete for a function name. One last thing, for this to work make the input type "button"
I am not sure there might be a way to achieve it using the approach you are trying , but I am not aware of it. For this I would typically use an ajax call to an url, on the click event of the OK button in the jquery-ui Dialog. And then process the logic and on success create another dialog for confirmation.
I searched and struggled with this issue until I did a little lateral thinking.
I used JavaScript to show a hidden div containing the Yes/No options.
Then an onClick around the Yes option which loaded the php script into a hidden iFrame.
The onClick around the No option simply hid the div and did nothing else.
A bonus is being able to style the div any way I wanted, show and hide it with an effect and place it exactly where it looked best.
I use the POST/REDIRECT/GET trick to prevent refresh-resend of forms.
Now I would like to disable a form submit button (after click) that should not be clicked twice.
Although I tried all javascript examples I found, they all conflict with POST/REDIRECT/GET.
In most cases it doesn't even submit but just redirects to itself.
Any solution ? Thanks for your help.
Something I've tried and conflicts is this example:
the script first runs headers.php with this in:
if (isset($_POST['start-diff-scan']))
{
$_SESSION['SCAN_START'] = true;
header('HTTP/1.1 303 See Other');
header('Location: '.APP_URL.'scan.php');
exit;
}
and then scan.php with this form:
<form name="start-diff-scan" id="start-diff-scan" method="post">
<button
name="start-scan"
id="start-scan"
value=""
class="start-scan btn btn-primary"
type="submit"
method="post">
Start New Scan
</button>
</form>
and works fine. but the js trick conflicts this. I added the js code at the very end of scan.php
<script>
$('#start-diff-scan').submit(function()
{
$('#start-scan').prop('disabled', true);
});
</script>
What happens is it only redirects to the same page (scan.php) without executing anything.
Thanks for all yoru answers and help so far this is great.
Any ideas appreciated thanks very much
You cannot prevent it this way, since it's user-side scripting, and people can easily delete this code, before sending the form. Even you disable the button. Make checks in your server-side script, whether the request is already inserted, so you will display them either an error, or get them back to the page
$('#start-scan').attr("disabled", true);
Should work
If the "disable" method is messing up your code and all else fails :
You can try to overlay the button with a "loader gif" making it not clickable.
$('#start-scan').click(function()
{
$('#start-scan').before('<div>LOADING</div>'); //Set the loading overlay width, height and background-color
});
The problem you have is setting the disabled when the person clicks causes the button to be disabled and the click action does not fire off.
Add a setTimeout to delay setting the disabled property.
Other option is to hide the button and replace it with text that says submitting.
$('#start-scan').attr('disabled', true);
or use
.prop("disabled", true)
$('#start-scan').prop("disabled", true)
You can just add this in the form:
onClick="this.disabled=true"
try prop()
$('#start-scan').prop('disabled', true);
i have one link for buy credit . i want when click on link confirm show so if user click yes link direct . but in my page when i click yes or no link direct me to href link . means yes or no not difrent and link work.
<script>
<!--
function confirmbuy() {
if (confirm("Are You Sure???")) {
return true;
} else {
return false;
}
}
//-->
</script>
Buy
i test this code for submit button and work propertly but for link not work !!!
Your event handler function (defined by the value of the intrinsic event attribute) doesn't return anything. It just calls confirmbuy and then stops.
If you want to return the return value of confirmbuy then you must do so explicitly:
onclick="return confirmbuy();">
You wouldn't have this problem is confirmbuy was the event handler:
ref_to_link.addEventListener('click', confirmbuy);
I recommend reading more about addEventListener and Unobtrusive Javascript.
You need to return the result of the confirmbuy() function, otherwise the event will never be cancelled.
Buy
Inline handlers are actually put into a function, which is set as the handler for the click event. So basically your code is equivalent to:
a.addEventListener("click",function(e){
confirmbuy();
})
As you can see, this handler does not return false, so the event progresses as normal.
you need:
onclick="return confirmbuy();"
better..
Buy
Fixed and removed unnecessary code:
Buy
I have a button in HTML linked to a page with features like emails. I'm trying to figure out how to alert the user by using a number on my button that'll tell the user how many messages they have before they click on the button to view them. It's pretty much an alert without a popup. I prefer the programming languages to be either HTML5, jQuery, PHP, or JavaScript if possible.
The wording doesn't have to match mine, I just need an example on how to do that alert I asked for. Thanks for your help in advance!
Here's an example of my button:
<form method = "link" action = "messages.html">
<input type = "submit" value = "Messages">
</form>
Expanding on B7ackAnge7z answer.
I would always suggest against using inline javascript. Why? Because it is awful to edit in the future, which you inevitably will need to.
So my suggestion would be to make a function that does this for you.
Heres the jsfiddle -> http://jsfiddle.net/CSZ9L/
And here is the code.
The html
<input class="messageBox" type="submit" value="Messages" data-message="Heres the message" />
The javascript, including jQuery
$(".messageBox").click(function() {
alert($(this).attr("data-message"));
});
You can set a class of messageBox to any item you want to alert a message for. Then using php you can fill the data-message attribute with your message. The javascript will handle the rest.
<input type = "submit" value = "You have <?php echo getNumMessages(); ?> new mail messages. yayyyyyyyy i got mail yayyy...">
php function
function getNumMessages() {
return 5;
}
To show an alert message use onclick:
<input type="submit" value="Messages" onclick="alert('hello world!')" />
I have a simple form which accepts a Title and a Contents variable from a textbox and a textarea. The form will send its data to a file called add-post.php. However, I am looking for a way to alert the user that either the textbox or the textarea has invalid data (is empty) in case they click the submission button.
I was thinking that an alert() popup box would be the best idea because it doesn't redirect to any other page and the user never loses their data (imagine they entered a whole lot of text but forgot a title. Sending the data to add-post.php and performing the check there will result in loss of data for the user).
However, I'm not sure how to actually implement the alert() popup. How would I make it so that the check is done AFTER they have clicked the submit button but BEFORE the data is sent off to the next file. Any advice is appreciated.
On your form add something like this
<form name="frm1" onsubmit="InputChecker()">
Then in javascript
<script type="text/javascript">
function InputChecker()
{
if(document.getElementById({formElement}) != '') { // not empty
alert("This element needs data"); // Pop an alert
return false; // Prevent form from submitting
}
}
</script>
Also as others have said jQuery makes this a little bit easier. I highly recommend the jQuery Validate Plugin
Some people do find the alert box "annoying", so it may be better to append a message into the DOM to let the user know what needs to be fixed. This is useful if there are numerous errors as the errors will be more persistent allowing the user to see all the things they need to be fixed. Again, the jQuery Validate plugin has this functionality built in.
Attach an onsubmit event to the form, and return false; to stop the submission if checks fail.
Form validation with Javascript. Or easier with jQuery.
Basically, validate the form when the submit button is clicked (with an onsubmit handler), and then use an alert() box if needed. By the way, people usually hate alert boxes.
You have a number of options when it comes to client side validation. This is just one.
<form id="tehForm" method="post">
<input type="text" id="data2check" >
<input type="button" id="btnSubmit" />
</form>
<script type="text/javascript">
function submit_form(){
if(document.getElementById("data2check").value!="correct value"){
alert("this is wrong");
}else{
document.getElementById("tehForm").submit();
}
}
</script>
For a more indepth example check out this link