I had a simple form that displays the submitted data in a below div with jQuery
<form id="form" action="">
<div class="form-group">
<input type="text" class="form-control" name="firstname" />
</div>
<div class="form-group">
<input type="text" class="form-control" name="lastname" />
</div>
<button id="button" class="btn btn-default">Generate</button>
</form>
When you submit that button, the content is displayed on a div called #results thanks to a small piece of jQuery:
$(document).ready(function(){
$("button").click(function(){
var data = $("form").serializeArray();
$.each(data, function(i, field){
$("#results").append(field.name + ": " + field.value + "<br>");
});
return false;
});
});
As I serialize the array, the URL looks like this ?firstname=john&lastname=doe
I would like that when people access that URL, the data displayed in my #results div takes the URL parameters into account and displays it accordingly. Any clue?