Tutorial PHP Pemula & Mahir

Question

otomatis penjumlahan

mustopa · Aug 8, 2011

		<td><input type="text" name="harga[]" id="harga" size="20" onchange="jumlah"/></td>
		<td style="text-align: center;">x</td>
		<td><input type="text" name="item[]" id="item" size="15" onchange="jumlah"/></td>
		<td><input type="text" name="jum[]" id='jum' size="20" onchange="jumlah"/></td>

gimana caranya pada colom jum bisa keluar otomatis saat inputan harga dan item di isi secara manual ..
tolong di bantuannya ..

Silahkan login untuk menjawab!

Answer 1

2

Ellyx Christian · Aug 8, 2011 · 3 Suka · 1 Tidak Suka

<td><input type="text" name="harga[]" class="harga" size="20"/></td>
<td style="text-align: center;">x</td>
<td><input type="text" name="item[]" class="item" size="15" value="0"/></td>
<td><input type="text" name="jum[]" class='jum' size="20" /></td>
<!-- tambahkan setelah tag </table> -->
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
$(".harga").keyup(function(){
var jum = $(this).parent().next().next().next().find('.jum');
var item = $(this).parent().next().next().find('.item');
$(jum).val($(this).val() * $(item).val());
});
$(".item").keyup(function(){
var jum = $(this).parent().next().find('.jum');
var harga = $(this).parent().prev().prev().find('.harga');
$(jum).val($(this).val() * $(harga).val());
});
});
</script>

Answer 2

0

mustopa · Aug 10, 2011 · 0 Suka · 0 Tidak Suka

wah makasih bang..
sukses!!!

