Welcome Guest, Not a member yet? Register   Sign In
CI view and Ajax question
#1

[eluser]shiroin[/eluser]
So I have been trying to build part of my application with some ajax autocomplete code.

When I load my view file separately with the URI: http://localhost/ci/application/views/ac_view.php

The autosuggest works perfectly fine.

But when I load it as a view in CI: http://localhost:8888/ci/index.php/ac1/load/

The autosuggest doesn't work.

I tried to do some debugging, it seems that the javascripts are working, but somehow, when it is loaded as a view, the $.post() part doesn't work:
Code:
$.post("/ci/index.php/ac1/getNames/", {queryString: ""+inputString+""}, function(data)

Help? I included the complete codes.

My autocomplete controller: controllers/ac1.php
Code:
class ac1 extends Controller{

  function ac1(){
    parent::Controller();
  }
  
  function index(){
    
  }

  function load(){
    $this->load->view('ac_view');
  }
  
  function getNames(){
    $queryString = $this->input->post('queryString',TRUE);
    if(!$queryString)return;
    
    if(strlen($queryString)>0){
          $sql = "SELECT name FROM type WHERE type.name LIKE '$queryString%' LIMIT 10";
          $query = $this->db->query($sql);
          if(($query->num_rows())>0)
           foreach ($query->result() as $result)
            echo '<li oonClick="fill(\''.$result->name.'\');">'.$result->name.'</li>';
           //oonClick = onClick, edited to work on the forum
      else echo '&nbsp;';
      }
  }
}

My AJAX Code: views/ac_view.php
Code:
<scr1pt type="text/javascript" src="jquery-1.2.1.pack.js"></scr1pt>
<scr1pt type="text/javascript">
    function lookup(inputString) {
        if(inputString.length == 0) {
            // Hide the suggestion box.
            $('#suggestions').hide();
        } else {
            $.post("/ci/index.php/ac1/getNames/", {queryString: ""+inputString+""}, function(data){
                if(data.length >0) {
                    $('#suggestions').show();
                    $('#autoSuggestionsList').html(data);
                }
            });
        }
    } // lookup
    
    function fill(thisValue) {
        $('#inputString').val(thisValue);
        setTimeout("$('#suggestions').hide();", 200);
    }
</scr1pt>

My HTML Form in ac_view.php
Code:
<div>
                Type your county:
                <br />
                &lt;input type="text" size="30" value="" id="inputString"&gt;
            </div>
            
            <div class="suggestionsBox" id="suggestions" style="display: none;">
                <img src="upArrow.png" style="position: relative; top: -12px; left: 30px;" alt="upArrow" />
                <div class="suggestionList" id="autoSuggestionsList">
                    &nbsp;
                </div>
            </div>

Please help me!

And much thanks in advance! =)
#2

[eluser]elvix[/eluser]
from a brief look (without consulting any references), you might want to see if your $.post() statement is passing the inputString correctly. Usually, values need to be enclosed in quotes. If you put a single quote in each double quoted block surrounding inputString, that might help.

But a better suggestion is to use Firefox and the Firebug plugin for debugging. It's invaluable for debugging javascript errors and helping with ajax calls, etc.

Oh, and you should consider upgrading your JQuery too. Current version is 1.3.2, I believe. Smile




Theme © iAndrew 2016 - Forum software by © MyBB