Nano Hash - криптовалюты, майнинг, программирование

Как отобразить список в текстовом поле после успешного ответа от ajax

Я использую CodeIgniter. Я создаю живое автозаполнение textbox, используя ajax, который работает. Я проверил на вкладке сети и добавил предупреждение в успех ajax. Я получаю правильный результат.

Теперь, как мне отобразить список в текстовом поле, когда пользователь вводит текст? я должен использовать Json и как?

Я должен отображать список имен, когда пользователь вводит любую букву в текстовое поле.

Не могли бы вы помочь мне в этом?

Мое представление

<input type="text" name="cust_name" placeholder="Enter the name" class="form-control" id="title">

Аякс

$(document).ready(function(){
            $('#title').autocomplete({
                source: baseUrl + "/Search/get_search_record",
                select: function (event, ui) {
                    $('#title').val(ui.item.label); 
                }
            });

        });

Контроллер

public function get_search_record(){
    if (isset($_GET['term'])) {
         $result=$this->Search_model->search_cust_name($_GET['term']);
        if (count($result) > 0) {
        foreach ($result as $row)
            $arr_result[] = array(
                'first_name' => $row->first_name,
                'last_name' => $row->last_name,
            );
            echo json_encode($arr_result);
        }
    }


}

Модель

public function search_cust_name($emp_name){
         $this->db->like('first_name', $emp_name , 'both');
        return $this->db->get('members')->result();

}

Когда я ввожу любой текст, я получаю что-то вроде этого. введите здесь описание изображения

Я получаю вывод на вкладке сети

[{"first_name":"Naren","last_name":"Verma"}]

  • Либо закодируйте и верните результаты в виде json и создайте html в javascript, либо создайте нужный html в php и верните его. 20.06.2018
  • см. это: jqueryui.com/autocomplete 20.06.2018
  • Где вы хотите, чтобы ваши данные отображались? Вы хотите, чтобы он отображался в таблице, текстовом поле или поле ввода? 20.06.2018
  • У меня есть поле ввода, и я должен отображать внутри него. что-то вроде гугла. 20.06.2018
  • @pradeep, я проверил jqueryui, но как мне отобразить в нем базу данных формы данных? 20.06.2018
  • просто верните все имя в массив из вашей модели и добавьте его с помощью метода автозаполнения, см. вкладку view_source ссылки 20.06.2018
  • @pradeep, можешь поделиться примером? пожалуйста 20.06.2018
  • этот alert(data); что-нибудь выводит? 20.06.2018
  • @hungrykoala, я попробовал оповещение (данные) только для тестирования. и я получаю правильный вывод в предупреждении. 20.06.2018
  • Не могли бы вы изменить это на console.log(data); и показать вывод в своем вопросе, чтобы все здесь лучше видели ваши данные. 20.06.2018
  • @hungrykoala, я добавил изображение в вопрос в конце, и вывод моей консоли — Array ([0] => stdClass Object ([id] => 9 [firstname] => nilesh [lastname] => Verma) [1] = › Объект stdClass ( [id] => 10 [имя] => nilesh [фамилия] => verma )) 20.06.2018
  • Я ввожу имя в текстовое поле nilesh и получаю вывод 20.06.2018
  • Каков ваш желаемый результат для этого? вы можете нарисовать его, если хотите. Как вы хотите, чтобы данные были представлены в вашем текстовом поле? 20.06.2018
  • @hungrykoala, что я делаю, так это то, что когда пользователь вводит любой текст в текстовое поле, он отображает список автозаполнения. Например, гугл. Если вы введете что-нибудь в текстовое поле, которое отобразит список. что-то вроде prntscr.com/jx1irc 20.06.2018
  • Я добавил codei, и он отображает список автозаполнения. 20.06.2018
  • То, что вы ищете, это автозаполнение, и ваш текущий код не будет работать для него, поскольку это напрямую изменит значение вашего флажка. Вместо этого вы можете попробовать использовать плагины. это и это 20.06.2018
  • @hungrykoala, Да, второй плагин не могу скачать, а первый я не знаю, как им пользоваться. Я проверяю источник представления, но как отобразить значение массива в var availableTags = [] 20.06.2018
  • @pradeep, проверьте, я пытался использовать jqueryUi, но не работает. Вы можете это проверить? 20.06.2018
  • @pradeep, почему ты удалил свой ответ? мне помогло 20.06.2018

Ответы:


1

Надеюсь, это поможет вам:

Убедитесь, что вы загрузили необходимые js и css в свой файл следующим образом:

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

Ваш отчет data должен быть array в такой форме

['tarun verma','test sur','first last']

См. рабочую демонстрацию: https://jsfiddle.net/xpvt214o/269229/

