Store form data into hidden field using Jquery? - php

I have a form that has a popup page with another form. In that popup form I want to take all fields filled out and store it in a single field in the main parent form via a hidden field. So that when the parent form gets submitted I can get all the fields via the hidden fields via php. How could I do that with jquery? Can I take all the fields from the popup form and store it as a json string in the hidden field? Then in php be able to turn that jquery string into an object so I can get easy access to all the form values? If so then how would I take all the fields from the popup form and turn it into a json string? Or is there a better/easier way?

To capture the form into an input for posting:
You want to .serialize() the form.
$('input').val( $('form').serialize() );
Then, in PHP, you just do a parse_str() to split it back up into an array.
Also, keep in mind that there may be a better solution than passing field data around like this, but if you're hellbent on that implementation, this is probably the way to go.
To open a form as a modal, then collect the data in PHP:
// You can set this to not open by default and bind the opening to a button, or a link, etc...
$('form').dialog({
modal: true
});
In PHP, your form will be contained within $_POST as normal.
print_r( $_POST );

One idea would be to use jQuery to create fields like this:
$(".innerForm input").each(function() {
$(".parentForm").append("<input type='hidden' name='"+$(this).attr("name")+"' value='"+$(this).val()+"'");
});
If you add the values to your page this way then you would just be able to access them as though they were normal parts of the $_POST
$_POST("hidden_field_name")

Related

Remove textbox name from URL if empty

I am using a PHP website.
I have 2 text box, and both values are going through GET to next page, so it look like
http://mywebsite.com/?word=&word2=hello
I want if word is empty, don't show in the URL
like
http://mywebsite.com/?word2=hello
Please help in this..
You will have to use some javascript prior to submitting the form to remove the form elements if they are deemed to be empty - then submitting the form.
You can write a function which is triggered by a faux-submit buttom. This validates the elements, makes changes as needed - then submits the form as the final action.
You can use the Javascript window.location function.
store the values of the textbox into variable

Post non-input fields in a form?

This seems like a simple thing, and maybe I'm just not thinking straight today, but right now I don't see it: How do I post data from a form (in a PHP application) that is not an input field?
The reason I need this is I have a form where the user adds some information in input fields, and this should then update other values in the form based on what the user has entered (doing calculations on this input). This data should then on submit be posted, along with the input from the user.
I tried using form labels, but could not get it to work. For one I couldn't get the value of the form in the jQuery using either .val() or .text(). And I'm not sure if I could get the values of the label in the CodeIgniter function anyway. I also tried simple <p> tags with ids, but that didn't work. I guess it has to be an element with the name attribute...
I'm using a helper in CodeIgniter to get the form values, like so:
$this->input->post('user')
This works fine for input fields, but as explained I need it for non-input elements. Of course I could have input fields that I update in jQuery, but there's a risk that the users will think they should fill them in...
So how do you do it?
How about using <input name="user" type="hidden"> and use Jquery to store the value in there.
Why are you storing input information in non-user-interface elements? Anything you want to be POSTed should be in an input field. Labels are not input elements, they are, well, labels. They label things. What exactly are you doing that you think you can't use input fields? You can disable them, set them to read-only mode, and modify their values in a similar way that you'd modify the text in any other element.

What is the best method to populate form with jQuery?

I have used jQuery Form plugin to submit the whole form data to server while Ajax. When the server code (php) returns, the retrieved data is in JSON format. What is the best method to populate the form with jQuery.
Here is what I want to do:
The user enters the data on the form
The user submits the form data (I use ajax to submit)
The server code returns.
The user has the ability to retrieve the entered data.
So for the step 4, I want to know what the best method to use to populate a form?
Thank you
If you can ensure that the returned JSON object contains property names that match your form fields, it can be quite simple to populate the form.
Of course, you need to first evaluate the retrieved JSON, either using eval, or using a JSON library such as this for added security checks.
Then, you can just iterate over the object like this:
var obj = eval(json); /* or JSON.parse(json); */
for (var field in obj)
$('#' + field).val(obj[field]);
If your form contains non-textual fields (such as a select) you could add an additional check to set the selected index instead.

Jquery array submit

I have a page where there are 117 input fields. What i want is to submit them via Jquery ajax. What i am thinking is to make an array and send them by this way. I would like to ask how is it possible to take all inputs and then to put them in an array and then retrieve them from the php file (for example, should i do explode,or for each..etc??)
The input fields are not in a form (just in div with id = "config")
Thanks.
Why not use .serialize(), along with an ajax POST? In PHP, they will all be accessible via the $_POST 'superglobal' array.
Stringify the data on the client side into JSON(there is a stringifier available here). Then, on the server-side use json_decode($json_str).
Another option is to put all those input fields into an actual form and then use jQuery's serialize() (which would actually be a whole lot easier).

Using jQuery:remove() to delete/remove form elements off a page

I'm trying to remove a form element generated through Ajax calls, but when I submit the form and var_dump the POST request, I can still see the form field key=>value. I need to be able to completely remove the field through jQuery in order to validate correctly.
You can remove the element first before submitting it.
$(this.element).remove();
You can also not set the name attribute, and the field won't get posted

Categories