创建子类别选择框 onChange

Posted 2023-05-08

【中文标题】创建子类别选择框 onChange

【英文标题】：Create subcategory select box onChange

【发布时间】：2014-05-26 05:48:04

【问题描述】：

我正在创建一个类别系统，用户可以在其中从数据库中选择类别，并在他们选择后创建另一个带有该类别子类别的选择框。

那么，我的问题是我怎样才能做到最好？

顺便说一句，我使用的是 Laravel 框架，第一类很简单

<select>
    @foreach(Category::all() as $k)
      <option value=" $k['id'] "> $k['name'] </option>
    @endforeach
</select>

但是在他们选择了一个类别后我应该怎么做？是不是更好地执行 AJAX 调用来发送选择的类别的 ID 并返回子类别或什么？

我需要最好和专业的方法来做到这一点。

在我的数据库中

ID,   name,   parent

【参考方案1】：

使用ajax，在选择category 后发送ajax 请求，为此您需要在select 上使用change 事件，例如：

// Assumed category is id of the select
$('#category').on('change', function()
    var id = $(this).val();
    $.getJSON("subcategory/" + id , function(data)
        // Assumed subcategory is id of another select
        var subcat = $('#subcategory').empty();
        $.each(data, function(k, v)
            var option = $('<option/>', id:k, value);
            subcat.append(option);
        );
    );
);

在服务器端，像这样创建一个路由（你可以使用控制器和 Eloquent）：

Route('subcategory/id', function($id)
    // Get the data from database according to the id
    // Build an array as: id => value and then return
    return Response::json($subcat);
);

【参考方案2】：

Populate a dropdown on selecting an option from another dropdown Laravel

这肯定会对您有所帮助。不然不懂就问

【参考方案3】：

select_cat.php

<script type="text/javascript" src="http://ajax.googleapis.com/
ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()

$(".category").change(function()

var id=$(this).val();
var dataString = 'id='+ id;

$.ajax
(
type: "POST",
url: "select_subcat.php",
data: dataString,
cache: false,
success: function(html)

$(".subcat").html(html);

);

);

);
</script>

类别：

<select name="category" class="category">
<option selected="selected">--Select Category--</option>
<?php
include('databasefile');
mysql_connect($server,$username,$password)or die(mysql_error());
mysql_select_db($database)or die(mysql_error());
$sql=mysql_query("select cat_name from category order by cat_name");
while($row=mysql_fetch_array($sql))

$cname=$row['cat_name'];
echo '<option value="'.$cname.'">'.$cname.'</option>';
 ?>
</select> <br/><br/>

SubCategory :
<select name="subcat" class="subcat">
<option selected="selected">--Select SubCat--</option>
</select>

2.select_subcat.php

<?php
include('databasefile);
mysql_connect($server,$username,$password)or die(mysql_error());
mysql_select_db($database)or die(mysql_error());
if($_POST['id'])

$id=$_POST['id'];
$sql=mysql_query("select s_name from subcat_l1 where cat_name='$id'");
while($row=mysql_fetch_array($sql))

$sname=$row['s_name'];
echo '<option value="'.$sname.'">'.$sname.'</option>';


?>
SubCategory :
<select name="subcat" class="subcat">
<option selected="selected">--Select SubCat--</option>
</select>