Question

<select style="width:300px;" id="FirstDD" name="userListingCategory" onchange="FillSelectTwo(this.options[this.selectedIndex].value)">
                      <option  disabled="disabled">Category...</option>
                      <?php while($row = $sth2->fetch(PDO::FETCH_ASSOC))
                      {echo "<option value=". $row['catID'] . ">" .$row['catName']."</option>";}
                    unset($sth2);
            $selectedOptionInCategory = $row['catID'];
                    ?>

                </select> 
                 <select style="width:340px;" id="SecDD" name="userListingSCategory">
                   <option  disabled="disabled">Sub-Category...</option>      
                <?php while($row = $sth3->fetch(PDO::FETCH_ASSOC))
                      {echo "<option value=". $row['scatID'] . ">" .$row['scatName']."</option>";}
                    unset($sth3);
                 ?>

选择“类别”时，如：

我希望与所选择的第一个subcategories相关联的category显示出来。

我正在运行以下SQL：

    SELECT scatID, scatName 
FROM Category C, SubCategory SC
WHERE C.catID = SC.catID 
AND C.catID = '$selectedOptionInCategory'

JS：

function FillSelectTwo(id) {  //what is this id for?  
    $.ajax({
        url: 'index.php',
        dataType: 'text',
        success: function(data) {           
         $('#SecDD').find('option').remove().end().append(data);
        },
        error:function(jxhr){
         console.log(jxhr.responseText);        
        }
    });
}

我遇到的问题 当我测试这段代码时，我选择了像category之类的Baby，然后subcategory框清除了第一个'禁用'选项值，但是那时它是一个空集，我不能选择任何一个选择SQL时category将返回的值。

它看起来像什么：

Answer 1

javascript ssems没问题，但我怀疑ajax电话是否首先出现

在firebug或开发者工具（用于chrome）中查看确认是否对index.php进行了ajax调用

还会删除成功回调中的选项，因此如果ajax失败，则select保持不变并发出错误回调以跟踪错误

 function FillSelectTwo(id) {  //what is this id for?  
    $.ajax({
        url: 'index.php',
        dataType: 'text',
        success: function(data) {           
         $('#SecDD').find('option').remove().end().append(data);
        },
        error:function(jxhr){
         console.log(jxhr.responseText);        
        }
    });
}

P.S。您的网址末尾缺少'可能是导致问题的原因

Answer 2

很容易......

首先，您需要创建一个返回子类的PHP函数。我经常制作一个ajax.php文件。在这里我有差异函数，在差异中调用。 $ _GET。

结果的PHP查看器。

switch($_GET['ajax'])
{
   case 'subcats' :
   $sql = [YOUR SQL QUERY];
   if(mysql_num_rows($sql)!=0)
   {
    echo "[";
    $i = 0;
    while($r = mysql_fetch_array($sql))
    {
       if($i!=0)
       {echo ',';}
       echo "['$r[scatID]','$r[ScatName]']";
    }
    echo ']';
   }
   break;
}

ajax请求的jQuery

$.post("ajax.php?ajax=subcats",'id='+$("#FirstDD").val(), function(result){
var print = '';
if(result)
{
for(i = 0;i<result.length; i++)
{
  var current = result[i];
  print += '<option value="'+ current[0] +'">'+ current[1] +'</option>';
}
$('#SecDD').html(print);
$('#SecDD').removeAttr('disabled');
}
});

可能是一些错误（ondemand着作不是我最强的一面^ _ ^），但是尝试将它与你的脚本联系起来。如果您遇到任何错误，请发表评论......

**

修改

**

但在你的情况下，当我现在理解它。在子类选项元素中，添加attr。 rel，你写了父id。后记，你添加这个jQuery代码：

$('#FirstDD').change(function(){
var thisId = $(this).attr('id');
$('#SecDD option').addAttr('disabled','disabled');
$('#SecDD option[rel="'+thisId+'"]').removeAttr('disabled');
});

获取与首次下拉选择相关的值

2 个答案:

修改