2012-06-27 5 views
2

Здесь я пытаюсь реализовать JQuery У меня есть два основных файлов один db.php которые держат эту вещь:Мой автозаполнение jQuery UI не работает?

<?php 

$connection = mysql_connect("localhost","root",""); 
$db = mysql_select_db("auto",$connection); 

$sql = "SELECT * FROM data"; 

$result = mysql_query($sql,$connection); 
//$arr = array(); 
while($row = mysql_fetch_array($result)){ 

echo $row['name']."\n"; 
} 
//echo json_encode($arr); 

mysql_close($connection); 
?> 

Тогда я еще один файл с именем, как index.html, в котором я звоню функции JQuery:

<html> 
<head> 
<link rel="stylesheet" type="text/css" href="css/ui-lightness/jquery-ui-1.8.custom.css"> 
<link rel="stylesheet" type="text/css" href="css/autocomplete.css"> 
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script> 
<script type="text/javascript" src="js/jquery-ui-1.8.custom.min.js"></script> 
<script> 

$(document).ready(function(){ 
    $("#example").autocomplete("db.php"); 
    }); 

</script> 
</head> 

<body> 

Auto:<input id="example" type="text"> 

</body> 
</html> 

, но я не могу запустить какой-либо код, можете ли вы сказать мне, почему? Я новичок в jQuery, так извиняюсь за ошибки.

P.S: Я пытался использовать функцию json encode, потому что я искал и выяснял, что это может быть причиной данных Json (которые я назначал $arr, а затем повторил jsonencode), но все еще не работает.

ответ

0

Ok Вот что я придумал решение, которое я отправляю в ответ, так что, если у любого другого человека есть проблемы с этим, он может понять базовый, не бегая и беспомощный, как я, вы можете принять это как короткий простой учебник по использованию JQuery UI A utocomplete:

сначала сделать имя базы данных авто в вашем сервере MySQL и положить этот дамп запрос в SQL или создать файл с именем auto.sql и поставить все следующее содержимое в этом файле и импортировать его из PHPMyAdmin идя внутри, что базы данных вы только что создали т.е. «авто»:

-- phpMyAdmin SQL Dump 
-- version 3.5.1 
-- http://www.phpmyadmin.net 
-- 
-- Host: localhost 
-- Generation Time: Jun 27, 2012 at 06:35 PM 
-- Server version: 5.5.24-log 
-- PHP Version: 5.3.13 

SET SQL_MODE="NO_AUTO_VALUE_ON_ZERO"; 
SET time_zone = "+00:00"; 


/*!40101 SET @[email protected]@CHARACTER_SET_CLIENT */; 
/*!40101 SET @[email protected]@CHARACTER_SET_RESULTS */; 
/*!40101 SET @[email protected]@COLLATION_CONNECTION */; 
/*!40101 SET NAMES utf8 */; 

-- 
-- Database: `auto` 
-- 

-- -------------------------------------------------------- 

-- 
-- Table structure for table `data` 
-- 

CREATE TABLE IF NOT EXISTS `data` (
    `name` varchar(30) NOT NULL 
) ENGINE=InnoDB DEFAULT CHARSET=latin1; 

-- 
-- Dumping data for table `data` 
-- 

INSERT INTO `data` (`name`) VALUES 
('fahim'), 
('asim'), 
('yasir'), 
('jalil'), 
('birdy'), 
('gudu'), 
('zalim'), 
('papu'), 
('ozair'), 
('saima'); 

/*!40101 SET [email protected]_CHARACTER_SET_CLIENT */; 
/*!40101 SET [email protected]_CHARACTER_SET_RESULTS */; 
/*!40101 SET [email protected]_COLLATION_CONNECTION */; 

Теперь сделайте папку в вашем XAMPP или WAMP или любой веб-сервер вы используете в качестве авто и сделать следующие файлы и поместить их содержание в соответствующем порядке:

Первый Файл db.php:

<?php 

    $connection = mysql_connect("localhost","root",""); 
//make sure you change the hostname, username and password according to your setting 
    $db = mysql_select_db("auto",$connection); 

    $sql = "SELECT * FROM data"; 

    $result = mysql_query($sql,$connection); 
    $arr = array(); 
    while($row = mysql_fetch_array($result)){ 

    $arr[] = $row['name']."\n"; 
    } 
    echo json_encode($arr); 

    mysql_close($connection); 


    ?> 

Сделайте еще один файл с именем index.php и поставить следующие содержание:

