Advanced Search

form onChange change div

/ Published in: jQuery
Save to your folder(s)

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. <html>
  2. <head>
  3. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
  4. <script>
  5. $(document).ready(function() {
  6.  
  7. 	$("#mainForm").change(function() {
  8. 		console.log("changed...");
  9. 		var data = $(this).serialize();
  10. 		console.log(data);
  11. 		$("#results").load("test2.cfm?"+data);		
  12. 	})
  13. })
  14. </script>
  15. </head>
  16.  
  17. <body>
  18.  
  19. <form id="mainForm">
  20. 	name: <input type="text" name="name" /><br/>
  21. 	age: <input type="text" name="age" /><br/>
  22. 	gender: 
  23. 	<select name="gender">
  24. 		<option value="m">Male</option>
  25. 		<option value="f">Female</option>
  26. 	</select><br/>
  27. 	foo: <input type="radio" name="foo" value="1">One<br/>
  28. 	<input type="radio" name="foo" value="2">Two<br/>
  29. 	<input type="radio" name="foo" value="3">Three<br/>
  30. 	goo: <input type="checkbox" name="goo" value="1">One<br/>
  31. 	<input type="checkbox" name="goo" value="2">Two<br/>
  32. 	<input type="checkbox" name="goo" value="3">Three<br/>
  33. 	<p>
  34. 	<input type="submit">
  35. </form>
  36.  
  37. <div id="results">
  38. </div>
  39.  
  40. </body>
  41. </html>

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.