compact all form-data with javascript - php

Question

I would like to compact all data from a huge HTML-form with over a 1000 variables to circumvent the max_input_vars limit in PHP versions before 5.3.9.
How can I read all data in the HTML-form with javascript, serialize it (or create json) to put it all in only one hidden field that contains the whole data then?
On the receiving side I would uncompress it with PHP (for example with json_decode)

Answer 1

Just sent a ajax post?
form.html with javascript
<form action="process.php" method="post" id="form">
<input type="text" name="name">
<input type="text" name="username">
<button type="submit" id="sendForm">Send</button>
</form>
<!-- YOUR JAVASCRIPT -->
<script type="text/javacript">
$('#sendForm').click(function() {
$.ajax({
type: 'POST',
url: $('#form').attr('action'),
data: $('#form').serialize(),
success: function(data) {
// WHATEVER YOU WANT HERE
}
});
return false;
});
</script>
process.php
<?php
$name = $_POST['name'];
// other form fields here
}

Answer 2

Serialize it using JQuery. You can then parse the URL string using PHP.

Answer 3

perhaps serialize and JSON.stringify may work together, though I have not tried it.

Answer 4

I created a script that does the job on all post forms automatically:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
// this disables all form elements and creates only one new element that contains all data serialized
$('form[method="post"]').submit(function() {
var num_form_elements=$(this).find('input, select, textarea').not('[type="submit"]').length;
var num_elements_already_disabled=$(this).find('input:disabled, select:disabled, textarea:disabled').length;
enabled=(num_form_elements-num_elements_already_disabled);
if($('textarea[name="serialized_data"]', this).length > 0) {
alert("Backbutton is not supported yet!");
return false;
}
if($('textarea[name="serialized_data"]', this).length > 0 || enabled<=0) {
alert("Reload of the form is not supported yet!");
return false;
}
var data=$(this).serialize();
$(this).find('input, select, textarea').not('[type="submit"]').attr("disabled", true);
$(this).append(' <input type="hidden" name="num_form_elements" value="'+num_form_elements+'">');
$(this).append(' <input type="hidden" name="num_elements_already_disabled" value="'+num_elements_already_disabled+'">');
$(this).append(' <textarea style="display:true" name="serialized_data">'+(data)+'</textarea>');
// maybe in the textarea I have to .replace(/</g,'<') ?
});
</script>
On the receiving side you cannot use the PHP parse_str() function because the max_input_vars directive affects this function too, so you need something else: I took my_parse_str() from https://gist.github.com/rubo77/6821632
<?php
$params=my_parse_str($_REQUEST['serialized_data']);
echo count($params,1)." serialized variables:<br>";
var_export($params);
?>
Example script on https://gist.github.com/rubo77/6815945