2014-12-05 4 views
2

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

У меня есть страница с 2 выпадающим списком. второй список зависит от значения, выбранного из первого списка.

index.php страница

<head> 
<script language="JavaScript" src="functionsjq.js"></script> 
<script language="JavaScript" src='http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'></script> 
<script> 
jQuery().ready(function($){ 
$('#loading') 
    .hide() // hide it initially 
    .ajaxStart(function() { 
     $(this).show(); 
    }) 
    .ajaxStop(function() { 
     $(this).hide(); 
    }) 
; 
jQuery.ajax({ 
      url: 'man_list.php', 
      global: false,// 
      type: "POST", 
      dataType: "xml", 
      async: false, 
      success: populateComp 
    }); 

$("#manufacturer").change(function() 
    { 
    resetValues(); 
    var data = { man :$(this).attr('value') }; 
    jQuery.ajax({ 
      url: 'type_list.php', 
      type: "POST", 
      dataType: "xml", 
      data:data, 
      async: false, 
      success: populateType 
    }); 
    }); 
     }); 
</script> 

<style> 
    #loading{ 
    background:url('loader64.gif') no-repeat; 
    height: 63px; 
    } 
</style> 
</head> 
<body > 
<p>Manufacturer:<select name="manufacturer" id="manufacturer" ><option value="">Please select:</option></select>&nbsp; 
Printer type: <select name="printertype" id="printertype" disabled="disabled" ><option value="">Please select:</option></select>&nbsp;</p> 
<div id="loading" style="display: none;"></div> 
<div id="output" ></div> 
</body> 

functionsjq.js

function resetValues() { 
    $('#printertype').empty(); 
    $('#printertype').append(new Option('Please select', '', true, true)); 
    $('#printertype').attr("disabled", "disabled"); 
} 

function populateComp(xmlindata) { 

var mySelect = $('#manufacturer'); 
$('#printertype').disabled = false; 
$(xmlindata).find("Company").each(function() 
    { 
    optionValue=$(this).find("id").text(); 
    optionText =$(this).find("name").text(); 
    mySelect.append($('<option></option>').val(optionValue).html(optionText)); 
    }); 
} 

function populateType(xmlindata) { 

var mySelect = $('#printertype'); 
$('#printertype').removeAttr('disabled');  
$(xmlindata).find("Printertype").each(function() 
    { 
    optionValue=$(this).find("id").text(); 
    optionText =$(this).find("name").text(); 
    mySelect.append($('<option></option>').val(optionValue).html(optionText)); 
    }); 
} 

man_list.php

<?php 
// manufacturer_list 
include("dbconfig.inc.php"); 

header("Content-type: text/xml"); 
echo "<?xml version=\"1.0\" ?>\n"; 
echo "<companies>\n"; 
$select = "SELECT * FROM search_parent"; 
try { 
    foreach($dbh->query($select) as $row) { 
     echo "<Company>\n\t<id>".$row['id']."</id>\n\t<name>".$row['searchname']."</name>\n</Company>\n"; 
    } 
} 
catch(PDOException $e) { 
    echo $e->getMessage(); 
    die(); 
} 
echo "</companies>"; 
?> 

type_list

<?php 
include("dbconfig.inc.php"); 

header("Content-type: text/xml"); 

$manid = $_POST['man']; 

echo "<?xml version=\"1.0\" ?>\n"; 
echo "<printertypes>\n"; 
$select = "SELECT id, fname FROM features WHERE parent_id = '".$manid."'"; 
try { 
    foreach($dbh->query($select) as $row) { 
     echo "<Printertype>\n\t<id>".$row['id']."</id>\n\t<name>".$row['fname']."</name>\n</Printertype>\n"; 
    } 
} 
catch(PDOException $e) { 
    echo $e->getMessage(); 
    die(); 
} 
echo "</printertypes>"; 
?> 

Табличный Посмотреть

search_parent

id searchname 
1  abc 

функции (parent_id является идентификатор таблицы search_parent)

id fname parent_id 
1 xyz 1 

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

+0

Нажмите f12 в своем браузере и откройте вкладку сети в консоли. Что вы видите (если есть), отправленные и полученные с сервера при выборе варианта? – andrew

+0

@andrew ничего не записано в консоли, когда я нажимаю опцию, infact порой я не получаю никакого значения ни для какой опции – Sam

+0

звучит как '$ (« # производитель »). Change' не стреляет, не могли бы вы изменить свою post, показывая образец данных, возвращаемых 'jQuery.ajax ({ url: 'man_list.php', ...' (как видно на консоли при загрузке страницы) – andrew

ответ

0

После последнего комментария, я подозреваю, что проблема, возникающая из-за использования async:false в ваших AJAX вызовов, которые в настоящее время осуждается см the docs

Что бы я сделал это загрузить список производителя непосредственно в PHP, как делать это с помощью AJAX является неэффективным, поскольку запрос Аякса является ввод дополнительной нагрузки на сервер

Manufacturer:<select name="manufacturer" id="manufacturer" > 
        <option value="">Please select:</option> 
        <?php 
         foreach($dbh->query($select) as $row) { 
         echo "<Company>\n\t<id>".$row['id']."</id>\n\t<name>".$row['searchname']."</name>\n</Company>\n"; 
         } 
        ?> 
      </select> 

Использование async:false является плохой практикой любым способом, как он блокирует пользовательский интерфейс во время запрос

здесь good post при правильном обращении с ответом ajax

Смежные вопросы