<html> 
<head> 
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/black-tie/jquery-ui.css" type="text/css" /> 
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'></script> 
<script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/jquery-ui.min.js'></script> 
<script> 

$(document).ready(function() { 
     $("#AC").autocomplete({ 
      source: "db.php" 
     }); 
    }); 

</script> 
</head> 

<body> 

<form> 
    Text Box: <input id="AC" type="text" /> 
    </form> 
</body> 
</html> 

Другое дело Обратите внимание, я использую Интернет Google API для извлечения библиотек сценариев и файлов CSS поэтому перед тестированием этого кода вы подключитесь к Интернету.

Попробуйте запустить код, который будет работать как шарм:) .... Это довольно просто для новичков, а именно поэтому я не объяснил это ... просто простой термин, я получаю данные от базы данных и сделать все эти данные эхом в формате jason, поскольку Jquery UI Auto полностью заполняет данные Jason!

Надеется, что это помогает :)


Другого делу, я заметил, что в поджигатель, что всякий раз, когда я что-то типа Это автозаполнение посылает запрос Ajax на страницу Db, откуда я получаю результат и в этой просьбе она отправляет член имени переменной, поэтому, если я получаю эту переменную в файле db.php, я также могу использовать его в своем SQL для извлечения конкретных String, потому что в приведенном выше методе будут показаны все записи, извлеченные из базы данных, поэтому, если я хочу чтобы получить только определенные термины, например, например, я положил слово "fa" в текстовом поле в файле index.html я хочу это получить только те имени из базы данных, которые держат строку «фа» для этого я могу использовать это $_GET['term'] переменных и поместить ее в SQL заявление там я могу использовать SQL LIKE оператора, чтобы найти определенный шаблон я обновлю db.php файла, как показано ниже:

<?php 

    $connection = mysql_connect("localhost","root",""); 
//make sure you change the hostname, username and password according to your setting 
    $db = mysql_select_db("auto",$connection); 

    $sql = "SELECT * FROM data WHERE name LIKE '%".$_GET['term']."%'"; 

    $result = mysql_query($sql,$connection); 

    //print_r ($result); 

    $arr = array(); 
    while($row = mysql_fetch_array($result)){ 

    $arr[] = $row['name']."\n"; 
    } 
    echo json_encode($arr); 

    mysql_close($connection); 


    ?> 

Теперь то, что я делаю, я говорю, чтобы SQL Получите мне имена, у которых есть строка струны, которую извлекает $_GET['term']:) .... !! Т * его просто правильно * ??

Если вы хотите узнать больше о LIKE оператора Проверить эту ссылку http://www.w3schools.com/sql/sql_like.asp

1

Я могу предложить вам

  1. установить extensio Firebug и используйте Mozilla браузер, чтобы помочь вам отладки такого рода проблемы.
  2. Убедитесь, что нет синтаксической ошибки javascript или jquery, отлаживая в Firebug.
  3. Убедитесь, что ваше приложение отправило запрос на db.php, вы можете посмотреть его в консоли firebug.

Я заметил, что ваш синтаксис jQuery ошибочен. См. Здесь для справки: http://jqueryui.com/demos/autocomplete/#remote

Обратите внимание, что ни одна из них не указала строку напрямую, всегда включала исходный атрибут.

Возможно, вы забыли указать атрибут «источник».

Удачи.

+1

Благодаря родственному Bunch на самом деле у меня есть поджигатель он показывал мне ошибку Jquery библиотеки, но я обнаружил, что я не включил интерфейс Jquery Css-файл, а также причина, по которой у меня возникли проблемы. – Seeker

2

JQuery-UI автозаполнения можно исследовать на сторону сервера сценарий для данных автозаполняемых но сценарий должен возвращать эти данные в формате JSON в любом из этих двух вариантов:

Массив строк:

[ "Choice1", "Choice2" ]

массив объектов с этикеткой и [или] свойства значения:

[ { label: "Choice1", value: "value1" }, ... ]

Так что вам нужно пересмотреть свой PHP код немного - json_encode было правильным, что нужно сделать:

$arr = array(); 
while($row = mysql_fetch_array($result)){ 
    $arr[] = $row["name"]; 
} 
echo json_encode($arr); 

Немного исправить нужно в вашем JavaScript тоже:

$("#example").autocomplete({ 
     source: "db.php" 
    }); 
+1

Спасибо, что я собрал Bunch, я обнаружил, что я не включил JQuery Css-файл, и это было причиной того, что у меня были проблемы. – Seeker