I have written some code to create a dymanic HTML form element for my application,I want on submit that form will post data and php will write to database.
here is the code
$("#add_id").click(function(name){
name=prompt("Task name");
if (name) {
$('.dashboard').append('<div class="each_task" id="task'+ count+'"><label>'+name+
'</label><form class="task_form" action="process_task.php" method="post"><div class="ctrl_btn" id="start'+
count+'"><input type="hidden" name="task_name" value="'+name+'" /><input name="task_start" type="hidden" id="start_time'+
count+'" value="" /><input class="task_start" type="submit" id="'+count+'" value="Start" /></form></div><form class="task_form" action="process_task.php" method="post"><div class="ctrl_btn" id="end'+count
+'"><input type="hidden" name="task_name" value="'+name+'" /><input name="task_end" type="hidden" id="end_time'+count+'" value="" /><input class="task_end" type="submit" id="'+count+'" value="End" /></form></div></div>').css('color', 'red');
Now when I submit the form it sends name and start_time or end_time value to php script which will insert data to database. the problem is dynamically created HTML element doesn't stick around.
Can anyone suggest how could I get around this problem and can have my dynamically created html stick to the page and also on submit post data to database.
Thanks
I'm happy to improve my answer if I didn't get your question accurately, but I'm assuming you want to stop the page from getting refreshed when you press the form submit button.
Here's a solution to prevent the page refresh using Javascript.
It is important to note that if you use this solution, you have to handle the form submission using Javascript and AJAX. An example of how to do this.
Related
For my php file, I need to grab the unique form name.
The php file is executed when a user clicks the submit button. However, there are multiple submit button each with the same id, but they all have unique names. I need the name when they click on the submit button.
you dont want elements in html with the same id - bad practice in general. Your page will likely load normally but an html validator will notice it as an error.
html validator: http://validator.w3.org/
without seeing your code, its difficult to give you a definitive answer. if you have miltuple forms you can use hidden inputs. e.g.
<input type="hidden" name="form_name" />
Otherwise you can use javascript to put data in the form when the button is clicked. example javascript using jquery
html:
<form id="formid" >
<button type="button" id="someid" onclick="submitForm('btn1')" />
<button type="button" id="someid" onclick="submitForm('btn2')" />
<input type="hidden" id="btnsubmitid" value="" />
</form>
js:
function submitForm(btnID){
$("#btnsubmitid").val(btnID);
$("#formid").submit();
}
1 way is to put a hidden input inside of your form.
<input type="hidden" name="formName" value="[name of form]" />
then in your php, you can get it using
$form-name = $_POST['formName'];
pretty sure there are other ways, but this came to mind first.
I am trying to save my form data into a wordpress database before submitting it. Please help. Heres my code and the php code to insert into database:
<form method="post" action="https://app.icontact.com/icp/signup.php" name="icpsignup"
id="icpsignup1030" accept-charset="UTF-8" onsubmit="return verifyRequired1030();">
<input type="hidden" name="redirect" value="http://www.123.com/thank-you.html">
<input type="hidden" name="errorredirect" value="http://www.123.com/error.html">
<input type="hidden" name="listid" value="16360">
<input type="hidden" name="specialid:16360" value="MA3A">
<input type="hidden" name="clientid" value="1259610">
<input type="hidden" name="formid" value="1030">
<input type="hidden" name="reallistid" value="1">
<input type="hidden" name="doubleopt" value="0">
<input type="text" name="fields_email" size="21" style="padding:5px;">
<input type="image" name="submit" src="signup button top.png" value="" height="32px">
</form>
And the code to insert into DB:
<?php
require_once('../../../wp-config.php');
global $wpdb;
$table_name = "icontact_emails";
$email = $_POST[fields_email];
if (trim($email) != ""){
$wpdb->insert($table_name, array('email' => $email, 'timestamp'=> date("Y- m-d h:i:s")));
}
?>
"Submitting" is the only way to transfer it to the server, whether you submit the form via AJAX or traditional methods - no difference.
Remember, this is a client-server model. The form is on the client, the DB is on the server.
I can INFER from your question that you really mean: I am trying to save this form to a database before I submit it to ANOTHER SITE which I don't control. Meaning you want to save it to your own database before you submit the data to a 3rd party.
If that's the case here's what I recommend:
Use the form's onSubmit event (<form onSubmit="YourJavasScriptMethod();">). Use JQuery and $.ajax() to read all of your form inputs and submit them to your own script which can save the values to the database. At the end of your onSubmit method be sure to return true so the browser will continue to submit the form.
Here's a pseudo-code example:
<form id="myForm" onSubmit="SaveToMyOwnDatabase();">
<input />... //your inputs
</form>
and your javascript:
function SaveToMyOwnDatabase()
{
// Create Json object by selecting each of the form inputs
// Call $.ajax and submit the Json to your script which processes the json
return true;
}
I would recommend using Contact Form 7 (WP plugin). There is a PHP hook built in that you can use to do this called wpcf7_before_send_mail. It will pass an object with all of the contact form data to your custom function(s) which you can use to write to the database or do other server side stuff. Here's a (really) short example (this goes in functions.php):
add_action( 'wpcf7_before_send_mail', 'save_contact_to_db' );
function save_contact_to_db( $cf7 ) {
$email = $cf7->posted_data['fields_email'];
// put database writing stuff here
}
There is a little more info to be had here. Also this link should be helpful since it's people discussing how to do exactly the same thing you are asking. There is also a plugin that will automatically write CF7 or Jetpack form submissions to the database for you but I've never used it so I can't comment on it. In general though I recommend using contact form 7 for this, especially since you are sending the form post data to a php script that is not on your server.
I think the solution is simple : submit your form to a PHP page that will : 1) save it in your database and 2) send it wherever you want. By far the simplest and most used solution in your case!
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.
I have MySQL generating forms on one page with the same action and submit button. The number of forms vary. They all call the same PHP file when submitted. Also, I have one PHP file which collects the data upon submission. See the example below.
The problem is when one of the forms is submitted, values get confused with different fields from different forms. Example: When form1 is submitted, PHP receives the form6's values.
How can I make sure each form submits its own values?
HTML Code Example:
<form method="POST" action="index.php?action=newhistory" name="history_1">
<input type="hidden" name="id" value="1">
<input type="text" name="history">
<input type="submit" name="add_history" value="Submit">
</form>
<form method="POST" action="index.php?action=newhistory" name="history_6">
<input type="hidden" name="id" value="6">
<input type="text" name="history">
<input type="submit" name="add_history" value="Submit">
</form>
PHP Code Example:
case 'newhistory':
$id = $_POST['id'];
$history = $_POST['history'];
$sql = mysql_query("INSERT INTO history (id, history) VALUES('".$id."', '".$history."')", $link);
break;
Any solutions?
It will submit the content encapsulated by the <form></form> tags. Having several form's action attribute point to the same page should not create the problem you describe.
The code you wrote here looks fine. Check your HTML code, and ensure you have the corrent <form></form> tags surrounding the elements of each form.
Please use different names for the submit button, then check.
if(isset($_POST('add_history'))
{
}
if(isset($_POST('add_history1'))
{
}
If you hit submit in one form, the browser is supposed to send only the values from this form. When form1 is submitted, PHP will NOT receive the form6's values. Maybe you didn't close the form tag properly or have any JavaScript going wild.
The problem I have is that I have multiple submit inputs in a single form. Each of these submit inputs has a different value and I would prefer to keep them as submit.
Whenever the user presses Enter, it is as though the topmost submit input is being pressed, and so it is causing problems for the code checking which input was clicked.
Is there a way for PHP to determine whether or not the input was clicked, or was just the input that was selected when the user pressed the Enter key?
You can identify which button was used provided you structure your HTML correctly
<input type="submit" name="action" value="Edit">
<input type="submit" name="action" value="Preview">
<input type="submit" name="action" value="Post">
The $_POST array (or $_GET/$_REQUEST) will contain the key "action" with the value of the enacted button (whether clicked or not).
Now, "clicking" is explicitly a client-side behavior - if you want to differentiate between a click and a keypress, you'll need to add some scripting to your form to aid in that determination.
Edit
Alternatively, you can be "sneaky" and use a hidden submit that should correctly identify a key-pressed for submission, but this probably has some significant impact on accessibility.
<?php
if ( 'POST' == $_SERVER['REQUEST_METHOD'] )
{
echo '<pre>';
print_r( $_POST );
echo '</pre>';
}
?>
<form method="post">
<input type="text" name="test" value="Hello World">
<input type="submit" name="action" value="None" style="display: none">
<input type="submit" name="action" value="Edit">
<input type="submit" name="action" value="Preview">
<input type="submit" name="action" value="Post">
</form>
Roberto,
PHP is server-side technology and therefore runs on the server - so there is no way for it to determine what keys where pressed at the client (aka the user). That is, of course, unless you specifically code the client-side to include such information with the server requests (posting form data is a form of request too).
One way to accomplish that is by using Javascript in your client code.
See this page as a starting point regarding handling form submit events using Javascript.
http://www.w3schools.com/jsref/jsref_onSubmit.asp
You may also have to add a listener for key press events on your page in order to capture the user pressing the Enter key and then recording this information.
http://www.howtocreate.co.uk/tutorials/javascript/domevents offers a discussion on the topic of adding/removing event listeners in Javascript but you have to be very careful when using events because improperly used they can be the source of memory leaks which are hard to debug and cause for unhappy users :)
PHP alone can't determine how the form submit event was triggered, because that happens on the client-side while PHP is a server-side language. You'd have to implement Javascript to listen for -- and log to the server-side -- key presses and mouse clicks, and then analyze that data to find what you're looking for.
Now, PHP can tell which submit input was triggered, as it will appear in the form data while the others will not. Most browsers make the first submit input the default (the one that is triggered on an Enter key press). You could re-order all your submits so as to control which submit is triggered.
PHP can't really know what happened on the client side.
I'd recommend using javascript. When the user do the action, catch it and store it in an hidden field that will be submited with the form. You can also keep track of what input is active and store it in an hidden field.
The code would go a bit like that (i didnt checked the syntax)
<input type="text" onfocus="setCurrent(this)" id="1" />
<input type="hidden" id="hid" />
function setCurrent(o){
$('hid').value = o.id;
}
I think that playing around with events catching and hidden fields should give you the result that you want.
Hope that helps
It's how you write the markup on the client side.
For example, here is one (non-XHTML) way you could do this:
In the HTML file:
<form method="post" action="myform.php" id="myform">
... form items here ...
<input type="submit" name="enter_key" value="true" style="display:none">
<input type="hidden" name="pressed_button" id="pressed_button" value="false">
<input type="button" value="Submit"
onclick="document.getElementById('pressed_button').value='true';document.getElementById('myform').submit();">
</form>
In myform.php:
if ($_POST['pressed_button']=='false') {
// Logic for enter key
} else {
// Logic for button press
}