About Me

Agus Haryanto,
Android Trainner,
GoogleMaps (JavaScript) Trainer
JQuery and JQuery Mobile Trainer
Java, Java Script and PHP Trainer
Freelance Developer Android
Freelance Developer Blackberry
Freelance Developer Web (GIS Googlemaps)
Freelance Developer SMS Gateway

jika ingin contact saya bisa emali ke agus.superwriter@gmail.com

ym: agus_h23

Pin BB : 2AD38B33

Facebook : Agus Haryanto


Article

Membuat Zebra Table dengan Jquery

Intro

Beberapa waktu yang lalu kita mencoba mereview web aplication yang telah kita buat. Sampai akhirnya pada menu reporting, saya buka salah satu report lalu saya cermati, kok terlikhat ada yang kurang. dengan tampilan seperti ini tentunya user akan sulit menentukan satu kesatuan record dalam 1 baris.

Saya berfikir akan lebih baik kalau kita bisa menampilkan data [...]

Share

Tips Belajar Jquery Mengenal Selector JQuery Basic Filter (:odd)

Mengenal Selector JQuery Basic Filter (:odd)

match odd elements

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script src="../jquery-latest.js"></script>

<script>
$(document).ready(function(){
$("tr:odd").css("background-color", "#bbbbff");
});
</script>
<style>
table {
[...]

Share

Mengenal Selector JQuery Basic Filter (:even)

match even elements

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script src="../jquery-latest.js"></script>

<script>
$(document).ready(function(){
$("tr:even").css("background-color", "#bbbbff");
});
</script>
<style>
table {
background:#eeeeee;
[...]

Share

Mengenal Selector JQuery Basic Filter (:not)

Filters out all elements matching the given selector.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script src="../jquery-latest.js"></script>

<script>
$(document).ready(function(){

$("input:not(:checked) + span").css("background-color", "yellow");
$("input").attr("disabled", "disabled");

});
[...]

Share

Mengenal Selector JQuery Basic Filter (:last)

matches the last selected element.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script src="../jquery-latest.js"></script>

<script>
$(document).ready(function(){
$("tr:last").css({backgroundColor: ‘yellow’, fontWeight: ‘bolder’});
});
</script>

</head>
<body>
<table>
<tr><td>First [...]

Share

Mengenal Selector JQuery Basic Filter (:first)

:first

Match the first selected element.

Pertandingan pertama elemen yang dipilih.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script src="../jquery-latest.js"></script>

<script>
$(document).ready(function(){
$("tr:first").css("font-style", "italic");
});
</script>
<style>
td [...]

Share

Mengenal Selector JQuery Hierachi (prev ~ sibling)

Prev ~ Sibling

Matches all sibling elements after the “prev” element that match the filtering “siblings” selector.

Cocokkan semua elemen saudara kandung setelah “prev” elemen yang cocok dengan penyaringan “saudara kandung” pemilih.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
[...]

Share

Mengenal Selector JQuery Hierachi (prev + next)

Perintah

$(“label + input”).css(“color”, “blue”).val(“Labeled!”)

digunakan untuk menset value seluruh element input yang dituliskan berada disamping element label yang ada di document HTML, valuenya diset = Labeled!

Prev + next

Matches all next elements specified by “next” that are next to elements specified by “prev”. Terjemahan googlenya Cocokkan semua elemen berikutnya ditentukan oleh “di samping” yang di [...]

Share

Mengenal Selector JQuery Hierachi (Parent > child)

Matches all child elements specified by “child” of elements specified by “parent”. Terjemahan google Cocokkan semua elemen anak ditentukan oleh “anak” dari unsur ditentukan oleh “orang tua”. Bingung yah, nggak usah bingung, kita langsung praktek saja

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
[...]

Share

Mengenal Selector JQuery Hierachi (ancestor descendant)

ancestor descendant

Matches all descendant elements specified by “descendant” of elements specified by “ancestor”, coba terjemahkan pakai google translate artinya Cocokkan semua unsur keturunan ditentukan oleh “keturunan” dari unsur ditentukan oleh “nenek moyang” wah bingung yah.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
[...]

Share