自动完成两个字段什么都没有发生

我试图在2个文本框上实现自动完成文本框，当它们中的一个被选中时，值被放置在该文本框中。我想我应该能够用一个例子更容易地解释。自动完成两个字段什么都没有发生

我有2个文本框，他们有从同一个表/数据库中获取的自动完成。例如，我有一个列foo，它包含foo和foo2以及包含bar和bar2的列栏。所以这个文本框有任何列富有和其他有任何列栏。当我从textbox1中选择foo时，textbox2会有栏。当我从textbox2中选择bar2时，textbox1将具有foo2。

我希望是有道理的，我有以下的javascript

<script> 
$('#school_id').autocomplete({ 
source: function(request, response) { 
    $.ajax({ 
     url : 'ajaxi.php', 
     dataType: "json", 
     method: 'post', 
     data: { 
      name_startsWith: request.term, 
      type: 'school_table', 
      row_num : 1 
     }, 
     success: function(data) { 
      response($.map(data, function(item) { 
       var code = item.split("|"); 
       return { 
        label: code[0], 
        value: code[0], 
        data : item 
       } 
      })); 
     } 
    }); 
}, 
autoFocus: true,    
minLength: 0, 
select: function(event, ui) { 
    var names = ui.item.data.split("|");       
    $('#school_name').val(names[1]); 
}    
}); 
</script>

HTML

<body> 
<form id='students' method='post' name='students' action='test.php'> 
<input class="form-control" type='text' id='school_id' name='school_id'/> 
<input class="form-control" type='text' id='school_name' name='school_name'/> 
</form> 
</body>

脚本来源

<link rel="stylesheet" type="text/css" href="css/main.css" /> 
<link rel="stylesheet" type="text/css" href="css/jquery-ui.min.css" /> 
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script> 
<script type="text/javascript" src="js/jquery-ui.min.js"></script>

和ajaxi.php文件

if($_POST['type'] == 'school_table'){ 
$row_num = $_POST['row_num']; 
$name = $_POST['name_startsWith']; 
$query = "SELECT school_id, school_name FROM school where school_id LIKE '".$name."%'"; 
$result = mysqli_query($con, $query); 
$data = array(); 
while ($row = mysqli_fetch_assoc($result)) { 
    $name = $row['school_id'].'|'.$row['school_name'].'|'.$row_num; 
    array_push($data, $name); 
} 
echo json_encode($data);

当我尝试键入内容时，没有任何反应。感谢您的帮助。

我从here得到了这个。我试着了解每个人做了什么，但我仍然无法使其工作。

来源

2016-09-16 ThisIsABird

我只注意到school_id_1在javascript在文本框（school_id）中是不同的，所以我改变了这些。仍然不起作用，所以我恢复了他们。 – ThisIsABird

第1步：请检查所有必要的脚本加载HTML文件...

第2步：检查是否有任何JavaScript错误都存在，如果是，请清除这些JavaScript错误...

第3步：请您的HTML文件的底部添加此脚本...

<script> 
     $(document).ready(function(){ 
      $('#school_id').autocomplete({ 
       source: function(request, response) { 
        $.ajax({ 
         url : 'ajaxi.php', 
         dataType: "json", 
         method: 'post', 
         data: { 
          name_startsWith: request.term, 
          type: 'school_table', 
          row_num : 1 
         }, 
         success: function(data) { 
          response($.map(data, function(item) { 
           var code = item.split("|"); 
           return { 
            label: code[0], 
            value: code[0], 
            data : item 
           } 
          })); 
         } 
        }); 
       }, 
       autoFocus: true,    
       minLength: 0, 
       select: function(event, ui) { 
        var names = ui.item.data.split("|");       
        $('#school_name').val(names[1]); 
       }    
      }); 
     }); 

    </script>

第4步：接下来要检查你输入的东西它使AJAX调用ajaxi.php文件..

第5步：如果是检查你Ajax调用的响应...

我检查你的粘贴脚本样样精..

来源

2016-09-18 07:14:19 muni

自动完成两个字段什么都没有发生

回答

相关问题