Berikut adalah 15 tips desain situs web yang mungkin telah diabaikan padahal cukup penting. Mungkin berguna untuk kita lakukan
Read more…
Menampilkan data sebagai hasil dari pilihan select, menggunakan ajax jquery. dalam tutorial ini kita memakai tiga berkas.
1.index.php
2.sumberdata.php
3.jquery-1.3.2.min.js
isi file dari index.html sebagai berikut
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#loading")
.ajaxStart(function(){
$(this).show(500);
$(this).text('loading...');
$("#container").hide(500);
})
.ajaxStop(function(){
$(this).hide(500);$("#container").show(500);
});
$("#myForm select#roomid").change(function(e){
e.preventDefault();
if($(this).val()==""){ $("#container").hide(); }
else {
$.post("sumberdata.php", { roomid: $(this).val() },
function(data){
$("#container").html(data);
});
}
});
});
</script>
</head>
<body>
<form id="myForm" name="myForm">
<select name="roomid" id="roomid" size="1" title="Please select room" >
<option value="" selected="selected">SELECT ROOM</option>
<option value="1" >Deluxe Room - Twin</option>
<option value="2" >President Suite</option>
</select>
<div id="loading"></div> <div id="container"></div>
</form>
</body></html>file jquery bisa didapatkan di http://docs.jquery.com/Downloading_jQuery atau kita bisa juga menggunakan library jquery yang ada di google,
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
Sedangkan untuk file sumberdata.php merupakan array, yang menerima masukan input dari index.php
<?php
switch ($_POST['roomid'])
{
case '1':
$result = 'Deluxe Room - Twin';
break;
case '2':
$result = 'President Suite';
break;
}
echo $result;
?>Demo :klik disini
Udah lama nggak nulis di blog, abis beres-beres buka kantor baru ama tiga orang temen yang bergerak di bidang web design, banyak banget peristiwa terjadi di bulan Juli ini dan jeleknya semuanya nggak ada yang bagus… dimulai dengan tanda-tanda penurunan ‘earning online’ yang dratis dilanjut dengan bom yang mengguncang dua hotel di Jakarta, kayaknya emang harus mulai fokus kembali ke bikin web…
05
Jun
Inspiration, Collaboration and Other Resources
Posted by: Bali Web Maker / Category: webmasterFullSingle – A gallery of really awesome single-page websites.
We Love WP – A showcase of WordPress powered websites (not just blogs).
One Page Love – Another showcase of great one-page websites.
Screenalicio.us – A Web design gallery with more than 10,000 screenshots.
CSS Mania – A gallery of almost 12,000 CSS website designs.
The Best Designs – A huge showcase of Web designs and designers. Read more…
