sebelum saya minta kalian mengetik listing code silahkan baca materi sebelumnya tentang bahasa program yang digunakan untuk versi web mobile klik pada tulisan ini (bahasa program web mobile)  kemudian untuk mengerjakan latihan dibawah ini silahkan di ingat kembali dan kalau perlu diulang kembali tentang materi cara menerapkan code JQuery Mobile pada halaman HTML kalau lupa silahkan Klik pada tulisan ini (penerapan jquery mobile pada halaman html) , kalau belum punya core jquerynya silahkan download pada tulisan ini (download jquerymobile)Selanjutnya Buatlah file pada forder yang sama buat nama filenya daftarlist.html kemudian Ketiklah listing code seperti dibawah ini :

 

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="jquery.mobile-1.4.5.min.css">
<script src="jquery-1.11.3.min.js"></script>
<script src="jquery.mobile-1.4.5.min.js"></script>
</head>
<body></pre>
<div data-role="page" id="pageone">
<div data-role="main" class="ui-content">
<h2>My Phonebook</h2>
<p>In this example, we have used the data-filtertext="fav" on "Adele". This means that you are no longer able to search for the list item "Adele" anymore. You can only find Adele by typing the keywords "f, a, v or fav".)</p>
<form class="ui-filterable">
<input id="myFilter" data-type="search">
</form>
<ul data-role="listview" data-filter="true" data-input="#myFilter" data-autodividers="true" data-inset="true">
<li data-filtertext="fav"><a href="#">Adele</a></li>
<li><a href="#">Agnes</a></li>
<li><a href="#">Albert</a></li>
<li><a href="#">Billy</a></li>
<li><a href="#">Bob</a></li>
<li><a href="#">Calvin</a></li>
<li><a href="#">Cameron</a></li>
<li><a href="#">Chloe</a></li>
<li><a href="#">Christina</a></li>
<li><a href="#">Diana</a></li>
<li><a href="#">Frank</a></li>
<li><a href="#">Gabriel</a></li>
<li><a href="#">Glen</a></li>
<li><a href="#">Ralph</a></li>
<li><a href="#">Valarie</a></li>
</ul>
</div>
</div>

<script type="text/javascript"></script></body>
</html>
<pre>

setelah dikerjaan ubah nama nama yang tercantum dalam daftar list dengan nama nama sesuai keinginan kalian (modifikasi) kemudian listing tersebut dan dikumpulkan pada pertemuan selanjutnya dalam bentuk file

 

6 thoughts on “materi Pemrograman mobile : JQ Mobile Daftar

  • *****

    maaf,untuk pengumpulan tugas ini,bisa dilakukan untuk pertemuan hari ini,atau gimana pak? ,terima kasih.

    • masrommi Post author

      Tugas ini nanti dikumpul dalam bentuk file , untuk waktu pengumpulannya belum saya tentukan. Dikerjakan saja dan disave aja dulu.

  • ahp

    terimakasih pak infonya, semoga bisa mengerjakan…..

  • ahp

    Pak untuk jquerynya di gabung dengan listing daftarlist.html ya,?
    agar listingnya dapat di akses sama seperti hasil pada modul yang telah di upload sebelumnya. Trimakasih sebelumnya pak. Selamat Malam.

    • masrommi Post author

      Iya, letakkan file jquerynya didalam folder yang letaknya sama dengan daftarlist.html, bisa juga dicek dimodul sebelumnya caranya ada di modul sebelumnya,

Leave a Reply

Your email address will not be published. Required fields are marked *