Skip to content
Advertisement

Autocomplete working on localhost, but not on server

I have a search formula with an autocomplete function which works just fine on localhost, but as soon as I put it on a remote server it stops working.

I hope you can help me. Here is some Code:

index.php:

<!DOCTYPE html>
<html lang="de">
 <head>
    <?
    header("Content-Type: text/html; charset=iso-8859-1"); 
    
    ?>

    <link rel="stylesheet" href="css/jquery-ui-1.10.3.custom.min.css" />
    <link rel="stylesheet" href="css/bootstrap.min.css" />
    
    <link rel="stylesheet" href="css/style.css" />
    

    <script src="js/jquery-1.10.2.min.js"></script> 
    <script src="js/jquery-ui-1.10.3.custom.min.js"></script>
    <script src="js/bootstrap.min.js"></script> 
</head>
<body>  

    <div id="wrap">
        <h1 class="text-center">Suche</h1>
        <div class="row">
            <div class="col-xs-6 col-sm-4 col-md-4 col-xs-offset-6 col-sm-offset-4 col-md-offset-4">
                <form method='POST' action=''>
                <input type='text' name='food' id="country_name" class="form-control txt-auto"/>
                <input type='submit' value='search'>
                </form>

            </div>

        </div>
        
    </div>
    

    
    <script src="js/auto.js"></script>
</body>
</html>

ajax.php

<?php


header('Content-Type: text/html; charset=UTF-8');

require_once 'config.php';

if($_GET['type'] == 'country'){
    $result = mysql_query("SELECT *
        FROM table
        WHERE name LIKE '%".strtoupper($_GET['name_startsWith'])."%'
        LIMIT 8");  
    $data = array();
    while ($row = mysql_fetch_array($result)) {
        array_push($data, $row['name']);    
    }   
    echo json_encode($data);
}

?>

auto.js

   $('#country_name').autocomplete({
                    source: function( request, response ) {
                        $.ajax({
                            url : 'ajax.php',
                            dataType: "json",
                            data: {
                               name_startsWith: request.term,
                               type: 'country'
                            },
                             success: function( data ) {
                                 response( $.map( data, function( item ) {
                                    return {
                                        label: item,
                                        value: item
                                    }
                                }));
                            }
                        });
                    },
                    autoFocus: true,
                    minLength: 0        
                  });
              
        

Advertisement

Answer

You are missing the php in the HTML and if your server isn’t set up for short open tags- may cause an issue, and as shown in the comments – there should not be any html content before the header declaration.

should be:

   <?php
    header("Content-Type: text/html; charset=iso-8859-1"); 
    ?>
User contributions licensed under: CC BY-SA
8 People found this is helpful
Advertisement