使用 Ajax 的 Jquery UI 自动完成以答案

【问题标题】：Jquery UI autocomplete with Ajax starts with使用 Ajax 的 Jquery UI 自动完成以
【发布时间】：2016-11-16 12:07:27
【问题描述】：

我在使用 Ajax 的 Jquery UI 的自动完成插件时遇到问题。

它在本地工作，但它并不总是在服务器中工作，因为每当我只使用一个字符或根本不使用字符时，控制台都会给我“未捕获的类型错误：无法读取属性‘split’ of null”。它只适用于 2 个字符……真的很奇怪

这些是我的文件

ajax.php:

 <?php
require_once 'config.php';
if(!empty($_POST['type'])){
    $type = $_POST['type'];
    $name = $_POST['name_startsWith'];
    $query = "SELECT id_pro, name, IFNULL(SUM(qty),0) as qty FROM inventory where ".$type." LIKE '%".$name."%' group by id_pro";
    $result = mysqli_query($con, $query);
    $data = array();
    while ($row = mysqli_fetch_assoc($result)) {
        $name = $row['id_pro'].'|'.$row['name'].'|'.$row['qty'];
        array_push($data, $name);
    }

    echo json_encode($data);exit; }?>

auto.js

$(document).on('focus','.autocomplete_txt',function(){
type = $(this).data('type');

if(type =='id_pro')autoTypeNo=0;
if(type =='name')autoTypeNo=1;


$(this).autocomplete({
    source: function( request, response ) {
        $.ajax({
            url : 'ajax.php',
            dataType: "json",
            method: 'post',
            data: {
               name_startsWith: request.term,
               type: type
            },
             success: function( data ) {
                 response( $.map( data, function( item ) {
                    var code = item.split("|");
                    return {
                        label: code[autoTypeNo],
                        value: code[autoTypeNo],
                        data : item
                    };
                }));
            }
        });
    },
    autoFocus: true,            
    minLength: 0,
    select: function( event, ui ) {
        var names = ui.item.data.split("|");                        
        id_arr = $(this).attr('id');
        id = id_arr.split("_");
        $('#itemNo_'+id[1]).val(names[0]);
        $('#itemName_'+id[1]).val(names[1]);
        $('#stock_'+id[1]).val(names[2]);
        $('#quantity_'+id[1]).val(1);

        }               
});  });

despacho.php

   <td><input class="case" type="checkbox"/></td>
    <td><input type="text" data-type="id_pro" name="itemNo[]" id="itemNo_1" class="form-control autocomplete_txt changesNo" autocomplete="off" required></td>
    <td><input type="text" data-type="name" name="itemName[]" id="itemName_1" class="form-control autocomplete_txt changesNo" autocomplete="off" required></td>
    <td><input type="number" name="stock[]" id="stock_1" class="form-control changesNo" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;" readonly></td>
    <td><input type="number" min="1" name="quantity[]" id="quantity_1" class="form-control changesNo" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;" required></td>

【问题讨论】：

标签： php ajax jquery-ui autocomplete

【解决方案1】：

在互联网上搜索了一番之后，我意识到了问题所在。我得到所有带有重音符号的字段的空值。解决方法很简单

ajax.php:

<?php
require_once 'config.php';
if(!empty($_POST['type'])){
    $type = $_POST['type'];
    $name = $_POST['name_startsWith'];
    $query = "SET NAMES utf8";
    $result = mysqli_query($con, $query);
    $query = "SELECT id_pro, name, IFNULL(SUM(qty),0) as qty FROM inventory where ".$type." LIKE '%".$name."%' group by id_pro";

    $result = mysqli_query($con, $query);
    $data = array();
    while ($row = mysqli_fetch_assoc($result)) {
        $name = $row['id_pro'].'|'.$row['name'].'|'.$row['qty'];
        array_push($data, $name);
    }

    echo json_encode($data);exit;
}
?>

【讨论】：