1
I've made this simple tutorial based on other ones on the web:
Create an html file called test.html. Make sure you have in the same directory jquery and firebug. Now place this code inside:
<script type="text/javascript" src="firebug.js"></script>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(".button").click(function(event) {
var name = $("input#name").val();
var email = $("input#email").val();
var phone = $("input#phone").val();
var dataString = 'name='+ name + '&email=' + email + '&phone=' + phone;
//console.log(name); //used with firebug
$("#box").load('myserv.php',dataString);
});
});
</script>
<form name="contact" action="">
<fieldset>
<label>Name</label>
<input type="text" name="name" id="name" size="30" value="" class="text-input" />
<label>Email</label>
<input type="text" name="email" id="email" size="30" value="" class="text-input" />
<label>Phone</label>
<input type="text" name="phone" id="phone" size="30" value="" class="text-input" />
<br />
<input type="button" name="button" class="button" id="button" value="Send" />
</fieldset>
</form>
<div id="box"></div>
create another file called myserv.php in the same directory and place this code inside:
<?php
echo 'Name:'.$_GET['name'].', email:'.$_GET['email'].', phone:'.$_GET['phone'];
?>
Now test it! Should I do more tutorials regarding jquery?
