Threaded Mode | Linear Mode

suicidal · (This post was last modified: 12-04-2011 10:16 PM by suicidal.)

Sebenernya bingung mau taro subforum javascript apa di php, yaudah ditaro disini aja karena sebagian besar codingannya php,

Jadi saya bkin form gini

PHP Code:

Cari : <input type="text" name="search" onkeyup="cari()" />
<table>
<tr><td>Nama Siswa</td></tr>
<?php
$sql=mysql_query("SELECT * FROM tbl_mahasiswa WHERE nama like %search%");
while($data=mysql_fetch_array($sql)){
echo "<tr>";
echo "<td>$data[nama]</td>";
echo "</tr>";
}
?>
</table> 

Gimana caranya pada saat kita menuliskan huruf di textbox search, langsung menampilkan data di tabel sesuai di inputan search.

Kalo yang ngerti boleh dibantu belajar

, boleh pake ajax/jquery/js, saya bingung gimana caranya.

**mariachi** · 12-04-2011, 10:25 PM

coba cari google, keywordnya autocomplete. ketawa

*sengaja suruh nyari di google biar lebih lengkap daripada saya jelasin, soalnya saya gak gitu ngerti piss

**CitooZz** · 12-04-2011, 10:28 PM

(12-04-2011 10:25 PM)t3k0 Wrote: coba cari google, keywordnya autocomplete.

*sengaja suruh nyari di google biar lebih lengkap daripada saya jelasin, soalnya saya gak gitu ngerti

ane jg blm ngerti ginian ketawa

ane

google dlu

suicidal · (This post was last modified: 12-04-2011 11:39 PM by suicidal.)

iya sebelumnya saya cari, adanya autocompletenya kayak textbox pas kita input, dia kluar huruf2 apa saja yang pernah kita input.
Ibarat kayak textbox username facebook gitu deh.

Jadi ngga sesuai, jika ada referensi/ilmunya, boleh disharing dong hehehe.

***Xr3m1ckX*** · 12-05-2011, 12:59 AM

maybe link ini bisa bantu http://www.javascript-examples.com/autocomplete-demo/

Regel · 01-24-2012, 12:19 AM

nih barusan aq buatin.. sorry ajax only,, aq gak paham pake jquery. jgn lupa dikasih css jg.
html dan Ajax nya.

Code:

<!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" xml:lang="en" lang="en">

<head>

    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />

    <meta name="author" content="Jasman" />

    <title>Demo Auto Complete by Jasman</title>

    <script type="text/javascript">

    /**

     * @author      Jasman (jasman@ihsana.com)

     * @copyright    Copyright (C) 2011 Ihsana IT Solution, Inc. All rights reserved.

     * @license        Private Use Only

     * @website     http://www.ihsana.com 

     */   

    function getXMLHttpRequest(){

        if(window.ActiveXObject){

            return new ActiveXObject("Microsoft.XMLHTTP");

        }else if(window.XMLHttpRequest){

            return new XMLHttpRequest();    

        }else alert("Status : Can not create XMLHttpRequest Object");

    }

    function sendRequest(pageURL,ElementID){

        var xmlhttp = getXMLHttpRequest();

        var obj=document.getElementById(ElementID);

        obj.innerHTML='?';

        if(xmlhttp.readyState==4 || xmlhttp.readyState==0){

            xmlhttp.open('GET',pageURL,true);

            xmlhttp.onreadystatechange=function(){

                if(xmlhttp.readyState==4 && xmlhttp.status==200){

                    obj.innerHTML=xmlhttp.responseText;

                }

            }

            xmlhttp.send(null);

        }

    }   

    function AutoComplete(JzElement,JzElementAutoId){

        var search = document.getElementById(JzElement).value;

        sendRequest('autocomplete.php?search='+search,JzElementAutoId)

    }

    function addstr(Text,JzElement){

        var obj=document.getElementById(JzElement);

        obj.value= Text;

    }

    </script>

</head>

<body>

<form action="" method="post" >

<input type="text" id="search" name="search" onkeydown="AutoComplete('search','autocomplete')" />

<input type="submit" value="Search"  />

<div id="autocomplete"></div>

</form>

</body>

</html>

Simpan dengan nama:
autocomplete.php

Code:

<?php

/**

 * @author      Jasman (jasman@ihsana.com)

 * @copyright    Copyright (C) 2011 Ihsana IT Solution, Inc. All rights reserved.

 * @license        Private Use Only

 * @website     http://www.ihsana.com 

 */

$connect = @mysql_connect('localhost','antisec','antisec');  

if (!$connect){die('MySQL Error: ' . @mysql_error());};

@mysql_select_db('test',$connect);

$sql=@mysql_query("SELECT * FROM member WHERE nama LIKE '%".@$_GET['search']."%' LIMIT 0, 10");

echo '<ul>';

while($data=mysql_fetch_array($sql)){

echo '<li><a href="javascript:addstr(\''.$data['nama'].'\',\'search\');">'.$data['nama'].'</a></li>';

}

echo '</ul>';

?>

SQL nya

Code:

--

-- Database: `test`

--

CREATE TABLE IF NOT EXISTS `member` (

  `nama` text NOT NULL,

  `alamat` text NOT NULL

) ENGINE=MyISAM DEFAULT CHARSET=latin1;

INSERT INTO `member` (`nama`, `alamat`) VALUES

('Jasman', 'Kinali, Pasaman Barat, Sumbar'),