в контроллере get_search_record должно быть так:

public function get_search_record()
{
    if (isset($_GET['term'])) 
    {
        $result=$this->Search_model->search_cust_name($_GET['term']);
        if (count($result) > 0) 
        {
            foreach ($result as $row) 
            {
               $arr_result[] = $row->first_name .' '. $row->last_name;
            }
            print_r($arr_result);
            exit;
         }

      }
}

JS должен быть таким:

$(document).ready(function(){
     $('#title').autocomplete({
        source: baseUrl + "/Search/get_search_record",
    });

});
20.06.2018
  • я разместил свой ответ, и он отлично работает на моей стороне; см. этот пример jsfiddle.net/xpvt214o/269229 20.06.2018
  • Я проверяю обе ссылки, которыми вы поделились. Я получаю выходную ссылку на вкладке сети «Массив» ([0] => Amr khan2 [1] => narendra sharma) 20.06.2018
  • Но все еще не может отображаться в текстовом поле. 20.06.2018
  • что-то не так с вашей стороной, для меня это работает хорошо, учитывая рабочий пример, это довольно просто, не понимаю, почему это не работает для вас 20.06.2018
  • Да, в этот раз работает. Я добавил последнюю версию jquery UI js и удалил запятую (,) в источнике: baseUrl + /Search/get_search_record и работает. Спасибо за помощь 20.06.2018
  • Также я нашел хорошую ссылку на блог mfikri.com/en/blog/codeigniter-autocomplete. что мне очень помогает. 20.06.2018
  • @pradeen, вы нашли ответ на этот вопрос? stackoverflow.com/questions/50935487/ 20.06.2018
  • рад слышать, что это работает для вас, пожалуйста, примите это как ответ, если это поможет вам, 20.06.2018
  • Привет @pradeep, Не могли бы вы помочь мне в этом вопросе stackoverflow.com/questions/51574228/ 29.07.2018

  • 2

    HTML

    <input list="employee_name">
    
    <datalist id="employee_name"> </datalist>
    

    AJAX

    $(document).ready(function() {
        $("#employee_name").keyup(function() {
           var emp_name = $('#employee_name').val();
           if (emp_name != '') {
               $.ajax({
                  type: "POST",
                  url:baseUrl + "/Employee_control/search_with_emp_name",
                  data: {
                     emp_name: emp_name
                  },
    
                  success: function(data) {
                     alert(data);
    
                     $('#employee_name').html('');
                      for(i=1; i<=data.length; i++)
                      {
                          $('#employee_name').append('<option value="+data[i]+">');
                      }
    
                   }
               });
            }
        });
    });
    
    20.06.2018

    3
    <textarea name="my_textarea" id="my_id" cols="30" rows="10"></textarea>
    
               success: function(data) {
               var string_of_array = data.join("\n");
                $('#my_id').val(string_of_array);
               }
    

    Если это ваш случай

    20.06.2018
  • попробуйте проанализировать ваши данные в массиве в следующем формате: [элемент, другой элемент] 20.06.2018
  • Новые материалы

    Кластеризация: более глубокий взгляд
    Кластеризация — это метод обучения без учителя, в котором мы пытаемся найти группы в наборе данных на основе некоторых известных или неизвестных свойств, которые могут существовать. Независимо от..

    Как написать эффективное резюме
    Предложения по дизайну и макету, чтобы представить себя профессионально Вам не позвонили на собеседование после того, как вы несколько раз подали заявку на работу своей мечты? У вас может..

    Частный метод Python: улучшение инкапсуляции и безопасности
    Введение Python — универсальный и мощный язык программирования, известный своей простотой и удобством использования. Одной из ключевых особенностей, отличающих Python от других языков, является..

    Как я автоматизирую тестирование с помощью Jest
    Шутка для победы, когда дело касается автоматизации тестирования Одной очень важной частью разработки программного обеспечения является автоматизация тестирования, поскольку она создает..

    Работа с векторными символическими архитектурами, часть 4 (искусственный интеллект)
    Hyperseed: неконтролируемое обучение с векторными символическими архитектурами (arXiv) Автор: Евгений Осипов , Сачин Кахавала , Диланта Хапутантри , Тимал Кемпития , Дасвин Де Сильва ,..

    Понимание расстояния Вассерштейна: мощная метрика в машинном обучении
    В обширной области машинного обучения часто возникает необходимость сравнивать и измерять различия между распределениями вероятностей. Традиционные метрики расстояния, такие как евклидово..

    Обеспечение масштабируемости LLM: облачный анализ с помощью AWS Fargate и Copilot
    В динамичной области искусственного интеллекта все большее распространение получают модели больших языков (LLM). Они жизненно важны для различных приложений, таких как интеллектуальные..