Skip to main content
Home

autocomplete dengan jquery

October 15, 2011 by deded

deded's picture

Master2 sekalian mohon bantuannya lagi belajar bikin autocomplete pake jquery tapi gak bisa.... yang bingunngnya gak ada mincul pesan error tapi autocompletenya gak jalan .... ane jadi bingung berikut script ane :

untuk controller : detail_req.php fungsinya gini

function lookup(){
     // memproses hasil pengetikan keyword pada form
     $keyword = $this->input->post('term');
     $data['response'] = 'false'; //mengatur default response
     $query = $this->Detail_req_model->seek($keyword); //memanggil fungsi pencarian pada model
     if(! empty($query) ) {
          $data['response'] = 'true'; //mengatur response
          $data['message'] = array(); //membuat array
          foreach( $query as $row ){
           //mengisi array dengan record yang diperoleh   
           $data['message'][] = array('label' => $row->kode_barang, 'value' => $row->kode_barang); 
          }
     }
     //konstanta IS_AJAX
     if(IS_AJAX){
          echo json_encode($data); //mencetak json jika merupakan permintaan ajax
     }
    }

untuk model : detaik_req_model.php fungsinya gini

 function seek($keyword){
        $this->db->select('kode_barang')->from('detail_requisition');
        $this->db->like('kode_barang',$keyword,'after');
        $query = $this->db->get();
        return $query->result();
    }

sedangkan diview ane : detail_req_form.php gini

<?php
 
    echo ! empty($h2_title) ? '<h2>' . $h2_title . '</h2>' :'';
    $flash_message = $this->session->flashdata('message');
    echo ! empty($flash_message) ? '<p class = "message">' . $flash_message . '</p>':'';
?>
    <form name="detail_req_form" method="POST" action="<?php echo ! empty ($form_action) ? $form_action : ''; ?>">
 
    <p>
        <label for="kode_barang">Kode Barang : </label> 
        <input type="text" class="form_field" id="autocomplete" name="kode_barang" size="30" value="<?php echo set_value('kode_barang',
                isset($default['kode_barang']) ? $default['kode_barang'] : ''); ?>"/>
    </p>
        <?php echo form_error('kode_barang', '<p class="field_error">', '</p>')?>
<?php
    if( ! empty ($link))
    {
        echo '<p id="bottom_link">';
        foreach($link as $links)
        {
            echo $links . ' ';
        }
        echo '</p>';
    }
    ?>
    </form>
 
<!---------------------------------------------------------- -->
 
<script type="text/javascript">
  $(document).ready(function() {
    $("#autocomplete").autocomplete({
    source: 
        function(req, add){
          $.ajax({
            url: "<?php echo base_url('index.php/detail_req/lookup');?>",
            dataType: 'json',
            type: 'POST',
            data: req,
            success:
            function(data){
              if(data.response =='true'){
                add(data.message);
              }
            }
          });
        }
});
  });
</script>

untuk pemanggilan js nya ada di templatenya gan...
berikut template untuk view : template.php

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<link rel="shortcut icon" href="<?php echo base_url().'images/fav_icon.png';?>" />
 
		<style type="text/css">@import url("<?php echo base_url() . 'css/reset.css'; ?>");</style>
		<style type="text/css">@import url("<?php echo base_url() . 'css/style.css'; ?>");</style>
                <style type="text/css">@import url("<?php echo base_url() . 'css/jquery-ui-1.8.16.custom.css'; ?>");</style>
                <script type="text/javascript" src="<?php echo base_url().'js/jquery-1.6.4.min.js'?>"></script>
                <script type="text/javascript" src="<?php echo base_url().'js/jquery-ui-1.8.16.custom.min.js'?>"></script>
                <script type="text/javascript" src="<?php echo base_url().'js/jquery.ui.datepicker-id.js'?>"></script>
                <script type="text/javascript" src="<?php echo base_url().'js/jquery.ui.autocomplete.js'?>"></script>
 
        <title><?php echo isset ($title) ? $title : ''?></title>
    </head>
    <body id="<?php echo isset ($title) ? $title : ''?>">
        <div id="masthead">
                <?php $this->load->view('masthead'); ?>
        </div>
 
        <div id="navigation">
                <?php $this->load->view('navigation'); ?>
        </div>
 
        <div id="main">
                <?php $this->load->view($main_view); ?>
        </div>
 
        <div id="footer">
                <?php $this->load->view('footer'); ?>
        </div>
    </body>
</html>

mohon bantuannya dimana letak kesalahannya ya.... thanks...

Comments

Comment viewing options

Select your preferred way to display the comments and click "Save settings" to activate your changes.

sekedar catatan waktu ane

October 15, 2011 by deded, 2 days 13 hours ago
Comment: 9170

deded's picture

sekedar catatan waktu ane coba ikutin kayak di demonya jqueryui.com

sourcenya cuma dari lokal (gak dari database) bisa ...

contoh source : ["tes", "tes1", "tes2"]

autocomplete jalan...

Premium Drupal Themes by Adaptivethemes