('JFry_', 'Kinali, Pasaman Barat, Sumbar'),

('Anaski', 'Kinali, Pasaman Barat, Sumbar');

***ditatompel*** · 01-24-2012, 06:15 AM

(01-24-2012 12:19 AM)Regel Wrote: nih barusan aq buatin.. sorry ajax only,, aq gak paham pake jquery. jgn lupa dikasih css jg.
html dan Ajax nya.

Code:

<!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" xml:lang="en" lang="en"> <head>     <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />     <meta name="author" content="Jasman" />     <title>Demo Auto Complete by Jasman</title>     <script type="text/javascript">     /**      * @author      Jasman (jasman@ihsana.com)      * @copyright    Copyright (C) 2011 Ihsana IT Solution, Inc. All rights reserved.      * @license        Private Use Only      * @website     http://www.ihsana.com      */       function getXMLHttpRequest(){         if(window.ActiveXObject){             return new ActiveXObject("Microsoft.XMLHTTP");         }else if(window.XMLHttpRequest){             return new XMLHttpRequest();             }else alert("Status : Can not create XMLHttpRequest Object");     }          function sendRequest(pageURL,ElementID){         var xmlhttp = getXMLHttpRequest();         var obj=document.getElementById(ElementID);         obj.innerHTML='?';                if(xmlhttp.readyState==4 || xmlhttp.readyState==0){             xmlhttp.open('GET',pageURL,true);             xmlhttp.onreadystatechange=function(){                 if(xmlhttp.readyState==4 && xmlhttp.status==200){                     obj.innerHTML=xmlhttp.responseText;                 }             }             xmlhttp.send(null);         }     }       function AutoComplete(JzElement,JzElementAutoId){         var search = document.getElementById(JzElement).value;         sendRequest('autocomplete.php?search='+search,JzElementAutoId)     }          function addstr(Text,JzElement){         var obj=document.getElementById(JzElement);         obj.value= Text;     }     </script> </head> <body> <form action="" method="post" > <input type="text" id="search" name="search" onkeydown="AutoComplete('search','autocomplete')" /> <input type="submit" value="Search"  /> <div id="autocomplete"></div> </form> </body> </html>

Simpan dengan nama:
autocomplete.php

Code:

<?php /** * @author      Jasman (jasman@ihsana.com) * @copyright    Copyright (C) 2011 Ihsana IT Solution, Inc. All rights reserved. * @license        Private Use Only * @website     http://www.ihsana.com */ $connect = @mysql_connect('localhost','antisec','antisec');   if (!$connect){die('MySQL Error: ' . @mysql_error());}; @mysql_select_db('test',$connect); $sql=@mysql_query("SELECT * FROM member WHERE nama LIKE '%".@$_GET['search']."%' LIMIT 0, 10"); echo '<ul>'; while($data=mysql_fetch_array($sql)){ echo '<li><a href="javascript:addstr(\''.$data['nama'].'\',\'search\');">'.$data['nama'].'</a></li>'; } echo '</ul>'; ?>

SQL nya

Code:

-- -- Database: `test` -- CREATE TABLE IF NOT EXISTS `member` (   `nama` text NOT NULL,   `alamat` text NOT NULL ) ENGINE=MyISAM DEFAULT CHARSET=latin1; INSERT INTO `member` (`nama`, `alamat`) VALUES ('Jasman', 'Kinali, Pasaman Barat, Sumbar'), ('JFry_', 'Kinali, Pasaman Barat, Sumbar'), ('Anaski', 'Kinali, Pasaman Barat, Sumbar');

Wew... Keren nih om.... mantap

Thanks sharingnya... Ijin pelajari :blajar

Btw, om suicidal, ini udah solved blum yah? Udah ya? Saya solved dulu yah? ketawa

suicidal · 01-24-2012, 08:11 AM

Udah gan. Silahkan diubah prefixnya.

Possibly Related Threads...
Thread:		Author	Replies:	Views:	Last Post
	[Ask] cara buat balesan komentar berita di php	superrmario	10	179	05-21-2013 01:53 AM Last Post: ZenZ
	[Ask] cara membuat data mining pada php?	Keonx	2	80	05-19-2013 06:12 PM Last Post: Keonx
	[Solved] Tentang Cara Search Di Php	wildan123456	4	104	05-15-2013 09:26 PM Last Post: kidofdream
	[Solved] how Delete mysql table row dengan php	dauf	12	165	05-08-2013 04:32 PM Last Post: jundulloh
	[Ask] Cara Decrypt Shell (dg Gambar)	sayacupu	7	156	05-07-2013 07:52 PM Last Post: googles
	[Solved] Cara Bikin Thumbnail Gambar Menggunakan PHP	CodeSearcher	4	138	05-02-2013 04:47 PM Last Post: CodeSearcher
	[Tutor] script untuk import excel ke MySQL	dellacroug	9	146	04-29-2013 11:33 AM Last Post: Sixmart
	Bagaimana cara Login dengan menggunaka Privilage	dauf	2	85	04-24-2013 11:44 AM Last Post: dauf
	[Tutor] grab quote dari http://www.brainyquote.com/	test	11	309	03-30-2013 11:41 AM Last Post: hakimoxz
	Cara Cepat Transfer File antar Hosting dengan php	uchiha_sasuke	15	292	03-27-2013 06:59 AM Last Post: uchiha_sasuke