如何使用api调用在代码点火器中进行Ajax搜索?

时间:2016-11-16 04:57:52

标签: ajax codeigniter

我正在尝试使用api调用创建一个代码点火器的ajax搜索。

场景是:

我有一个文本框,如果我输入一些东西,它会调用控制器中写的api函数。没有数据库调用。

查看

<input type="text" id="channel_name"  value="" name="channel_name" class="form-control valid">
<div id="channel_details">result will be here</div>

我用jquery自动完成js我写的js代码:

 var $ha = jQuery.noConflict();
 $ha(document).ready(function(){ 
    $ha('#channel_name').blur(function(){ 
        $ha.get('/search/fetch',{channel:$ha("#channel_name").val()},
        function(data){ 
            $ha('#channel_details').val(data); 
        }); 
    }); 
});

在控制器中:

public function fetch() { 
    $value1=$this->input->get('channel'); 
    $this->load->library('swsdk'); 
    $data = $this->swsdk->searchBroadcast($this->input->get('channel')); 
    echo json_encode($data->content); 
    return $value1; 
}

但它无法正常工作或者不适合拨打电话。

您能为此建议一个有效的代码吗?

1 个答案:

答案 0 :(得分:0)

尝试使用jQuery。完成ajax请求后,使用<?php /* lat/lng data will be added to this array */ $locations=array(); $query = $db->query('SELECT * FROM tbl_kabkot WHERE 1=1 AND latitude !=0 AND longitude !=0'); while( $row = $query->fetch() ){ $nama_kabkot = $row['nama_kabkot']; $longitude = $row['longitude']; $latitude = $row['latitude']; /* Each row is added as a new array */ $locations[]=array( 'name'=>$nama_kabkot, 'lat'=>$latitudem, 'lng'=>$longitude ); } /* Convert data to json */ $markers = json_encode( $locations ); ?> <script type='text/javascript'> <?php echo "var markers=$markers;\n"; ?> function initMap() { var latlng = new google.maps.LatLng(-33.92, 151.25); var myOptions = { zoom: 10, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP, mapTypeControl: false }; var map = new google.maps.Map(document.getElementById("peta"),myOptions); var infowindow = new google.maps.InfoWindow(), marker, lat, lng; var json=JSON.parse( markers ); for( var o in json ){ lat = json[ o ].lat; lng=json[ o ].lng; name=json[ o ].name; marker = new google.maps.Marker({ position: new google.maps.LatLng(lat,lng), name:name, map: map }); google.maps.event.addListener( marker, 'click', function(e){ infowindow.setContent( this.name ); infowindow.open( map, this ); }.bind( marker ) ); } } </script> 而非.html(data) .val(data)

$('#channel_details').html(data);

从您的控制器中删除<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script> var base_url = "<?php echo base_url(); ?>"; </script> <script> $(document).ready(function(){ $('#channel_name').blur(function(){ var channel = $(this).val(); $.ajax({ context: this, url: base_url+'/search/fetch', type: 'GET', data: {channel:channel}, dataType: 'json' }).done(function (data) { $('#channel_details').html(data); }).fail(function (data) { console.log('failed'); }); }); }); </script> 此行return $value1;此行,如下所示:

fetch()