Cara Membuat Tabel Hitung Mol dengan Calx di Blogger

Minggu, 19 April 2015

Berikut ini adalah tabel untuk perhitungan jumlah mol zat, massa zat, dan massa molar zat yang dibuat dengan prinsip fungsi microsoft excel yang diubah menggunakan Calx.
Prinsip tabel hitung mol ini adalah menginput 2 variabel yang diketahui pada kolom "Input" untuk menghitung satu variabel lain yang ditanya (dapat dilihat pada kolom "Hasil". Tulisan sebelumnya sedikit saya ceritakan tentang Calx di sini yang merupakan kelanjutan pemuasan rasa ingin tahu saya di sini.

Rumus hitungan untuk tabel hitung ini sebagai berikut:
$Massa~Zat = Jumlah~Mol~Zat \times Massa~Molar~Zat$

$Jumlah~Mol~Zat = \frac{Massa~Zat}{Massa~Molar~Zat}$

$Massa~Molar~Zat = \frac{Massa~Zat}{Jumlah~Mol~Zat}$


InputHasilSatuan
Massa Zat: gram
Jumlah Mol Zat: mol
Massa Molar Zat: gram/mol

Bagaimana membuat tabel hitung mol dengan jQuery Calx ini?
  1. Pastikan dalam template blogger sudah terpasang script jQuery Calx versi terkini (2.2.0). Jika belum terpasang bisa mengunduh atau mengungahnya ke hosting javacript seperti yourjavascript.com. Pasang link script tadi seperti tampak pada gambar berikut.
  2. Buat tabel di posting pada mode editor html. Kodenya seperti berikut ini.
  3. 
    <form id="calx">
    <table class="tabel"><tbody>
    <tr><th></th><th>Input</th><th>Hasil</th><th>Satuan</th></tr>
    <tr><td>Massa Zat</td><td>: <input data-cell="A1" /></td><td><input data-cell="B1" /></td><td>gram</td></tr>
    <tr><td>Jumlah Mol Zat</td><td>: <input data-cell="A2" /></td><td><input data-cell="B2" /></td><td>mol</td></tr>
    <tr><td>Massa Molar Zat</td><td>: <input data-cell="A3" /></td><td><input data-cell="B3" /></td><td>gram/mol</td></tr>
    </tbody> </table>
    </form>
    
    <script>
        $('#calx').calx({
            data : {
                A1 : { value : '' },
                A2 : { value : '' },
                A3 : { value : '' },
                B1 : { formula : 'IF(A1="";A2*A3;"")' },
                B2 : { formula : 'IF(A2="";A1/A3;"")' },
                B3 : { formula : 'IF(A3="";A1/A2;"")' }
            }
        });
    </script> 
  4. Jika sudah selesai, sila terbitkan atau publish posting ke blog.
Selamat mencoba dan mengeksplorasi lebih lanjut jika berminat.
    Bagikan di

    2 komentar:

    1. Artikelnya bermanfaat kak, ini saya juga punya artikel cara membuat tabel pada postingan blog tanpa coding, semoga dapat saling melengkapi

      Membuat Tabel pada Postingan Blog (Tanpa Coding) - MARKIJAR.Com

      BalasHapus
    2. Keren Mas Sama Mba Nie Jagonya Kodingggg....

      BalasHapus

     
    Copyright © 2015-2016 Urip dot Info | Disain Template Oleh Herdiansyah Hamzah Dimodivikasi Urip.Info