нуб вопрос об автозаполнении JQuery плагин - PullRequest
Новая
       2

нуб вопрос об автозаполнении JQuery плагин

0 голосов
/ 11 марта 2011

Я хочу сделать автозаполнение для моего текстового поля, используя этот плагин AutoSuggest jQuery Plugin

У меня есть массив, уже json_encoded, и файлы на сервере, js, css, но я пока не понимаю, как работает пример, вот мой код, 

<html>
 <head>
  <title>test-data</title>
   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <link href="inc/css/admin_style.css" rel="stylesheet" type="text/css">
     <link href="inc/css/autoSuggest.css" rel="stylesheet" type="text/css">
     <script language="javascript" src="inc/js/functions.js"></script>
     <script language="javascript" src="inc/js/jquery-1.5.1.js"></script>
     <script language="javascript" src="inc/js/jquery.autoSuggest.js"></script>
     <script language="javascript" type="text/javascript">
      </script>
 </head>

 <body>
 <center><br><font class="title">test</font></center>

  <form action="dataAll.php" method="post">
   Name: <input type="text" name="fname" />
  <input type="submit" />
   </form>

   <p>&nbsp;</p>
  <p>JSON</p>
  <p>&nbsp;</p>
  <?php
  $encoded =  json_encode ($familyNames);
  echo $encoded;
   ?>
  </body>
  </html>

, поэтому я должен поставить этот код, 

 $(function(){
 $("input[type=text]").autoSuggest(data);
 });
  • но вопрос где?? (как будто я помещаю его в теги php, он выдает ошибку
  • , куда я должен поместить имя моего отформатированного массива json? "$ encoded", чтобы функция распознала, что это источник данных?

спасибо большое!

Ответы [ 2 ]

0 голосов
/ 11 марта 2011

У вас есть все части, но ваш заказ / методология немного не в порядке.Попробуйте создать второй файл с именем типа ajax.php и поместите туда весь свой php-код.Чтобы убедиться, что вы выводите хороший JSON, добавьте строку header('Content-Type: text/json; charset=ISO-8859-1'); в самом начале файла ajax.php (вы должны установить заголовок перед отправкой любого вывода, иначе вы получите ошибку).Теперь вам нужно запросить данные предложения: 

$(document).ready(function() {   // Runs when your page is loaded in the user's browser
    $.getJSON('ajax.php', function(data) { // Runs ajax.php, then executes an anonymous function to handle the response
        $('input[name="fname"]').autoSuggest(data); // Set your input field to use automatic suggestions with the returned data
    }); // end getJSON
}); // end ready

Этот код просто выполняет асинхронный HTTP-запрос для ajax.php и передает возвращенные данные JSON плагину jQuery с автоматическим предложением.Поместите его внутрь тега <script type="text/javascript"></script>.Он будет запускаться один раз при загрузке страницы из-за использования $(document).ready(...).Я добавил небольшую оптимизацию (input[name="fname"]), чтобы jQuery не пытался присоединить функцию автоматического предложения к каждому вводу текста на вашей странице.Если это то, что вы хотели сделать (маловероятно), просто измените его обратно на input[type=text].

Вам действительно не нужен отдельный php-файл, чтобы это заработало.Ничто не мешает вам делать все это в одном файле, но вы скоро поймете, насколько беспорядочным и неуправляемым это может быть.Для меня проще всего представить мой php-код "ajaxy" как отдельный модульный элемент моего веб-приложения.

Обязательно обратитесь к этим страницам для получения подробной информации:

0 голосов
/ 11 марта 2011

Вы помещаете это в тег в HTML. 

<script type="text/javascript">
 $(function(){
 $("input[type=text]").autoSuggest(data);
 });
</script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...