<!DOCTYPE html> <html> <head> <title>test</title> <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script> </head> <body> Results: <p id="results" style="color: red;"></p> <form action="" id="post"> <select name="single"> <option>Single</option> <option>Single2</option> </select> <select name="multiple" multiple="multiple"> <option selected="selected">Multiple</option> <option>Multiple2</option> <option selected="selected">Multiple3</option> </select><br/> <input type="checkbox" name="check" value="check1"/> check1 <input type="checkbox" name="check" value="check2" checked="checked"/> check2 <input type="radio" name="radio" value="radio1" checked="checked"/> radio1 <input type="radio" name="radio" value="radio2"/> radio2 <input type="submit"/> </form> <script type="text/javascript"> $(function() { $('#post').submit(function() { var data = $(this).serialize(); $("#results").html(data); $.post($(this).attr('action'), data, function(r) { alert(r); }); return false; }); }); </script> </body> </html>