您好我一直在寻找这个答案,但我仍然有错误。 我想根据使用select2的选择框中的选定项目显示产品的详细信息,选择框的项目或值来自数据库。
查看
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="<?php echo base_url('assets/bootstrap/css/bootstrap.css'); ?>">
<link rel="stylesheet" type="text/css" href="<?php echo base_url('assets/pos_style.css') ?>">
<link rel="stylesheet" type="text/css" href="<?php echo base_url('assets/select2/select2.min.css') ?>">
<script type="text/javascript" src="<?php echo base_url('assets/jquery.js') ?>"></script>
<script type="text/javascript" src="<?php echo base_url('assets/js/jquery.min.js') ?>"></script>
<script type="text/javascript" src="<?php echo base_url('assets/jquery-ui/jquery-ui.js') ?>"></script>
<script type="text/javascript">
$( document ).ready(function() {
var list = {
};
list = [];
list2 = ['maine','shar'];
list3 = ['test', 'test'];
list[0] = list2;
list[1] = list3;
console.log(list);
$("body").on('load',function autocomplete() {
$("#item").autocomplete(function(){
source: <?php echo $names ?>
});
});
$("#item").on('change',function() {
var item_name = $(this).val();
var item_info = $("#right");
$.ajax ({
type : 'POST',
url : "<?php echo base_url(); ?>/get/item_info",
data : {"prod_id":item_name},
datatype : 'text',
success : function(result) {
item_info.html(result);
}
});
});
$("#add").on('click', function() {
var item_name = $("#item").val();
price = $("#price").text();
quant = $("#quantity").val();
total = $("#amount_due").text().substr(1);
if( $("#item").val() !== "") {
if (quant !== "" && !isNaN(quant) ) {
$.ajax({
type : 'POST',
url : "<?php echo base_url()?>/get/cart",
data : {"price" : price, "quantity" : quant,"item_name" : item_name, "total" : total},
datatype : 'text',
success : function(result){
$('#tbl_head').after(result);
$("#quantity").val(' ');
$("#item").val(' ');
}
});
}else {
alert('Quantity Is Required And Must Be Integer');
}
}else {
alert('No Item Selected');
}
});
$('#process').on('click',function () {
var table = document.getElementById('cart');
var x = document.getElementById('cart').rows.length;
var y = document.getElementById('cart').rows[0].cells.length;
var cart_items = [];
var total = 0;
if (x === 1) {
alert('Empty!');
}else {
list = [];
col_list = [];
for (row = 1; row < x; row++){
col_list = [];
total += parseInt(table.rows[row].cells[4].innerHTML.substr(1));
for (col = 0; col < y; col++){
col_list.push(table.rows[row].cells[col].innerHTML);
}
list[row-1] = col_list;
}
var obj = Object.assign({}, list);
cart_list = JSON.stringify(obj);
console.log(cart_list);
sessionStorage.setItem('cart',cart_list);
sessionStorage.setItem('total',total);
window.location = "<?php echo base_url() ?>/billing";
}
});
});
</script>
</head>
<body>
<a href="<?php echo base_url('home') ?>"><button style="float: right; margin-top: 6px; margin-right: 20px;" class="btn btn-primary btn-lg" >Home</button></a>
<div class="main">
<div style="padding: 0 0px;">
<div class="col-sm-6">
<h3 style="float: left;">Order</h3>
</div>
</div>
<div class="clearfix"></div>
<div class="cart">
<div id="cart-tbl">
<table class="table table-striped table-hover" id="cart">
<tr id="tbl_head">
<th>Product Code</th>
<th>Product Name</th>
<th>Quantity</th>
<th>Price</th>
<th>Sub Total</th>
</tr>
</table>
</div>
</div>
<div class="input">
<div class="col-sm-6" id="left" >
<form method="POST">
<div class="col-sm-10">
<div class="form-group">
<label>Product Description/Name: </label>
<select name="item_name" class="form-control" id="item">
<option value="Select Product" selected="selected">Select Product</option>
<?php foreach($item_name as $br):?>
<option value="<?php echo $br->prod_id?>"><?php echo $br->prod_desc?></option>
<?php endforeach;?>
</select>
</div>
<div class="col-sm-4">
<div class="form-group">
<label>Quantity</label>
<input id="quantity" type="number" name="quantity" placeholder="Quantity" class="form-control">
</div>
</div>
<div class="col-sm-4" style="padding-top: 0px;">
<input style="width: 100%; margin-bottom: 5px;" id="add" type="button" name="enter" class=" btn btn-info input-lg" value="ADD">
<input style="width: 100%;" id="process" type="button" name="process" class=" btn btn-success input-lg" value="PLACE ORDER">
</div>
</div>
</div>
<div class="col-sm-6" id="right">
<label id="name">Product Name:</label><br>
<label id="prc">Price:</label><br>
<label id="description">Description:</label><br>
</div>
<div class="col-sm-6">
<?php $total_amount = ""; ?>
<h3 id="total_amount">Total Amount Due <span id="amount_due"></span> </h3>
</div>
</form>
<script src="<?php echo base_url() ?>assets/select2/select2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#item').select2({
});
}); </script>
</div>
</body>
</html>
我的get.php控制器
public function item_info() {
$name = "";
$price = "";
$prod_code = "";
$itemName = $this->input->post('item_name');
$this->load->model('ajax_model');
$item_info = $this->ajax_model->item_info($itemName);
if ($item_info) {
$pid= $item_info->prod_id;
$name = $item_info->prod_desc;
$price = $item_info->original_price;
$prod_code = $item_info->prod_code;
?>
<div class="lb">
<label id="name">Product Name : <?php echo $name ?></label>
</div>
<div class="lb">
<label id="code">Prod Code: <?php echo $prod_code ?></label>
</div>
<div class="lb">
<label id="prc">Price : ₱<span id="price"><?php echo $price ?></span></label>
</div>
<?php
}else {
?>
<div class="lb">
<label id="name">No Item Found</label>
</div>
<?php
}
}
那是我的pos_view。 我的系统是关于销售点的。 这是用户搜索产品的地方 控制器
public function pos(){
$this->load->model('item_model');
$data['names'] = $this->item_model->get_all_item();
$data['item_name'] = $this->item_model->getProduct();
$this->load->view('pos_view',$data);
}
}
我的模特
public function item_info($itemName) {
$this->load->database();
$sql = $this->db->where('prod_id', urldecode($itemName))->get('products');
return $sql->row();
}
public function getProduct(){
$this->load->database();
$sql = $this->db->get('products');
return $sql->result();
}