HTML - Form Submit Button Confirmation Dialog - php

this is a general form code
<form name="search_form" action="" method="POST">
<input type="text" name="search_text">
<input type="submit" name="search_bt" value="Go">
</form>
is there a way could have a confirmation dialog saying 'Yes'\'No' or 'Confirm'\'Cancel' etc...
One way i figured of dong is is with CSS Layer and JavaScript and Php... that have a php isset(){} chechk on the button and when set display a Div displayed with two buttons and onclick=func() JS function of those buttons have a php variable(flag) set and then i can if(flag){} to continue or skip some code...
well that is going to work and plus point is that i can have a well themed dialog box but i just wanna make my life easier...

You can also do it with one line in the form tag itself
<form action="exampleHandlerPage.php" method="post" onsubmit="return confirm('Are you sure you want to submit?');">

If you have 2 or more submit buttons in one form:
<input type="submit" value="Edit">
<input type="submit" name="delete" value="Delete" onclick="return confirm('Confirm, please.');">
The dialog shows up only when you click the Delete button.

Using raw javascript without any div...
You can have this function
function confirmSubmit() {
if (confirm("Are you sure you want to submit the form?")) {
document.getElementById("FORM_ID").submit();
}
return false;
}
And you can call that function from the onsubmit event in the form, or on the onclick event in the button.
By the way, have you heard about JQuery. Its a JS Library with a lot of helpful things that give you a comfort and beauty way of coding javascript.
As an example of what you want to get done, take this confirmation dialog from JQuery as example

<form action="<form handler>" method="post" onsubmit="return confirm('Are you sure you want to submit?')">
is this javascript can be store diferent from tag "form", replace
return confirm(...)
with something like
return sendata(...)

Related

How to target input box that's not in html form - PHP?

