FaizarBlogspot

Cara Menjalankan File Suara (mp3,Wav) Dengan HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

<title>Cut & Paste HTML5 Mouseover/ Click sound effect</title>

var html5_audiotypes={ //define list of audio file extensions and their associated audio types. Add to it if your specified audio file isn't on this list:

"mp3": "audio/mpeg",

"mp4": "audio/mp4",

"ogg": "audio/ogg",

"wav": "audio/wav"

}

function createsoundbite(sound){

var html5audio=document.createElement('audio')

if (html5audio.canPlayType){ //check support for HTML5 audio

for (var i=0; i<arguments.length; i++){

var sourceel=document.createElement('source')

sourceel.setAttribute('src', arguments[i])

if (arguments[i].match(/\.(\w+)$/i))

sourceel.setAttribute('type', html5_audiotypes[RegExp.$1])

html5audio.appendChild(sourceel)

}

html5audio.load()

html5audio.playclip=function(){

html5audio.pause()

html5audio.currentTime=0

html5audio.play()

}

return html5audio

}

else{

return {playclip:function(){throw new Error("Your browser doesn't support HTML5 audio unfortunately")}}

}

var mouseoversound=createsoundbite("beep.ogg", "beep.mp3")

var clicksound=createsoundbite("beep.ogg", "beep.mp3")

</script>

</head>

Download File

Cara Validasi data yang sama dengan Jquery dan Ajax di php

1. bikin file index.php

<title>Daftar</title>

<?php
include "koneksidb.php";
?>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script src="js/jquery.js" type="text/javascript" language="javascript"></script>
<script language="javascript">

$(document).ready(function()
{
    $("#nama").blur(function()
    {
        //remove all the class add the messagebox classes and start fading
        $("#msgbox").removeClass().addClass('messagebox').text('Checking...').fadeIn("slow");
        //check the username exists or not from ajax
        $.post("cek_nama.php",{nama:$(this).val() } ,function(data)
        {
        if(data=='no') //if username not avaiable
        {
            $("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox
            {
            //add message and change the class of the box and start fading
            $(this).html('Nama Sudah Ada').addClass('messageboxerror').fadeTo(900,1);
            });
          }
        else
        {
            $("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox
            {
            //add message and change the class of the box and start fading
            $(this).html('Nama Tersedia ').addClass('messageboxok').fadeTo(900,1);
            $(this).focus();
            });

        }

        });

    });

});
</script>

<form id=validasi name=daftar method=post action=proses_daftar1.php>

<table>

<tr><td>Nama </td><td>: <input name="nama" id="nama" size=40 class="required" maxlength="15"> <span id="msgbox" style="display:none"></span>

</td></tr>
<tr><td>
Jenis Kelamin </td><td>:
<?php
       echo "<select name=jeniskelamin> <option value=0 selected class='required' title=' pilih dulu'>--</option>";
       $tampil= mysql_query("SELECT * FROM jeniskelamin order by jeniskelamin ");
       while($r=mysql_fetch_array($tampil)){
       echo"<option value=$r[jeniskelamin]>$r[jeniskelamin]</option>";
}
      echo "</select></td></tr>";
?>
<tr><td>Password </td><td>: <input type=password name=password class="required" title="Password Harus Diisi <img src=emo/joget.gif width=30 height=30 hspace=10 border=0 align=right>"></td></tr>
<tr><td><input type=button onclick='validasi()' value=proses> | <input type=button value=Batal onclick=self.history.back()></td></tr>
</table>
</form>

2 bikin file koneksidb.php

<?php
mysql_connect("localhost","root","");
mysql_select_db("datadb");
?>

3. Bikin file cek_nama.php
<?php
include "koneksidb/koneksidb.php";
$user = strip_tags(trim($_REQUEST['nama']));
$query="SELECT * FROM mahasiswa WHERE nama='$user'";
$result=mysql_query($query);
if(mysql_num_rows($result)>0){
//username already exists
echo "no";
}else{
echo "yes";
}
?>

Pengenalan AJAX (Asynchronous JavaScript and XML)

Apa yang harus anda ketahui
Sebelum anda memulai belajar PHP AJAX anda harus sudah mempunyai pengetahuan dasar mengenai :

1. HTML
2. Javascript
3. PHP Silahkan membaca buku atau dari internet untuk mempelajari HTML, Javascript dan PHP

Apakah itu AJAX ???

AJAX adalah singkatan dari Asynchronous JavaScript and XML.
AJAX, terdiri dari HTML, Javascript, DHTML dan DOM yang kemudian digabungkan dengan bahasa pemograman web di sisi server seperti PHP dan ASP, sehingga membentuk suatu aplikasi berbasis web yang interaktif.

AJAX bukanlah bahasa pemograman baru, tetapi adalah teknik baru untuk membuat aplikasi web lebih baik, lebih cepat dan lebih interaktif.

Dengan AJAX, Javascript dapat langsung berkomunikasi dengan server dengan menggunakan objek XMLHttpRequest XXMMLLHHttttppRReeqquueesstt XMLHttpRequest. Dengan objek ini, javascript dapat melakukan transaksi data denga server web, tanpa harus me-reloading halaman web tersebut secara keseluruhan.

Berikut adalah teknologi yang termasuk dalam aplikasi AJAX :

• HTML yang digunakan untuk membuat Web forms dan mengindentifikasikan filed-field yang akan anda gunakan dalam aplikasi.

• JavaScript adalah kode inti untuk menjalankanaplikasi Ajax dan untuk membantu memfasilitasi komunikasi dengan aplikasi .

• DHTML, atau Dynamic HTML, membantu anda untuk membuat form atau web anda dinamis. Anda akan menggunakan <div>, <span> dan elemen HTML dinamis lainya.

• DOM, Document Object Model, akan digunakan (melalui kode JavaScript) untuk bekerja dengan kedua struktur dari HTML dan XML anda yang dalam beberapa kasus berasal dari server.

XMLHttpRequest
Objek pertama yang harus anda mengerti adalah XMLHttpRequest, mungkin bagi anda terdengar sesuatu yang baru. Ini adalah objek javascript dan membuatnya sederhana seperti ditunjukkan di kode 1 di bawah ini :

Kode 1. Membuat objek XMLHttpRequest.

<script language="javascript" type="text/javascript">
var xmlHttp = new XMLHttpRequest();
</script>

Untuk mendapatkan dan mengirim data dari/ke suatu database atau file di server menggunakan javascript tradisional, maka anda harus membuat HTML Form. Dan user harus mengklik tombol “submit” untuk mengirim/mendapatkan informasi, menunggu respon dari server, kemudian halaman yang baru berupa hasilnya akan di-load. Karena server selalu memberikan halaman baru setiap user tekan tombol submit, aplikasi web sederhana akan berjalan lambat dan akan kurang user-friendly.

Dengan Ajax, javascript akan berkomunikasi secara langsung dengan server melalui objek javascript yaitu XMLHttpRequest tersebut.
Dengan objek XMLHttpRequest, suatu halaman web dapat membuat request ke, dan mendapatkan respon dari server web tanpa me-reload halaman secara keseluruhan. User akan selalu tetap dengan halaman yang sama. Bahkan user tidak akan tahu kalau ada data yang dikirim dan diterima dari server, karena javascript melakukan transaksi data di balik layar.

Bagusnya lagi permintaan dikirim asynchronous, yang berarti bahwa kode JavaScript (dan pengguna) tidak menunggu pada server untuk merespon. Sehingga pengguna dapat terus memasukkan data, bergulir sekitar, dan menggunakan aplikasi.

Kode JavaScript bahkan bisa mendapatkan data, melakukan perhitungan, dan mengirim permintaan lain, semua tanpa campur tangan pengguna! Ini adalah kekuatan dari XMLHttpRequest. Hal ini dapat bicara bolak-balik dengan server semua yang diinginkan, tanpa pernah tahu pengguna tentang apa yang sebenarnya terjadi. Hasilnya adalah, dinamis responsif, pengalaman yang sangat interaktif seperti aplikasi desktop, tapi dengan semua kekuatan Internet di belakangnya.
Objek XMLHttpRequest disupport hampir semua browser (Internet Explorer, Firefox, Chrome, Opera, dan Safari).