I need to dynamically add form elements to an HTML form as soon as the Submit button is clicked but before the POST data is sent to a server. The new elements must be "read" from a PHP file on my server.
HISTORY:
Currently my HTML form has "hidden" fields that are submitted to another server for processing. I have no control over the other server. My problem is that anyone can edit these hidden fields.
How can I dynamically add form elements to the POST data as soon as the form is submitted?
You can try it this way:
First disable the submit by changing the submit button type from 'submit' to 'button' (or whatever)
Put in onclick on that button to a javascript routine (here i use submit_form()).
Create an empty div within your form. (here i call it with id = 'dynamic')
Using jquery, this is the submit_form().
I think you will need to give it some time for these elements to bind properly before submitting. Maybe a short time delay before $("#myForm").submit();
Here is the code for the submit_form() function:
function submit_form()
{
$("#dynamic").append("<input type='hidden' name='input1' value='whatever'>");
$("#dynamic").append("<input type='hidden' name='input2' value='whatever'>");
$("#myForm").submit();
}
You can post the data to your server and after it post again to the external server with the new elements attached.
Your job is done on server side.
See also:
php server-to-server post?
If you need any control over what is submitted to the other server, you have to do that yourself. Make the form submit to your own server, then validate it, add your data and re-submit it to the other server.
You can use the CURL extension in PHP to post data from your server.
Related
I'd like to know what is the difference between HTTP web form POST and button submit click, are they having totally different functioning or they are identical to each other?
I have fiddler, where I tried to emulate the incoming and ongoing POST and GET statements, POST sends the request and concatenate the input area parameters at the end of request, but that still doesn't give me clue whether, POST and sumbmit are identical or not.
HTTP POST:
It is one of the HTTP method to send your data to your respective
script path.
This is the secure method where data is not being shown
in the URL as HTTP GET method.
The data will be send to the desired script via
the headers.
SUBMIT BUTTON CLICK :
It is one of the event of web form through which the data into the
form inputs will get posted to the script path present in the
action attribute of form.
Now what will happen if the form has the two submit buttons?
First thing is that this is the rare case when we need two submit buttons because we can click one button at a time only.
Lets say we have following two buttons in some demo form as follow
<form name="profileForm" action="saveprofile.php" method = "POST">
// Your input fields go here
<button class = "any_button_name" type= "submit " name ="save_profile" value ="save_profile" >Save Profile </button>
<button class = "any_button_name" type= "submit " value="preview_profile" name ="preview_profile" >Preview Profile </button>
</form>
Here in code value attribute has been added to know which button has been clicked.
Now at PHP Side you can checked the which button has been clicked.
// code from saveprofile.php
if('save_profile' == $_POST['save_profile']) {
// save profile code
}
if('preview_profile' == $_POST['preview_profile']) {
// save profile code
}
Hope this may help to clear your doubts.
I've the following problem...
My application uses the php, smarty templates and jQuery.
Inside the smarty template there is defined a form with POST method.
The action parameter of the form is defined as follows:
action={if isset($search_place)} {link->somePhpFunction($search_place) {/if}
...because I need to change the action depending on the POSTED parameter.
The input (text) with the "search_place" name is defined inside the form.
The submit button is linked to the jQuery function, as I need to perform some actions on the client side (value check, autocomplete, etc.).
When the button is clicked, I need to
The problem is that when I post the form by the jQuery button, the form will not take the
When the button is clicked then the jQuery handler is called where some checks/corrections are performed and then the page with the form is displayed.
The problem is, that before defining the action parametr from the form the search_place variable in not known and the php function is not called at all.
I've also tried to set a cookie in the button handler and to set the form action to the {$smarty.cookies.search_place} value but the problem changed into another one - the form allway performes action of the previous button click so it is necessary to click the button TWO TIMES to get the correct results.
It is also necessary to mention that there is no way to transfer the needed action parameter to the jQuery event handler as the php function selects the correct one from the large table in database. If this is possible, then it would be easy to change the action parameter from the jQuery function...
The only way I know is to use AJAX to get the right parametr and assign the correct action parametr from the button event handler but it is not the right solution for me as many of my site visitors have not the browser javascipt enabled.
The solution could be also to perform (programmaticaly) one more click on the button from the jQuery event handler but I don't know how to do it...
Any help or idea how to solve this issue will be greatly appreciated...
Thank you in advance. JaM
Try the following:
<form onsubmit="return validationFunction()">
and let this function validate the data and return true if correct and false if not.
now for the js. don't call something like
$("#someForm").submit();
instead use:
if(validationFunction()){
$("#someForm").submit();
}
Update
finally if your validationFunction will do some server-side work
Then instead some variable like
var formSubmitted = false;
then onSubmit return false; and set the formSubmitted to true, and do your ajax call, and when the ajax call is done, check the formSubmitted if it's true then submit the form if not then show some error...
I know that it probably isn't possible to submit a form from one button to 2 various locations so I was wondering if someone knew of a solution.
When I click submit on a form I have the following form tag:
<FORM ACTION="http:site.com/servlets/RequestServlet" method="post">
But I want the form to have 2 action parameters. This way as soon as a user fills this form out, submits the form, the form is submitted to a SERVER AND a PHP script that will pull out the parameters submitted by the the form and email the user details about their form submission such as request ID etc.
Over here the Servlet is submitted to so that a record can be made in the network but an email is required to be sent to a user after form submission in-case they need to reference later on to a rep about their request id for further assistance.
How can I achieve the submission to a PHP script in addition to the submission to the Servlet that's already occurring?
NOTE: I cannot modify the Servlet in any way as it does not belong to me. All I want to do as add the email function for a user to later reference their ticket id.
Set a javascript onclick parameter for the submit button. So it will post to the action you set, but also run a function such as:
function secondSubmit() {
url = "myphpscript.php";
data = { someData: "data", someOtherData: 2 };
$.post(url, data, function(returnedData) {
// can do something on return if you'd like here
});
}
someData and someOtherData will show up in PHP as $_POST["someData"] and $_POST["someOtherData"]. So basically, you will have the form submit to the first URL via the HTML form, and have the second form submitted via jQuery with this function. Alternatively, you can do both submissions in this function and have the form have no action.
For more info, see here: http://api.jquery.com/jQuery.post/
Hey all, using this method jQuery append() and remove() element i'm adding text inputs to a document. i'm using this php
if($_POST['cp_slider'])
{
$array=$_POST['cp_slider'];
foreach($array as $cp_slider)
{
if(strlen($cp_slider)>0)
{
echo '<li><input type="text" name="cp_slider[]" value="'.$this->options["theme_slider"].'" /><img src="images/delete.gif" /></li>';
}
}
}
The value was created like this:
if ($_POST['to_action'] == 'save') {
$this->options["theme_slider"] = $_POST['cp_slider'];
update_option('artTheme', $this->options);
}
But what i see in the value of every input after submitting the form is: Array as a word.
UPDATE
I figured it out and it's working fine. The value gets it's real value, i've just changed the foreach line
from this
foreach($array as $cp_slider)
to this
foreach($array as $this->options["theme_slider"])
But there is still one problem there. After i submit the form, the data from inputs submits very well. But when i go to another page with in the application and then i'm comming back to the page with this inputs, they are simply not there, they just disappear from the page.
this question seems to vague there are many ways to submit form data so I guess start with a form then choose ajax or maybe you want to look at jquery validation
HTH
If you are trying to save the data, your jQuery will have to send the request to a PHP script that will take the input and put it into the database somehow.
User Makes Edits
Presses 'Save'
The Save button fires off a jQuery
AJAX request that sends the
appropriate data to a PHP script that
processes/sanitizes it and then puts
it into the database
If you don't make a call to another script, jQuery will just be updating the HTML seen in the browser and your PHP scripts won't know anything about it.
I have several forms inside DIVS on my page.
I have one form which contains a text field and is always visible, and this is where the user hits 'enter' key and submits...
I want to get values selected in the other forms on the page, and submit them all together, not one by one, so that my PHP code can use "ALL VALUES" and search a mysql database...
Is this possible by javascript using the "<form onsubmit>" to call a javascript?
any codes would be appreciated...
thanks
Without some Javascript hocus-pocus, you can't. One form = one request.
You can do it with JS, and you have a few options. The easiest would be to loop through all the forms on the page, and basically duplicate all the input fields and values into one form and then submit that combined form.
With jQuery it'd go something like this:
$("form").submit(function() {
combineAndSendForms();
return false; // prevent default action
});
function combineAndSendForms() {
var $newForm = $("<form></form>") // our new form.
.attr({method : "POST", action : ""}) // customise as required
;
$(":input:not(:submit, :button)").each(function() { // grab all the useful inputs
$newForm.append($("<input type=\"hidden\" />") // create a new hidden field
.attr('name', this.name) // with the same name (watch out for duplicates!)
.val($(this).val()) // and the same value
);
});
$newForm
.appendTo(document.body) // not sure if this is needed?
.submit() // submit the form
;
}
You need to make a script which will collect the data from the forms, and inject them into the only form that is visible. Only one form will be submitted, you can not submit multiple forms.
You can create multiple hidden fields, or you can construct a single hidden field in that form, then use javascript to collect all the data from the various forms, then create a JSON string, set the value of the hidden one, and submit.
Edit:
Say you have a single hidden input like this:
<input type='hidden' name='hiddenfield' id='hiddenfield' />
you could use JQuery to do this:
$('#hiddenfield').val('myvalue');
To get the value from other forms is as simple as calling $('#elementid').val()
before form submission. To use JQuery, go to the jquery website, download the library, and link it (follow their installation guide).
you can add an onsubmit to that form, and then collect other values with javascript:
<input type="hidden" name="hidden1" id="hidden1" />
<input type="hidden" name="hidden2" id="hidden2" />
<script>
document.getElementById("the_form").onsubmit = function(){
document.getElementById("hidden1").value = document.getElementById("other-field1").value;
document.getElementById("hidden2").value = document.getElementById("other-field2").value;
};
</script>
Wrap the whole Page in your form tag (if possible) and use the server side code, along w/ Javascript, to handle your business rule validation.
kind of a hack solution, but it should minimize the necessity for Javascript "hacks" depending on your skill level with javascript.