http://blog.codingwear.com PHP Ajax Javascript Javascript jQuery Tutorial Tutorial Indonesia
1
http://blog.codingwear.com PHP Ajax Javascript Javascript jQuery Tutorial Tutorial Indonesia
"#$%&$'() *+,
www.coding !"#$ .com .com -./0 1.$&%+. #'$2'.33('
2
http://blog.codingwear.com PHP Ajax Javascript Javascript jQuery Tutorial Tutorial Indonesia
!"#$"% '(' 67
H7
I7
87
?7
3
4.5.3.%
77777777777 77777777777777777777777 77777777777777777777777 7777777777777777777777777777777 7777777777777777777777777777777 7777777777777777777777777 777777777777777777777 77777777 )*+,*+"-"+ ./"0 77777777777777777777777
8
9#. :.%2 4.'0& 9%). ;(<.=0> 77777777777777777777777777 7777777777777 77777777777777777777777777 7777777777777777777777777 7777777777777777777777777 7777777777777777777777777777 7777777777777777777 7777
?
9#.1.= 9/.@ 77777777777777777777777 7777777777 77777777777777777777777777 77777777777777777777777777 77777777777777777777777777 7777777777777777777777777 7777777777777777777777777 7777777777777777777777777777 777777777777777777777777777 77777777777777
?
ABC4<<#D(E0(&< 7777777777777777777777777 777777777777 777777777777777777777777777 777777777777777777777777777 7777777777777777777777777 7777777777777777777777777 7777777777777777777777777777 7777777777777777777777777777 7777777777777
?
;$30%>1.&> )(%2.% "('F(' 777777777777777777777777777 7777777777777 77777777777777777777777777 7777777777777777777777777 7777777777777777777777777 777777777777777777777777777 77777777777777777777777777 77777777777
G
1234$$56*78*($ 9:/*;$ 777777777777777777777777777777777777777777777777777777777777777777777777777
6I
J'$#('<> .<.0 9<'>-0< 7777777777777777777777777 777777777777 77777777777777777777777777 77777777777777777777777777 7777777777777777777777777 7777777777777777777777777 7777777777777777777777777777 77777777777777777777777777 77777777777
68
77777777777 77777777777777777777777 77777777777777777777777 7777777777777777777777777777777 777777777777777777777777777777 77777777777 <=%>"$ !"$" 6*(5=+ ./"0 77777777777777777777777
HK
L"MN 77777777777777777777777777 777777777777 777777777777777777777777777 7777777777777777777777777 7777777777777777777777777 7777777777777777777777777 7777777777777777777777777 7777777777777777777777777777 777777777777777777777777777 777777777777777777777777 777777777777
HG
9494 77777777777777777777777 7777777777777777777777777 7777777777777 7777777777777777777777777 7777777777777777777777777 7777777777777777777777777 7777777777777777777777777777 7777777777777777777777777777 777777777777777777777777 77777777777
8O
ABC 77777777777777777777777 77777777777 777777777777777777777777 7777777777777777777777777777 77777777777777777777777777777 7777777777777777777777777 7777777777777777777777777 7777777777777777777777777777 777777777777777777777777777 777777777777777777777777 777777777777
88
7777777777777 777777777777777777777777777 77777777777777777777777777 7777777777777777777777777 7777777777777777777777777 7777777777777777777777777 7777777777777777 )*+,*+"-"+ /?8*%@ 777777777777777777777777777
8K
9#. ><0 /P0('+ 77777777777777777777777777 777777777777 777777777777777777777777777 7777777777777777777777777 7777777777777777777777777 7777777777777777777777777 777777777777777777777777777 7777777777777777777777777777 77777777777777777777 7777777
8G
">%<.1& /P0('+ 7777777777777777777777777 7777777777777 777777777777777777777777777 777777777777777777777777777 7777777777777777777777777 7777777777777777777777777 777777777777777777777777777 7777777777777777777777777777 77777777777777777777 7777777
8Q
/P0('+ "(5(R<$' 77777777777777777777777 77777777777 777777777777777777777777777 777777777777777777777777777 7777777777777777777777777 7777777777777777777777777 777777777777777777777777777 7777777777777777777777777777 77777777777777777777 7777777
8Q
/P0('+ SF(%<& 777777777777777777777777 777777777777 7777777777777777777777777777 7777777777777777777777777777 7777777777777777777777777 7777777777777777777777777 777777777777777777777777777 7777777777777777777777777777 77777777777777777777 7777777
?O
ST(1U(T(1 )(%2.% /P0('+ 777777777777777777777777 777777777777 777777777777777777777777777 777777777777777777777777777 7777777777777777777777777 7777777777777777777777777 7777777777777777777777777777 77777777777777777777
?6
B.%>#05.&> 4VBC )(%2.% /P0('+ 7777777777777777777777777 77777777777 77777777777777777777777777 7777777777777777777777777 7777777777777777777777777 777777777777777777777777777 777777777777777
?W
B.%>#05.&> X"" )(%2.% /P0('+ 77777777777777777777777777 777777777777 777777777777777777777777777 7777777777777777777777777 7777777777777777777777777 7777777777777777777777777777 7777777777777777777 7777
KI
Y(- V.- "R'$55 X$%<(%< ZX$%<$=[ 777777777777777777777777 777777777777 7777777777777777777777777 7777777777777777777777777 7777777777777777777777777 7777777777777777777777777777 777777777777777
KG
7777777777 77777777777777777777777 77777777777777777777777 7777777777777777777777777777777 7777777777777777777777777777777 7777777777777777777777777 7777777777777777777777777777 777777777777777777777 777777 /?8*%@ ./"0 7777777777777777777777
GO
\0%2&>UT0%2&> 9/.@ /P0('+ 77777777777777777777777777 777777777777 77777777777777777777777777 7777777777777777777777777 7777777777777777777777777 777777777777777777777777777 7777777777777777777777777777 7777777777777
G6
]%&('<^ _(5(<(^ `#).<( ).% 9%>3.&> C$.)>%2 777777777777777777777777 777777777777 7777777777777777777777777 7777777777777777777777777 77777777777777777777777 77777777777
GI
http://blog.codingwear.com PHP Ajax Javascript jQuery Tutorial Indonesia
" #$%&$%'('% )*)+
4
http://blog.codingwear.com PHP Ajax Javascript jQuery Tutorial Indonesia
"#$ %$&' ($)*+ $&,$ -./$(*0 ,$-$(./ '%0' /$/.('1 -$('2'3 #4# )*)+ '%0' 5'3.6 6.0'5 /$/7.%8'1 7$%&$9'5.'% 0'6'3 /$%&$%'1 : "; 4<=> ?; *'@'6A3179 B; #4# ,1('5C'% /$/-'A' -.C. '9'. 0'31 1%9$3%$9 .%9.C /$/7$('2'31 4<=>D *'@'6A3179 0'% #4#
"#$-$( "1"2 )*)+ '0'('5 61%&C'9'% 0'31 )68%A53E%E.6 *'@',A3179 '%0 +=>; )*)+D 9$30131 0'31 4<=>D *'@'6A3179D F4<=> 0'% FG= 8'%& C$/ .01'% 01&'-.%&C'% 0$%&'% -'5'6' 7$/E&3'/'% H$- 01 6161 6$3@$3 6$7$391 #4# 0'% ),#D 6$51%&&' /$/-$%9.C 6.'9. '7(1C'61 -$3-'616 H$- 8'%& 1%9$3'C91I; )*)+ -.C'%('5 -'5'6' 7$/E&3'/'% -'3.D 9$9'71 '0'('5 9$C%1C -'3. .%9.C /$/-.'9 '7(1C'61 H$($-15 -'1CD ($-15 A$7'9 0'% ($-15 1%9$3'C91I; F$%&'% )*)+D *'@'6A3179 0'7'9 ('%&6.%& -$3CE/.%1C'61 0$%&'% 6$3@$3 0$%&'% /$%&&.%'C'% E-2$C !"#$%%&'()*(+%; F$%&'% E-2$C 1%1D 2'@'6A3179 0'7'9 /$('C.C'% 93'%6'C61 0'9' 0$%&' 6$3@$3 H$-D 9'%7' 5'3.6 /$J!"#$%&'() 5'('/'% H$- 9$36$-.9 6$A'3' C$6$(.3.5'%; K$31C.9 '0'('5 9$C%E(E&1 8'%& 9$3/'6.C 0'('/ '7(1C'61 )*)+ : •
•
•
•
4<=> 8'%& 01&.%'C'% .%9.C /$/-.'9 L$- IE3/6 0'% /$%&1%0$%91I1C'61C'% I1($0JI1$(0 8'%& 'C'% '%0' &.%'C'% 0'('/ '7(1C'61; *'@',A3179 '0'('5 CE0$ 1%91 .%9.C /$%2'('%C'%'7(1C'61 )2'M 0'% .%9.C /$/-'%9. /$/I'61(19'61 CE/.%1C'61 0$%&'% '7(1C'61 ; F4<=>D '9'. F8%'/1A 4<=>D /$/-'%9. '%0' .%9.C /$/-.'9 IE3/ '9'. H$- '%0' 01%'/16; )%0' 'C'% /$%&&.%'C'% ,-./0D ,+&120 0'% $($/$% 4<=> 01%'/16 ('1%8'; FG=D FEA./$%9 G-2$A9 =E0$(D 'C'% 01&.%'C'% N/$('(.1 CE0$ *'@',A3179O .%9.C -$C$32' 0$%&'% C$0.' 693.C9.3 0'31 4<=> 0'% +=> '%0' 8'%& 0'('/ -$-$3'7' C'6.6 -$3'6'( 0'31 6$3@$3;
2345//#6.7*.+/ G-2$C 7$39'/' 8'%& 5'3.6 '%0' /$%&$391 '0'('5 +=>4997P$Q.$69D /.%&C1% -'&1 '%0' 9$30$%&'3 6$6.'9. 8'%& -'3.; R%1 '0'('5 E-2$C 2'@'6A3179 0'% /$/-.'9%8' 6$0$35'%' 6$7$391 019.%2.CC'% 01 CE0$ " 01 -'H'5 1%1 :
89,. :; 3.<=*$/ 9=>.- 2345//#6.7*.+/; <script language="javascript" type="text/javascript"> var xmlHttp = new XMLHttpRequest();
5
http://blog.codingwear.com PHP Ajax Javascript jQuery Tutorial Indonesia
S%9.C /$%0'7'9C'% 0'% /$%&131/ 0'9' 0'31TC$ 6.'9. 0'9'-'6$ '9'. I1($ 01 6$3@$3 /$%&&.%'C'% 2'@'6A3179 93'0161E%'(D /'C' '%0' 5'3.6 /$/-.'9 4<=> UE3/; F'% .6$3 5'3.6 /$%&C(1C 9E/-E( V6.-/19W .%9.C /$%&131/T/$%0'7'9C'% 1%IE3/'61D /$%.%&&. 3$67E% 0'31 6$3@$3D C$/.01'% 5'('/'% 8'%& -'3. -$3.7' 5'61(%8' 'C'% 01J(E'0; X'3$%' 6$3@$3 6$('(. /$/-$31C'% 5'('/'% -'3. 6$91'7 .6$3 9$C'% 9E/-E( 6.-/19D '7(1C'61 H$- 6$0$35'%' 'C'% -$32'('% ('/-'9 0'% 'C'% C.3'%& .6$3JI31$%0(8;
?$<=$) @; #.)=$&,0'$& A.= $#B0-$+0 /)$,0+09&$B ,.&'$& ">$C
F$%&'% )2'MD 2'@'6A3179 'C'% -$3CE/.%1C'61 6$A'3' ('%&6.%& 0$%&'% 6$3@$3 /$('(.1 E-2$C 2'@'6A3179 8'19. !"#$%%&'()*(+% 9$36$-.9; F$%&'% E-2$C !"#$%%&'()*(+%D 6.'9. 5'('/'% H$- 0'7'9 /$/-.'9 3$Q.$69 C$D 0'% /$%0'7'9C'% 3$67E% 0'31 6$3@$3 H$- 9'%7' /$J3$(E'0 5'('/'% 6$A'3' C$6$(.3.5'%; S6$3 'C'% 6$('(. 9$9'7 0$%&'% 5'('/'% 8'%& 6'/'; K'5C'% .6$3 910'C 'C'% 9'5. C'('. '0' 0'9' 8'%& 01C131/ 0'% 019$31/' 0'31 6$3@$3D C'3$%' 2'@'6A3179 /$('C.C'% 93'%6'C61 0'9' 01 -'(1C ('8'3; K'&.6%8' ('&1 7$3/1%9''% 01C131/ !"#$%&'($()"D 8'%& -$3'391 -'5H' CE0$ *'@',A3179 N0'% 7$%&&.%'O 910'C /$%.%&&. 7'0' 6$3@$3 .%9.C /$3$67E%; ,$51%&&' 7$%&&.%' 0'7'9 9$3.6 /$/'6.CC'% 0'9'D -$3&.(13 6$C19'3D 0'% /$%&&.%'C'% '7(1C'61;
6
http://blog.codingwear.com PHP Ajax Javascript jQuery Tutorial Indonesia
XE0$ *'@',A3179 -'5C'% -16' /$%0'7'9C'% 0'9'D /$('C.C'% 7$3519.%&'%D 0'% /$%&131/ 7$3/1%9''% ('1%D 6$/.' 9'%7' A'/7.3 9'%&'% 7$%&&.%'Y R%1 '0'('5 C$C.'9'% 0'31 !"#$%%&'()*(+%; 4'( 1%1 0'7'9 -1A'3' -E('CJ-'(1C 0$%&'% 6$3@$3 6$/.' 8'%& 011%&1%C'%D 9'%7' 7$3%'5 9'5. 7$%&&.%' 9$%9'%& '7' 8'%& 6$-$%'3%8' 9$32'01; 4'61(%8' '0'('5D 01%'/16 3$67E%61ID 7$%&'('/'% 8'%& 6'%&'9 1%9$3'C91I 6$7$391 '7(1C'61 0$6C9E7D 9'71 0$%&'% 6$/.' C$C.'9'% R%9$3%$9 01 -$('C'%&%8'; G-2$C !"#$%%&'()*(+% 016.77E39 5'/713 6$/.' -3EH6$3 NR%9$3%$9 ZM7(E3$3D U13$IEMD [53E/$D G7$3'D 0'% ,'I'31O; S%9.C /$/-.'9 E-2$C !"#$%%&'()*(+% 6.7'8' -16' 010.C.%& E($5 -$-$3'7' -3EH6$3 '0'('5 6$-'&'1 -$31C.9 :
89,. @; 3.<=*$/ 9=>.- 2345//#6.7*.+/ *&/*- =.=.)$#$ =)9A+.); if (window.XMLHttpRequest) { // kode untuk IE7+, Firefox, Chrome, Opera, Safari return new XMLHttpRequest(); } if (window.ActiveXObject) { // kode untuk IE6, IE5 return new ActiveXObject("Microsoft.XMLHTTP"); }
89<*&0-$+0 D.&'$& E.)F.) GC$D 0'31 7'0' -1%&.%&J-1%&.%& 0$%&'% 7$%2$('6'% 01 '9'6D /'31 C19' (15'9 AE%9E5 -$31C.9D -'&'1/'%' A'3' /$/-.'9 E-2$C '2'M 0'% -'&'1/'%' A'3'%8' -$3CE/.%1C'61 0$%&'% 6$3@$3; X$91C' )2'M /$('C.C'% CE/.%1C'61 0'% 93'%6'C61 0'9' 0$%&'% 6$3@$3D -$3'391 '%0' 5'3.6 /$/7.%8' 6.'9. 73E&3'/ H$- 8'%& -$32'('% 01 6161 6$3@$3; )0' -'%8'C -'5'6' 7$/E&3'/'% 8'%& -$32'('% 01 6161 6$3@$3D 6$7$391 #4#D ),# 0'% 6$-'&'1%8'; #'0' AE%9E5 -$31C.9 C19' 'C'% /$%&&.%'C'% -'5'6' #4#; #'0' AE%9E5 -$31C.9 C19' 'C'% /$/-.'9 6.'9. 73E&3'/ 8'%& /$%&'/-1( 0'9' 8'%& C19' ($9'CC'% 01 0'('/ 0'9'-'6$ =8,\>; *'01 /16'( C19' 7.%8' 9'-$(F'9'C'38'H'% 01 0'9'-'6$ =8,\>; -- Table structure for table `tabelDataKaryawan` -CREATE TABLE `tabeldatakaryawan` ( `NIP` int(10) NOT NULL, `Nama` varchar(50) NOT NULL, `Email` varchar(50) NOT NULL, `Alamat` tinytext NOT NULL, PRIMARY KEY (`NIP`) )
7
http://blog.codingwear.com PHP Ajax Javascript jQuery Tutorial Indonesia
K$31C.9 '0'('5 161 0'31 9'-$(F'9'X'38'H'% 9$36$-.9
GHI ]]^_`a
G$<$ F$631b'(
J<$0B 03bcI/1;AE/
]]^_`d
e.3/1 f.(19'
%.3/1cI/1;AE/
]^a`_B
K.01 4'39E%E
-.01cI/1;AE/
"B$<$/ ,93$$9 ""[ %E; BB?D <$/-'&'7.3'D #'7.' <$3'6 Z69'9$ eE; ?B_D <$/-'&'7.3'D #'7.' K'3'C \ P10&$ A'/7
>'(. C19' /$/-.'9 5'('/'% 4<=> .%9.C /$%'/71(C'% 0'9' 9$36$-.9D /$%&&.%'C'% 6$/'A'/ 03E7J0EH% -EMD 8'%& C'('. 01C(1C /'C' 'C'% /$%&'/-1( 0'9' 01 =8,\> 0'% /$%'/71(C'%%8' 01 5'('/'% C'38'H'%;59/( 9'%7' 5'3.6 /$J3$(E'01%& C$6$(.3.5'% 5'('/'%
89,. K; ,$/$-$)%$A$&;(/
<script> var ajaxku; function ambildata(nip){ ajaxku = buatajax(); var url="ambildata.php"; url=url+"?q="+nip; url=url+"&sid="+Math.random(); ajaxku.onreadystatechange=stateChanged; ajaxku.open("GET",url,true); ajaxku.send(null); } function buatajax(){ if (window.XMLHttpRequest){ return new XMLHttpRequest(); } if (window.ActiveXObject){ return new ActiveXObject("Microsoft.XMLHTTP"); } return null; } function stateChanged(){ var data; if (ajaxku.readyState==4){ data=ajaxku.responseText; if(data.length>0){ document.getElementById("alamat").value = data }else{ document.getElementById("alamat").value = ""; } } } Nama :
8
http://blog.codingwear.com PHP Ajax Javascript jQuery Tutorial Indonesia --Pilih Karyawan-- Desrizal Nurmi Yulita Budi Hartono Alamat :
Pada contoh berikut anda akan memilih nama dan mengambil data alamat di database
berdasarkan nama tersebut dan menampilkannya di halaman ini tanpa harus me-reload
keseluruhan halaman