динамически обновлять значения автозаполнения других на основе значений, выбранных на первом автозаполнении - PullRequest
Новая
       32

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

0 голосов
/ 01 октября 2019

Я пытаюсь обновить значение автозаполнения на основе значения, выбранного из первого автозаполнения из базы данных MySQL. Я хочу изменить приведенный ниже скрипт, чтобы получать данные из базы данных MySQL вместо массива доступных тегов ... Я могу автозаполнить первое текстовое поле .. Пожалуйста, помогите мне обновить второе текстовое поле, основываясь на значении, выбранном при первом автозаполнении ... как изменить этот скрипт для получения данных из mysql ... любая помощь будет оценена. Заранее спасибо .. 

$(document).ready(function () {
     var availableTags = [
"Java",
"JavaScript",
"PHP"
];
$( "#tags" ).autocomplete({
    source: availableTags,
    select: function( event, ui ) {
        $( "#version" ).val('');
        //alert(ui.item.value);
        var selected_val = ui.item.value;        
        if(selected_val == "Java")
        {
            $( "#version" ).autocomplete({
                source: ['Java 3.1' ,'Java 3.2']
        });
    } 
    else if(selected_val == "PHP")
    {
        $( "#version" ).autocomplete({
            source: ['PHP 5.3.1' ,'PHP 5.3.4']
        });
    } 
    else if(selected_val == "JavaScript")
    {
        $( "#version" ).autocomplete({
            source: ['JavaScript 1.0' ,'JavaScript 2.5']
        });
    } 
  }    
 });
 });

html 

<h4>Jquery-ui autocomplete. The "version" values will be updated based on 
the selection of the selection of "programming language"</h4>
<div class="ui-widget">
<label for="tags">Select programming language: </label>
<input id="tags"><small>Type like "j"</small>

<br>
<label for="tags">Select version: </label>
<input id="version">    
</div>

автозаполнение для первого текстового поля 

<script src="js/jquery-3.2.1.min.js"></script>
<script src="js/jquery-ui.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $("#tags").autocomplete({
        source: 'search.php',

        minLength: 1,
    });
});
</script>

если у меня есть такая база данных, как изменить код jquery? 

DROP TABLE IF EXISTS `languages`;
CREATE TABLE IF NOT EXISTS `languages` (
 `Prog_language` varchar(20) DEFAULT NULL,
 `version` varchar(20) DEFAULT NULL
) ENGINE=MyISAM DEFAULT CHARSET=latin1;

INSERT INTO `languages` (`Prog_language`, `version`) VALUES
('Java', 'Java 3.1'),
('Java', 'Java 3.2'),
('JavaScript', 'JavaScript 1.0'),
('JavaScript', 'JavaScript 2.5'),
('PHP', 'PHP 5.3.1'),
('PHP', 'PHP 5.3.4');

я попытался автозаполнить первое текстовое поле с помощью php, как это

search.php 

    <?php
require_once 'conn.php';

$search = $_GET['term'];

$list = array();

$search = $conn->real_escape_string($search);   

$query = $conn->query("SELECT DISTINCT Prog_language FROM `languages` 
    WHERE Prog_language LIKE '$search%'") or die(mysqli_connect_errno());

$rows = $query->num_rows;

if($rows > 0){
    while($fetch = $query->fetch_assoc()){

        $data['value'] = $fetch['Prog_language'];
        $data['label'] = $fetch['Prog_language'];  
        array_push($list, $data);
    }
}

echo json_encode($list);
   ?>

Пожалуйста, помогите мне обновить второе текстовое поле автозаполнения на основе выбора первого значения автозаполнения ..

...