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"); ?>