javascript - Autocomplete Codeigniter with modal bootstrap not work -
i don't know why , how solve problem. i'm using codeigniter, , want create autocomplete form on modal bootstrap.
first, let me show model.
function getbarangajax($keyword){ $this->db->order_by('barang_id', 'desc'); $this->db->like('barang_kode', $keyword); return $this->db->get('barang')->result_array(); } this controller.
public function getkodebarangajax(){ $keyword = $this->input->post('keyword'); $data = $this->model_app->getbarangajax($keyword); echo json_encode($data); } this view of modal.
<div class="modal fade" id="modaladdtransaction" tabindex="-1" role="dialog" aria-labelledby="mymodallabel" aria-hidden="true"> <div class="modal-dialog modal-lg"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="close"><span aria-hidden="true">×</span></button> <h4 class="modal-title" id="mymodallabel">transaksi baru</h4> </div> <form class="form-horizontal" id="formaddtransaksi" method="post" action="<?php echo site_url('cadminpage/') ?>"> <div class="modal-body"> <div class="form-group"> <label class="col-lg-2 control-label">pilih transaksi</label> <div class="col-lg-3"> <select class="form-control" name="transaksitype" id="transaksitype" aria-describedby="basic-addon1"> <option value=""></option> <option value="regular">regular</option> <option value="reseller">reseller</option> <option value="dropshipper">dropshipper</option> </select> </div> </div> <div class="form-group"> <label class="col-lg-2 control-label">invoice</label> <div class="col-lg-3"> <input type="text" class="form-control" name="transaksiinvoice" id="transaksiinvoice" aria-describedby="basic-addon1" /> </div> </div> <div class="form-group"> <label class="col-lg-2 control-label">tanggal</label> <div class="col-lg-3"> <input type="text" class="form-control" name="transaksitanggal" id="transaksitanggal" aria-describedby="basic-addon1" /> </div> </div> <div class="form-group"> <label class="col-lg-2 control-label">pelanggan</label> <div class="col-lg-3"> <input type="text" class="form-control" name="transaksipelanggan" id="transaksipelanggan" aria-describedby="basic-addon1" /> </div> </div> <div class="form-group"> <label class="col-lg-2 control-label">kode barang</label> <div class="col-lg-3"> <input type="text" class="form-control" autocomplete="off" name="transaksikodebarang" id="transaksikodebarang" aria-describedby="basic-addon1" /> <ul class="dropdown-menu txtbarang" style="margin-left:15px;margin-right:0px" role="menu" aria-labelledby="dropdownmenu" id="dropdownbarang"> </ul> </div> </div> <div class="form-group"> <label class="col-lg-2 control-label">quantity</label> <div class="col-lg-3"> <input type="text" class="form-control" name="transaksiqty" id="transaksiqty" aria-describedby="basic-addon1" /> </div> </div> <div class="form-group"> <label class="col-lg-2 control-label">harga /pcs</label> <div class="col-lg-3"> <input type="text" class="form-control" name="transaksiharga" id="transaksiharga" aria-describedby="basic-addon1" /> </div> </div> <div class="form-group"> <label class="col-lg-2 control-label">total pembayaran</label> <div class="col-lg-3"> <input type="text" class="form-control" name="transaksitotalharga" id="transaksitotalharga" aria-describedby="basic-addon1" /> </div> </div> <div class="form-group"> <label class="col-lg-2 control-label">created by</label> <div class="col-lg-3"> <input type="text" class="form-control" value="<?php echo ($this->session->userdata('nama')) ?>" name="transaksicreatedby" id="transaksicreatedby" aria-describedby="basic-addon1" readonly /> </div> </div> <div class="form-group"> <label class="col-lg-2 control-label">created at</label> <div class="col-lg-3"> <input type="text" class="form-control" value="<?php echo date('y-m-d h:i:s') ?>" name="transaksicreatedat" id="transaksicreatedat" aria-describedby="basic-addon1" readonly /> </div> </div> </div> <div class="modal-footer"> <button type="submit" id="simpan" class="btn btn-sm btn-primary">save</button> <button type="button" id="reset" class="btn btn-sm btn-primary">reset</button> <button type="button" class="btn btn-sm btn-primary" data-dismiss="modal">close</button> </div> </form> </div> </div> , js.
$(document).ready(function() { $(".addtransaksi").click(function(){ $('#modaladdtransaction').modal('show'); $("#transaksikodebarang").keyup(function(){ $.ajax({ type: "post", url: '<?php echo site_url('cadminpage/getkodebarangajax'); ?>', data: { keyword: $("#transaksikodebarang").val() }, datatype: "json"; success: function (data){ if (data.length > 0){ $('#dropdownbarang').empty(); $('#transaksikodebarang').attr("data-toggle", "dropdown"); $('#dropdownbarang').dropdown('toggle'); }else if (data.length == 0){ $('#transaksikodebarang').attr("data-toggle", ""); } $.each(data, function (key,value){ if (data.length >= 0) $('#dropdownbarang').append('<li role="presentation" ><a role="menuitem dropdownnameli" class="dropdownlivalue">' + value['barang_kode'] + '</a></li>'); }); } }); }); $('ul.txtbarang').on('click', 'li a', function () { $('#transaksikodebarang').val($(this).text()); }); }); });
modal not showing up.the keyword autocomplete transaksikodebarang
please advice, did go wrong?
thanks.
make sure class="form-control" making select box hidden.
Comments
Post a Comment