tapi sekarang ane tambahin sintaknya malah kg jalan pas baris yang muncul saat ane klik tombol buat tambah baris (baris kedua'y)

<?php
include_once "../koneksi.php";?>
<script type="text/javascript" src="../jquery.min.js"></script>
<script type="text/javascript">
var idrow = 2;
function tambah() {
	var x=document.getElementById('datatabel').insertRow(idrow);
	var td1=x.insertCell(0);
	var td2=x.insertCell(1);
	var td3=x.insertCell(2);	
	var td4=x.insertCell(3);	
	var td5=x.insertCell(4);	
	td1.innerHTML="<select name='nama[]' onchange='document.getElementById(\'harga\').value=prdName[this.value]'><?php
				$result = mysql_query("select * from barang");
				echo "<option>-------</option>";
				while ($row = mysql_fetch_array($result)) {
				echo "<option value='".$row['idbar']."'>" . $row['nabar']."</option>";
				$jsArray .= "prdName['" . $row['idbar'] . "'] = '" . addslashes($row['harga']) . "';\n";	
				} ?></select>";
	td2.innerHTML="<input type='text' name='harga[]' size='20' id='harga' class='harga'/>";
	td3.innerHTML="<center>x</center>";
	td4.innerHTML="<input type='text' name='item[]' size='15' class='item'>";
	td5.innerHTML="<input type='text' name='jum[]' size='20' class='jum' disabled='true'>";
	idrow++;
}
function hapus(){
	if(idrow>2){
		var x=document.getElementById('datatabel').deleteRow(idrow-1);
		idrow--;
	}
}
</script>
<table id="datatabel" style="margin: 5px 0 5px 120px;">

<tr style="background: #C05F00;">
<th style="text-align: center;">Barang</th>
<th style="text-align: center;">Harga</th>
<th style="text-align: center;">x</th>
<th style="text-align: center;">Item</th>
<th style="text-align: center;">Total</th>
</tr>
<tr>
<td><?php
	$result = mysql_query("select * from barang");
$jsArray = "var prdName = new Array();\n";
echo '<select name="nama[]" onchange="document.getElementById(\'harga\').value = prdName[this.value]">';
echo '<option>-------</option>';
while ($row = mysql_fetch_array($result)) {
    echo '<option value="' . $row['idbar'] . '">' . $row['nabar'] . '</option>';
    $jsArray .= "prdName['" . $row['idbar'] . "'] = '" . addslashes($row['harga']) . "';\n";
}
echo '</select>';?>
			</td>
		<td><input type="text" name="harga[]" id="harga" class="harga" size="20"/>
		<script type="text/javascript">
			<?php echo $jsArray; ?>
			</script>
		</td>
		<td style="text-align: center;">x</td>
    <td><input type="text" name="item[]" class="item" size="15"/></td>
    <td><input type="text" name="jum[]" class="jum" size="20" disabled='true'/></td>
	</tr>
</table>    
    <!-- tambahkan setelah tag </table> -->
    <script type="text/javascript">
    $(function(){
    $(".harga").keyup(function(){
    var jum = $(this).parent().next().next().next().find('.jum');
    var item = $(this).parent().next().next().find('.item');
    $(jum).val($(this).val() * $(item).val());
    });
    $(".item").keyup(function(){
    var jum = $(this).parent().next().find('.jum');
    var harga = $(this).parent().prev().prev().find('.harga');
    $(jum).val($(this).val()*$(harga).val());
    });
    });
    </script>
<div class="tbh">
<input type="button" value="tambah baris" onclick="tambah()">
<input type="button" value="hapus baris" onclick="hapus()">
</div>

|
picture :
http://farm7.static.flickr.com/6183/6028469394_a0321faf4a_z.jpg

Answer 3

0

Ellyx Christian · Aug 10, 2011 · 0 Suka · 0 Tidak Suka

javascriptnya harus diubah jadi

<script type="text/javascript">
 $(function(){
 $(".harga").live('keyup',function(){
 var jum = $(this).parent().next().next().next().find('.jum');
 var item = $(this).parent().next().next().find('.item');
 $(jum).val($(this).val() * $(item).val());
 });
 $(".item").live('keyup',function(){
 var jum = $(this).parent().next().find('.jum');
 var harga = $(this).parent().prev().prev().find('.harga');
 $(jum).val($(this).val()*$(harga).val());
 });
 });
 </script>

Answer 4

0

mustopa · Aug 11, 2011 · 0 Suka · 0 Tidak Suka

udah bis bang .. tapi pas kode

<td><?php
	$result = mysql_query("select * from barang");
	$jsArray = "var prdName = new Array();\n";
	echo '<select name="nama[]" onchange="document.getElementById(\'harga\').value = prdName[this.value]">';
	echo '<option>-------</option>';
	while ($row = mysql_fetch_array($result)) {
    echo '<option value="' . $row['idbar'] . '">' . $row['nabar'] . '</option>';
    $jsArray .= "prdName['".$row['idbar']."']='". addslashes($row['harga']) . "';\n";
	}
	echo '</select>';?>
			</td>
		<td><input type="text" name="harga[]" id="harga" class="harga" size="20"/>
		<script type="text/javascript">
			<?php echo $jsArray; ?>
			</script>
		</td>

saat ane klik tombol buat tambah baris (baris kedua'y) pas di klik nama barang dan di text'y kg muncul ..
padahal ane udah coba liat di http://ask.myphptutorials.com/questions/view/104 ..
mohon pencerahannya bang ..

Answer 5

0

Ellyx Christian · Aug 11, 2011 · 0 Suka · 0 Tidak Suka

satu hal yang harus kamu ketahui attribute id sebuah element adalah unique, tidak boleh sama. Jadi kode itu hanya akan berlaku pada satu element saja.

<td>
	<?php
	$result = mysql_query("select * from barang");
	$jsArray = "var prdName = new Array();\n";
	echo '<select name="nama[]" class="nama">';
	echo '<option>-------</option>';
	while ($row = mysql_fetch_array($result)) {
		echo '<option value="' . $row['idbar'] . '">' . $row['nabar'] . '</option>';
		$jsArray .= "prdName['".$row['idbar']."']='". addslashes($row['harga']) . "';\n";
	}
	echo '</select>';
	?>
</td>
<td>
	<input type="text" name="harga[]" id="harga" class="harga" size="20"/>
</td>

kemudian ubah javascript menjadi

<script type="text/javascript">
<?php echo $jsArray; ?>
$(function(){
$(".harga").live('keyup',function(){
	var jum = $(this).parent().next().next().next().find('.jum');
	var item = $(this).parent().next().next().find('.item');
	$(jum).val($(this).val() * $(item).val());
});
$(".item").live('keyup',function(){
	var jum = $(this).parent().next().find('.jum');
	var harga = $(this).parent().prev().prev().find('.harga');
	$(jum).val($(this).val()*$(harga).val());
});
$(".nama").live('change', function(){
	var harga = $(this).parent().next().find('.harga');
	$(harga).val(prdName[$(this).val()]);
});
});
</script>

Answer 6

0

mustopa · Aug 12, 2011 · 0 Suka · 0 Tidak Suka

terima kasih bang berjalan dengan mulus .. yang saya heran membaca kode tersebut

hahahahah ..
sekali makasih bang .. n sukses buat abang ..

Answer 7

0

masmus · Aug 7, 2012 · 0 Suka · 0 Tidak Suka

Selamat pgi mas Ellyx Christian,mohon pencerahan saya sedang mencari script agar bisa menambah baris yang terdiri dari beberapa inputan seperti contohnya mas Mustopa gambar terlampir, untuk digunakan sebagai data nilai siswa, kemudian ada tombol submit yang langsung masuk ke database, atas perhatiannya terimakasih.

Tks
Masmus

Answer 8

0

Ellyx Christian · Aug 14, 2012 · 0 Suka · 0 Tidak Suka

@masmus: gambar terlampir? yang mana?
mungkin tutorial http://www.myphptutorials.com/tutorials/154/menyimpan-data-menampilkan-beberapa-tabel bisa membantu

Answer 9

0

masmus · Aug 15, 2012 · 0 Suka · 0 Tidak Suka

Yang saya maksud bukan seperti itu mas namun sya ingin melanjutkan script punya mas Mustopa diatas,

[ http://farm7.static.flickr.com/6183/6028469394_a0321faf4a_z.jpg ]

semua sudah saya coba berjalan dengan lancar p enambahan secara otomatis juga berhasil, namu yang menjadi kendala pada saat ini adalah
1. Ketika ingin menambahkan baris baru lagi kok tidak muncul yang sama dengan yang diatas
2. Kemudian bagaimana menyimpan semua row yang kita tambahkan ke dalam database

Itu dlu mas Ellyx Christian, terimakasih sebelumnya

Answer 10

0

Ellyx Christian · Aug 15, 2012 · 0 Suka · 0 Tidak Suka

ditutorial http://www.myphptutorials.com/tutorials/154/menyimpan-data-menampilkan-beberapa-tabel sudah ada, dibagian komentar juga sudah dibahas bagaimana menggunakan combobox