Mengatasi Double JQuery
Christian · Feb 24, 2016
Malam mas,, sy pendatang baru mw ikt tanya ni.. buat code PHP ttg retail toko, saat dengan auto input saat saya memasukan kode pada menu kasir nya... sy ingin wktu saya memasukan kode langsung keluar nama, harga dll, dan bisa lgsung di submit n masuk ke database...
dan saya mengalami masalah pada template saya yang menggunakan template bootstrap yang menggunakan JQuery 2.1.4 sedangkan Auto input file nya,, Link Auto Input File nya : http://www.4shared.com/zip/zvH-Ao1xba/JQuery-set-input-value.html?cau2=403tNull&ua=WINDOWS
Kode PHP saya :
dan ini buat Load Data nya :
Tolong bantuan nya buat para master dan senior disini,, thanks
dan saya mengalami masalah pada template saya yang menggunakan template bootstrap yang menggunakan JQuery 2.1.4 sedangkan Auto input file nya,, Link Auto Input File nya : http://www.4shared.com/zip/zvH-Ao1xba/JQuery-set-input-value.html?cau2=403tNull&ua=WINDOWS
Kode PHP saya :
<!DOCTYPE html>
<html>
<head>
<title>ShopFLO - Casier</title>
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<!-- Bootstrap 3.3.5 -->
<link rel="stylesheet" href="../../bootstrap/css/bootstrap.min.css">
<!-- Font Awesome -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<!-- Ionicons -->
<link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
<!-- Theme style -->
<link rel="stylesheet" href="../../dist/css/AdminLTE.min.css">
<!-- AdminLTE Skins. Choose a skin from the css/skins
folder instead of downloading all of them to reduce the load. -->
<link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.css">
<!-- iCheck -->
<link rel="stylesheet" href="../../plugins/iCheck/flat/blue.css">
<!-- Morris chart -->
<link rel="stylesheet" href="../../plugins/morris/morris.css">
<!-- jvectormap -->
<link rel="stylesheet" href="../../plugins/jvectormap/jquery-jvectormap-1.2.2.css">
<!-- Date Picker -->
<link rel="stylesheet" href="../../plugins/datepicker/datepicker3.css">
<!-- Daterange picker -->
<link rel="stylesheet" href="../../plugins/daterangepicker/daterangepicker-bs3.css">
<!-- bootstrap wysihtml5 - text editor -->
<link rel="stylesheet" href="../../plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.min.css">
</head>
<body class="hold-transition skin-blue sidebar-mini" onload="setInterval('displayServerTime()', 1000);">
<?php
include("../../koneksi.php");
SESSION_START();
if(!isset($_SESSION['user_id'])){
header('location:../../index.html');
}else{
$user = $_SESSION['user_id'];
$sql = "SELECT * FROM t_master WHERE user = '$user'";
$hasil = mysql_query($sql);
$baris = mysql_fetch_array($hasil);
}
?>
<div class="wrapper">
<header class="main-header">
<!-- Logo -->
<a href="home.php" class="logo">
<!-- mini logo for sidebar mini 50x50 pixels -->
<span class="logo-mini"><b>FLO</b></span>
<!-- logo for regular state and mobile devices -->
<span class="logo-lg"><b>Shop</b>FLO</span>
</a>
<!-- Header Navbar: style can be found in header.less -->
<nav class="navbar navbar-static-top" role="navigation">
<!-- Sidebar toggle button-->
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
<span class="sr-only">Toggle navigation</span>
</a>
<div class="navbar-custom-menu">
<ul class="nav navbar-nav">
<!-- Messages: style can be found in dropdown.less-->
<li class="dropdown messages-menu">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<i class="fa fa-group"></i>
<span class="label label-success"><?php $OL = mysql_fetch_array(mysql_query("SELECT COUNT(*) FROM t_login WHERE status = 'Online' ")); echo "$OL[0]";?></span>
</a>
<ul class="dropdown-menu">
<li>
<!-- inner menu: contains the actual data -->
<ul class="menu">
<?php
$result_online = mysql_query("SELECT * FROM t_login WHERE status = 'Online' ORDER BY level DESC");
while($online = mysql_fetch_array($result_online))
{
echo "<li>";
echo "<a href='#''>";
echo "<div class='pull-left'>";
echo "<img src='../../dist/img/user2-160x160.jpg' class='img-circle' alt='User Image'>";
echo "</div>";
echo "<h4>";
$temp_real = mysql_fetch_array(mysql_query("SELECT * FROM t_master WHERE user = '$online[0]'"));
echo "<i class='fa fa-circle text-success'></i> $temp_real[1]";
echo "<small><i class='fa fa-clock-o'></i>Now</small>";
echo "</h4>";
echo "$temp_real[2]";
echo "</a>";
echo "</li>";
}
$result_offline = mysql_query("SELECT * FROM t_login WHERE status = 'Offline'");
while($offline = mysql_fetch_array($result_offline))
{
echo "<li>";
echo "<a href='#''>";
echo "<div class='pull-left'>";
echo "<img src='../../dist/img/user2-160x160.jpg' class='img-circle' alt='User Image'>";
echo "</div>";
echo "<h4>";
$temp_real = mysql_fetch_array(mysql_query("SELECT * FROM t_master WHERE user = '$offline[0]'"));
echo "$temp_real[1]";
echo "<small><i class='fa fa-clock-o'></i>Now</small>";
echo "</h4>";
echo "$temp_real[2]";
echo "</a>";
echo "</li>";
}
?>
<!-- end message -->
</ul>
</li>
</ul>
</li>
<li class="dropdown user user-menu">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<img src="<?php echo "$baris[4]";?>" class="user-image" alt="User Image">
<span class="hidden-xs"><?php echo"$baris[1]"; ?></span>
</a>
<ul class="dropdown-menu">
<!-- User image -->
<li class="user-header">
<img src="<?php echo "$baris[4]";?>" class="img-circle" alt="User Image">
<p>
<?php echo"$baris[1] - $baris[2]" ?>
<small><?php $tahun = substr($baris[3], 0, 4); $bulan = substr($baris[3], 5, 2); if ($bulan=="01") $namabulan="Januari"; elseif ($bulan=="02") $namabulan="Februari"; elseif ($bulan=="03") $namabulan="Maret"; elseif ($bulan=="04") $namabulan="April"; elseif ($bulan=="05") $namabulan="Mei"; elseif ($bulan=="06") $namabulan="Juni"; elseif ($bulan=="07") $namabulan="Juli"; elseif ($bulan=="08") $namabulan="Agustus"; elseif ($bulan=="09") $namabulan="September"; elseif ($bulan=="10") $namabulan="Oktober"; elseif ($bulan=="11") $namabulan="November"; elseif ($bulan=="12") $namabulan="Desember"; echo"$baris[2] since $namabulan $tahun" ?></small>
</p>
</li>
<!-- Menu Footer-->
<li class="user-footer">
<div class="pull-left">
<a href="profile.php" class="btn btn-default btn-flat">Profile</a>
</div>
<div class="pull-right">
<a href="../../logout.php" class="btn btn-default btn-flat">Sign out</a>
</div>
</li>
</ul>
</li>
<!-- Control Sidebar Toggle Button -->
<li>
<a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
</li>
</ul>
</div>
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->
<div class="user-panel">
<div class="pull-left image">
<img src="<?php echo "$baris[4]";?>" class="img-circle" alt="User Image">
</div>
<div class="pull-left info">
<p><?php echo"$baris[1]"; ?></p>
<a href="#"><i class="fa fa-circle text-success"></i> <?php $status = mysql_fetch_array(mysql_query("SELECT * FROM t_login WHERE user = '$user'")); echo"$status[3]"; ?></a>
</div>
</div>
<!-- search form
<form action="#" method="get" class="sidebar-form">
<div class="input-group">
<input type="text" name="q" class="form-control" placeholder="Search...">
<span class="input-group-btn">
<button type="submit" name="search" id="search-btn" class="btn btn-flat"><i class="fa fa-search"></i>
</button>
</span>
</div>
</form>
/.search form -->
<!-- sidebar menu: : style can be found in sidebar.less -->
<ul class="sidebar-menu">
<li class="header">MAIN NAVIGATION</li>
<li>
<a href="home.php">
<i class="fa fa-dashboard active"></i> <span> Dashboard</span>
</a>
</li>
<li class="active">
<a href="#">
<i class="fa fa-files-o"></i>
<span> Casier</span>
</a>
</li>
<li>
<a href="stock.php">
<i class="fa fa-th"></i> <span> Stock</span>
</a>
</li>
<li class="treeview">
<a href="#">
<i class="fa fa-tasks"></i>
<span> Restock</span>
<i class="fa fa-angle-left pull-right"></i>
</a>
<ul class="treeview-menu">
<li><a href="#"><i class="fa fa-circle-o"></i> Restock</a></li>
<li><a href="suplier.php"><i class="fa fa-circle-o"></i> Suplier</a></li>
</ul>
</li>
<li class="">
<a href="#">
<i class="fa fa-group"></i>
<span> Member</span>
</a>
</li>
<li class="">
<a href="#">
<i class="fa fa-bar-chart"></i>
<span> Graph</span>
</a>
</li>
<li class="">
<a href="#">
<i class="fa fa-edit"></i> <span> Resume</span>
</a>
</li><li class="">
<a href="#">
<i class="fa fa-video-camera"></i> <span> Record</span>
</a>
</li>
</ul>
</section>
<!-- /.sidebar -->
</aside>
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
<!-- Content Header (Page header) -->
<section class="content-header">
<h1>
Casier
<small>#1</small>
</h1>
<ol class="breadcrumb">
<li><a href="home.php"><i class="fa fa-dashboard"></i> Home</a></li>
<li class="active"><a href="#">Casier</a></li>
</ol>
</section>
<!--Start Main content -->
<section class="content">
<div class="box">
<div class="box-header with-border">
<h3 class="box-title"><?php print date('d F Y');?> - <span id="clock"><?php print date('H:i:s'); ?></span></h3>
</div>
<div class="box-body">
<table border="0" width="100%">
<tr>
<th width="5%">Code : </th>
<td width="15%">
<?php $tgl = date('d'); $bln = date('m'); $thn = date('y'); $jam = date('H'); $mnt = date('i'); $nmd = substr($baris[1], 0, 1); $nmb = substr($baris[1], -1, 1); echo"$tgl$bln$nmd$thn$jam$nmb$mnt";?>
</td>
<th width="7%">Member : </th>
<td width="12%">
<input type="radio" name="chpas" value="yes" required="" onchange="document.getElementById('member').style.display='block';document.getElementById('membertxt').setAttribute('required','');"/>  Yes    
<input type="radio" name="chpas" value="no" onchange="document.getElementById('member').style.display='none';document.getElementById('membertxt').removeAttribute('required');" checked/>  No
</td>
<td width="8%"></td>
<th width="7%"></th>
<td width="10%"></td>
<td width="5%"></td>
<td width="13%"></td>
<td width="10%"></td>
<td width="8%"></td>
</tr>
<tr>
<th colspan="3"></th>
<td colspan="8">
<div id="member" style="display:none">
<div class="form-group input-group">
<select class="" name="membertxt" id="jenis" required>
<option value="">- Member FLO -</option>
<?php
$sql = mysql_query("SELECT * FROM t_member");
while ($member = mysql_fetch_array($sql)) {
echo "<option value='$member[0]'>$member[0] - $member[1]</option>";
}
?>
</select>
</div>
</div>
</td>
</tr>
<tr>
<th colspan="4"></th>
<th style="font-size: 24px">Total. </th>
<th colspan="6" style="font-size: 50px; color: RED">Rp. 30.000,-</th>
</tr>
</table>
<form action="casier.php" method="post">
<table rules="none" border="2" bordercolor="#EEF2F7" width="100%">
<tr>
<th width="5%" style="height: 40px"> Qty</th>
<th width="15%"> Item Code</th>
<th width="18%"> Information</th>
<th width="8%"> Type</th>
<th width="7%"> Piece</th>
<th width="10%"> Price</th>
<th width="5%">Disc</th>
<th width="15%"> Total Price</th>
<th width="16%" rowspan="2"> <a href="#"><button type="submit" class="btn btn-success" name="submit"><h4> Add List </h4></button></a></th>
</tr>
<tr>
<th style="height: 40px"> <input type="number" name="qtytxt" placeholder="Qty" value="1" style="width: 35px"></input></th>
<th><input type="text" name="codetxt" id="codetxt" placeholder="Code" style="width: 140px"></input> </th>
<th><input type="text" name="itemtxt" id="itemtxt" placeholder="Item Name" style="width: 165px" readonly="true"></input></th>
<th><input type="text" name="typetxt" id="typetxt" placeholder="Type" style="width: 65px" readonly="true"></input></th>
<th><input type="text" name="piecetxt" id="piecetxt" placeholder="Pcs" style="width: 55px" readonly="true"></input></th>
<th>Rp. <input type="text" name="pricetxt" id="pricetxt" placeholder="#####" style="width: 60px" readonly="true"></input></th>
<th><input type="text" name="disctxt" id="disctxt" placeholder="0.0%" style="width: 25px" readonly> %</input></th>
<th>Rp. <input type="text" name="totpricetxt" placeholder="#####" style="width: 90px" readonly=""> </input></th>
</tr>
</table>
</form>
</div>
<!-- /.box-body -->
<div class="box-footer">
Footer
</div>
<!-- /.box-footer-->
</div>
<!-- /.box -->
</section>
<!-- /.content -->
</div>
<!-- /.content-wrapper -->
<footer class="main-footer">
<div class="pull-right hidden-xs">
<b>Version</b> 2.3.2
</div>
<strong>Copyright © 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights
reserved.
</footer>
<!-- Control Sidebar -->
<aside class="control-sidebar control-sidebar-dark">
<!-- Create the tabs -->
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
<li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></i></a></li>
<li><a href="#control-sidebar-settings-tab" data-toggle="tab"><i class="fa fa-gears"></i></a></li>
</ul>
<!-- Tab panes -->
<div class="tab-content">
<!-- Home tab content -->
<div class="tab-pane" id="control-sidebar-home-tab">
<h3 class="control-sidebar-heading">Recent Activity</h3>
<ul class="control-sidebar-menu">
<li>
<a href="javascript::;">
<i class="menu-icon fa fa-birthday-cake bg-red"></i>
<div class="menu-info">
<h4 class="control-sidebar-subheading">Langdon's Birthday</h4>
<p>Will be 23 on April 24th</p>
</div>
</a>
</li>
<li>
<a href="javascript::;">
<i class="menu-icon fa fa-user bg-yellow"></i>
<div class="menu-info">
<h4 class="control-sidebar-subheading">Frodo Updated His Profile</h4>
<p>New phone +1(800)555-1234</p>
</div>
</a>
</li>
<li>
<a href="javascript::;">
<i class="menu-icon fa fa-envelope-o bg-light-blue"></i>
<div class="menu-info">
<h4 class="control-sidebar-subheading">Nora Joined Mailing List</h4>
<p>nora@example.com</p>
</div>
</a>
</li>
<li>
<a href="javascript::;">
<i class="menu-icon fa fa-file-code-o bg-green"></i>
<div class="menu-info">
<h4 class="control-sidebar-subheading">Cron Job 254 Executed</h4>
<p>Execution time 5 seconds</p>
</div>
</a>
</li>
</ul>
<!-- /.control-sidebar-menu -->
<h3 class="control-sidebar-heading">Tasks Progress</h3>
<ul class="control-sidebar-menu">
<li>
<a href="javascript::;">
<h4 class="control-sidebar-subheading">
Custom Template Design
<span class="label label-danger pull-right">70%</span>
</h4>
<div class="progress progress-xxs">
<div class="progress-bar progress-bar-danger" style="width: 70%"></div>
</div>
</a>
</li>
<li>
<a href="javascript::;">
<h4 class="control-sidebar-subheading">
Update Resume
<span class="label label-success pull-right">95%</span>
</h4>
<div class="progress progress-xxs">
<div class="progress-bar progress-bar-success" style="width: 95%"></div>
</div>
</a>
</li>
<li>
<a href="javascript::;">
<h4 class="control-sidebar-subheading">
Laravel Integration
<span class="label label-warning pull-right">50%</span>
</h4>
<div class="progress progress-xxs">
<div class="progress-bar progress-bar-warning" style="width: 50%"></div>
</div>
</a>
</li>
<li>
<a href="javascript::;">
<h4 class="control-sidebar-subheading">
Back End Framework
<span class="label label-primary pull-right">68%</span>
</h4>
<div class="progress progress-xxs">
<div class="progress-bar progress-bar-primary" style="width: 68%"></div>
</div>
</a>
</li>
</ul>
<!-- /.control-sidebar-menu -->
</div>
<!-- /.tab-pane -->
<!-- Stats tab content -->
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div>
<!-- /.tab-pane -->
<!-- Settings tab content -->
<div class="tab-pane" id="control-sidebar-settings-tab">
<form method="post">
<h3 class="control-sidebar-heading">General Settings</h3>
<div class="form-group">
<label class="control-sidebar-subheading">
Report panel usage
<input type="checkbox" class="pull-right" checked>
</label>
<p>
Some information about this general settings option
</p>
</div>
<!-- /.form-group -->
<div class="form-group">
<label class="control-sidebar-subheading">
Allow mail redirect
<input type="checkbox" class="pull-right" checked>
</label>
<p>
Other sets of options are available
</p>
</div>
<!-- /.form-group -->
<div class="form-group">
<label class="control-sidebar-subheading">
Expose author name in posts
<input type="checkbox" class="pull-right" checked>
</label>
<p>
Allow the user to show his name in blog posts
</p>
</div>
<!-- /.form-group -->
<h3 class="control-sidebar-heading">Chat Settings</h3>
<div class="form-group">
<label class="control-sidebar-subheading">
Show me as online
<input type="checkbox" class="pull-right" checked>
</label>
</div>
<!-- /.form-group -->
<div class="form-group">
<label class="control-sidebar-subheading">
Turn off notifications
<input type="checkbox" class="pull-right">
</label>
</div>
<!-- /.form-group -->
<div class="form-group">
<label class="control-sidebar-subheading">
Delete chat history
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
</label>
</div>
<!-- /.form-group -->
</form>
</div>
<!-- /.tab-pane -->
</div>
</aside>
<!-- /.control-sidebar -->
<!-- Add the sidebar's background. This div must be placed
immediately after the control sidebar -->
<div class="control-sidebar-bg"></div>
</div>
<!-- ./wrapper -->
<!-- jQuery 2.1.4 -->
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
<!-- jQuery UI 1.11.4 -->
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
<!-- Resolve conflict in jQuery UI tooltip with Bootstrap tooltip -->
<script>
$.widget.bridge('uibutton', $.ui.button);
</script>
<!-- Bootstrap 3.3.5 -->
<script src="../../bootstrap/js/bootstrap.min.js"></script>
<!-- Morris.js charts -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script>
<script src="../../plugins/morris/morris.min.js"></script>
<!-- Sparkline -->
<script src="../../plugins/sparkline/jquery.sparkline.min.js"></script>
<!-- jvectormap -->
<script src="../../../../plugins/jvectormap/jquery-jvectormap-1.2.2.min.js"></script>
<script src="../../plugins/jvectormap/jquery-jvectormap-world-mill-en.js"></script>
<!-- jQuery Knob Chart -->
<script src="../../plugins/knob/jquery.knob.js"></script>
<!-- daterangepicker -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.2/moment.min.js"></script>
<script src="../../plugins/daterangepicker/daterangepicker.js"></script>
<!-- datepicker -->
<script src="../../plugins/datepicker/bootstrap-datepicker.js"></script>
<!-- Bootstrap WYSIHTML5 -->
<script src="../../plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js"></script>
<!-- Slimscroll -->
<script src="../../plugins/slimScroll/jquery.slimscroll.min.js"></script>
<!-- FastClick -->
<script src="../../plugins/fastclick/fastclick.js"></script>
<!-- AdminLTE App -->
<script src="../../dist/js/app.min.js"></script>
<!-- AdminLTE dashboard demo (This is only for demo purposes) -->
<script src="../../dist/js/pages/dashboard.js"></script>
<!-- AdminLTE for demo purposes -->
<script src="../../dist/js/demo.js"></script>
<script type="text/javascript">
//set timezone
<?php date_default_timezone_set('Asia/Jakarta'); ?>
//buat object date berdasarkan waktu di server
var serverTime = new Date(<?php print date('Y, m, d, H, i, s, 0'); ?>);
//buat object date berdasarkan waktu di client
var clientTime = new Date();
//hitung selisih
var Diff = serverTime.getTime() - clientTime.getTime();
//fungsi displayTime yang dipanggil di bodyOnLoad dieksekusi tiap 1000ms = 1detik
function displayServerTime(){
//buat object date berdasarkan waktu di client
var clientTime = new Date();
//buat object date dengan menghitung selisih waktu client dan server
var time = new Date(clientTime.getTime() + Diff);
//ambil nilai jam
var sh = time.getHours().toString();
//ambil nilai menit
var sm = time.getMinutes().toString();
//ambil nilai detik
var ss = time.getSeconds().toString();
//tampilkan jam:menit:detik dengan menambahkan angka 0 jika angkanya cuma satu digit (0-9)
document.getElementById("clock").innerHTML = (sh.length==1?"0"+sh:sh) + ":" + (sm.length==1?"0"+sm:sm) + ":" + (ss.length==1?"0"+ss:ss);
}
</script>
<!--Menampilkan data yang akan dipilih-->
<script language="javascript" src="../../dist/js/lala.js"></script>
<script language="javascript">
$(document).ready(function() {
$("#codetxt").keyup(function() {
var nisp = $('#codetxt').val();
$.post('load_data.php', // request ke file load_data.php
{parent_id: nisp},
function(data){
$('#itemtxt').val(data[0].nama);
$('#typetxt').val(data[0].jenis);
$('#piecetxt').val(data[0].satuan);
$('#pricetxt').val(data[0].harga_jual);
$('#disctxt').val(data[0].disc);
},'json'
);
});
});
</script>
</body>
</html>
dan ini buat Load Data nya :
<?php
include('../../koneksi.php');
$sql="SELECT kode, nama, jenis, satuan, harga_jual, disc FROM t_item WHERE kode = '$_POST[parent_id]'";
$response = array(); // siapkan respon yang nanti akan di convert menjadi JSON
$query = mysql_query($sql);
if($query){
if(mysql_num_rows($query) > 0){
while($row = mysql_fetch_object($query)){
// masukan setiap baris data ke variable respon
$response[] = $row;
}
}else{
$response['error'] = 'Data kosong'; // memberi respon ketika data kosong
}
}else{
$response['error'] = mysql_error(); // memberi respon ketika query salah
}
die(json_encode($response)); // convert variable respon menjadi JSON, lalu tampilkan
?>
Tolong bantuan nya buat para master dan senior disini,, thanks
Silahkan login untuk menjawab!