Php 在下拉列表中获取数据库内容并显示所选下拉列表中的数据库信息

我的问题是，我有两个

下拉列表

，它们从我的

DB

中获取内容，一个简单的

选择带有类别的*

，然后从该类别中选择一个项目

第一个下拉菜单：“下拉菜单类型”是类别

第二个下拉列表：“dropdown_abo”是该项

在第二个下拉列表中，我使用了JQuery插件，可以在下拉列表中进行搜索，以使项目比滚动更快（其中会有很多项目）。你可以看到插件

从第二个下拉列表中选择项目时，下面的div（

abo_info

）将显示所选项目的所有信息

我的问题是我陷入困境，不知道如何继续。当我选择一个类别，然后选择一个项目，我从下面的div中显示的项目中获取内容时，我如何才能做到这一点

我使用的是

PHP

、

JQuery

和

Mysql.*

（对于DB-connect，知道

PDO

，但我不太擅长）

我能在这里得到一些帮助吗，或者一些关于如何做到这一点的例子

---

你似乎朝着正确的方向前进，并且做得很好

请按照以下步骤进行进一步操作：

使用或基本上可以向PHP文件发送请求

在PHP文件中，您可以使用PDO或普通mySQL连接器连接到数据库，并将所需数据返回到AJAX调用

返回的数据可以根据需要在HTML部分呈现和显示

请使用以下参考资料，从代码角度为您提供更好的想法：

---

正如@WisdmLabs提到的，您走在了正确的轨道上

继续的步骤应为：

选择两个Dropbox后添加JS事件（使用

onchange（）

或提交按钮）

该事件将通过POST触发对PHP文件的AJAX请求 要获取数据的项的数据

在PHP文件上，您将运行SQL查询并发回所需的信息——最好使用json

在jsajax函数中，您将获得Json对象并将neede信息插入页面DOM中

JS代码

$(".dropboxClass").change(function(){ // you can use a button instead or any other event type
    // here you can first check that bothdropboxes were selected 

    // now get the values of the dropboxes
    drop1 = $("#dropbox1").val();
    drop2 = $("#dropbox2").val();

    // run the AJAX request for the PHP file
    var request = $.ajax({
                    url: 'test2.php',
                    dataType: "json" ,
                    method: "POST",
            data: { d1: drop1, d2:drop2 } 
                });

        request.done(function(itemData){
            // here you will get the Json object , get the data you need and insert into the DOM
            console.log('Status:' + itemData['status']);
            console.log('Name:' + itemData['name']);

            alert('success');
        });

        request.fail(function(){
            // AJAX call failed - do something.....
        });
});

PHP脚本

// connect to your DB and get the data you need into an array 

$DB_data = array(
    "status"=>"code",
    "name"=>"item Name",
    "desc"=>"Item Description"
);

echo json_encode($DB_data);

---

您说您正在使用JQuery插件，但没有证据表明它或任何其他javascript。在任何人能够提供帮助之前，您必须改进fiddle以至少演示这个问题。记住我在JS文件夹中加载的插件，它不是我自己写的：-）太棒了！谢谢。这是一样的吗？一个带有代码的示例，这样它就可以看到它是如何完成的：-）我已经尽了最大的努力来实现这一点。但每次我选择一个类别时，另一个选择“为空”，却找不出原因。我制作了一个JSFIDDLE，以便您可以看到我所做的。你能看一下，看看我做错了什么吗？没关系，我发现了问题。选项的值中有空格和/或空格。删除了它们，它就起作用了：-）