I'm new to PHP, so my entire perspective of how I should build something like this might be wrong, so please give tips as needed!
Pretty much the app should push data to the db when submit is clicked. I handle that with a form in the html and this code in PHP (let's ignore injection hacking for now...)
if(isset($_POST['submit']))
{
$book = $_POST['book-num'];
...
The submit button is in a form like such
<div class="submission-field">
<form method="post"><input class="submit-report" type="submit" name="submit" value="Submit"/></form>
</div>
The problem I'm having is how to target the numerical input box (book-num) if it's not in a form? My input box and submission button aren't anywhere near eachother so I couldn't wrap it with the same <form> tag the submit button is in. How do I handle this?
use js can help you:
<form>
<input type="hidden" name="book-num" id="book-num">
</form>
...........
<input type="text" name="book-num-input" onchange="fillIn('book-num',this)">
<script>
function fillIn(input_id,input){
document.getElementById(input_id).value = input.value;
}
</script>

How can I submit a form using an image in php

I want to submit a form to the database and I want to use a sprite image instead of regular submit buttons..
Here is the images I'm using
<div class="cancel">
</div>
<div class="save_and_new">
</div>
<div class="save_and_quit">
</div>
if(isset(......)){
}
I have no idea what to put in the isset function ...
Do i need to set names to the images? or what?
You could just use
<input type="image src="/your/button/image/here.gif" />
instead of the images nested inside anchors.
The only problem would be that you can't directly sense which button exactly was pressed because <input type="image" /> does not post a value. If you really need multiple post buttons that also post a value:
<button name="button" value="action1"><img src="/your/image/here.gif" alt="action 1" /></button>
<button name="button" value="action2"><img src="/your/image/here.gif" alt="action 2" /></button>
You can do it in Jquery. Try this,
$("#save_and_new_btn").click(function() {
$("#form").submit();
});
#form is id of form
Generally, a form is submitted when the user presses a submit button. However, sometimes, you may need to submit the form programmatically using JavaScript.
JavaScript provides the form object that contains the submit() method. Use the ‘id’ of the form to get the form object.
For example, if the name of your form is ‘myform’, the JavaScript code for the submit call is:
document.forms["myform"].submit();
But, how to identify a form? Give an id attribute in the form tag
<form id='myform' action='formmail.pl'>
Here is the code to submit a form when a hyperlink is clicked:
<form name="myform" action="handle-data.php">
Search: <input type='text' name='query' />
Search
</form>
<script type="text/javascript">
function submitform()
{
document.myform.submit();
}
</script>
Source: How to Submit a Form Using JavaScript
You need to use javascript.
Find a form which has to be submitted. Then add actions to each elements. Whene they're clicked you are submitting (or canceling) form.

PHP code regarding multiple submit button on single form

i have two submit button on my index page namely International and Domestic. i want that two different button to point to different pages namely int.php and dom.php when i click on the buttons. can you help me out. thank
while it is allowed only to define single action = "" for form element. but if i have to do that, i would do it this way.
<form action ="somepage.php" method="post">
<!--all your input elements-->
<input type="submit" name ="international" value="international"/>
<input type="submit" name ="domestic" value="domestic"/>
</form>
determine which button have been clicked and act accordingly.
if(isset($_POST['domestic']) {
//include dom.php
}
else if(isset($_POST['international']) {
//include int.php
}
and then you can include the necessary file.
or the other way is to go with AJAX/jQuery way
you can just use switch in php for differ or
use javascript
Do it with jquery! First, dont create submit buttons just create
<input type="button" />
Than give them an id like:
<input type="button" id="InternationalBTN" />
<input type="button" id="DomesticBTN" />
and with jquery bind the action
$(document).ready(function(){
$("#InternationalBTN").bind('click',function(){
$('#idOfYourForm').attr('action','setTheDestinationPageHere');
document.forms['nameOfYourForm'].submit();
});
});
That will not be possible since your form's action attribute can only point to one location at a time and both buttons are in the same form(but possible if you use AJAX).
If you wanted to use pure PHP (i.e. no Javascript involved), you'd have to write two different handlers for the different button clicks, like below:
if(isset($_POST["name_of_international_button"])){
//actions to perform for this --
}
if(isset($_POST["name_of_domestic_button"])){
//action to perform for this
}
In the actions part of each of the handlers, you could then do a redirect, with the URL containing the data to be processed either in the int.php or dom.php scripts
You can do it in this way:
In form tag please leave empty action action=""
2 buttons to send:
<input class="btnSend" type="submit" name="International" value="International" id="International"/>
<input class="btnSend" type="submit" name="Domestic" value="Domestic" id="Domestic"/>
and use ajax:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script>
$(document).ready(function(){
$('#International ').click(function() {
// send to file 1 using ajax
});
$('#Domestic').click(function() {
// send to file 2 using ajax
});
});
</script>
Here is how to send data using ajax:
http://net.tutsplus.com/tutorials/javascript-ajax/submit-a-form-without-page-refresh-using-jquery/
Your form action would have to contain some sort of conditional statement to redirect users based on which submit button is clicked
<form action="<?php if(isset($_POST['international'])){echo 'international.php';}else{echo 'domestic.php';}?>" method="post">
<input type="text" name="field1" />
<input type="text" name="field2"/>
<input type="submit" value="international "name="international"/>
<input type="submit" value="domestic "name="domestic"/>
</form>
Or you could set up your conditionals on a page specified by the form actionand have them redirect based on which button was clicked,
Just put a form tag, and set the action to the page. Then the submit button will navigate to that page where the action tag is pointing to...
Easy as that :D

Upload Progress bar within form data

I try to create an upload progress bar with PHP and jQuery. However, I have a problem when I bring it to the form data. The code is similar like this:
<form method="post" action="upload.php" enctype="multipart/form-data" id="upload-form" target="upload-frame">
Suburb:<input type="text" name="txtSuburb" id="txtSuburb">
Picture:
<input type="hidden" id="uid" name="UPLOAD_IDENTIFIER" value="<?php echo $uid; ?>">
<input type="file" name="file">
<input type="button" name="submit" value="Upload!">
<iframe id="upload-frame" name="upload-frame">
</iframe>
<input type="submit" name="DataSubmit" value="Submit Data"/>
</form>
As you can see, I got 2 submit buttons. If I keep the form like this then the form can't submit data to server. It just submits the file to iFrame. If I change the action and target of the form then the upload progress function will not work.
Could anyone please help me to find the solution for this?
I want the user can click on upload button to upload their file. Then they can take the rest to fill the form. When everything is done, they can click on another submit data button to submit their data (included the file) to the server.
Make sure that you have only one input element of type submit within your form.
If you want the first button to trigger some Javascript, use a regular input element or even a styled link and attach a Javascript event to it's onclick event, then prevent it's default behavior, e.g. by returning false.
Like this only the second button will actually submit your form which should do what you're describing.
In general I'd second #Treffynnon's suggestion to use a existing library for this purpose. These hacks have a tendency to get pretty nasty, especially when it comes to crossbrowser compatibility.

AJAX: How do I make the button submit after I press "Enter"?

Currently, I am using an with ajax to update my mysql. Now, I have to click on the button with the mouse for it to work (I am using onclick), but how can I make it accept the "enter" button? My guess is... Enter isn't working because isn't there. If I leave it there, my ajax just doesn't move.
Use a <input type="submit> instead of a <button> or type="button" and then hook into the forms' onsubmit event.
For example:
<form action="#" onsubmit="alert('Hello world!'); return false">
<input type="text" name="myText" id="myText" />
<input type="submit" value="Submit" />
</form>
The return false ensures that the browser doesn't actually submit a form.
If you're in an HTML form, then enter will submit the data. You only have to write in the onsubmit event handler to do your ajax calls.
If you're not in an HTML form, check for the key press event handler. Maybe it's what you're looking for.

Categories