【问题标题】:Auto populate based on dropdown selected, need help根据选择的下拉菜单自动填充,需要帮助
【发布时间】:2011-05-04 12:28:39
【问题描述】:

如何通过选择的下拉菜单自动填充 db 中的数据? 我的下拉结果也已经出现了,代码如下:

<?php
    echo '<tr>
    <td>'.$customer.'</td>
    <td><select name="customer_id">';

    foreach ($customers as $customer) {
        if ($customer['customer_id'] == $customer_id) {
            echo '<option value="'.$customer['customer_id'].'" selected="selected">'.$customer['name'].'</option>';
        } else {
            echo '<option value="'.$customer['customer_id'].'">'.$customer['name'].'</option>';
        }
    }
    echo '</select>
        </td>
    </tr>';
?>

上面下拉列表的结果为

  • 管理员
  • 客户1
  • 免费

从以下数据库加载

INSERT INTO `my_customer` (`customer_id`, `name`, `firstname`, `lastname`) VALUES
(8, 'admin', '', ''),
(6, 'customer1', 'ok', ''),
(7, 'FREE', 'marj', 'om');

因此,只要选择下拉列表,我希望以下所有数据:

<tr>
<td><?php echo $firstname; ?></td>
<td><?php echo $lastname; ?></td>
</tr>

也自动填充,似乎需要 javascript/ajax/jquery 来修复它,我想知道是否有人可以帮助我,提前感谢


添加 JSON CALL

我已经有如下的 json 调用: (假设这个放在 customer.php 中,url index.php?p=page/customer

public function customers() {
    $this->load->model('account/customer');
    if (isset($this->request->get['customer_id'])) {
        $customer_id = $this->request->get['customer_id'];
    } else {
        $customer_id = 0;
    }

    $customer_data = array();
    $results = $this->account_customer->getCustomer($customer_id);
    foreach ($results as $result) {
        $customer_data[] = array(
            'customer_id' => $result['customer_id'],
            'name'       => $result['name'],
            'firstname'       => $result['firstname'],
            'lastname'      => $result['lastname']
        );
    }

    $this->load->library('json');
    $this->response->setOutput(Json::encode($customer_data));
}

和数据库

public function getCustomer($customer_id) {
    $query = $this->db->query("SELECT DISTINCT * FROM " . DB_PREFIX . "customer WHERE customer_id = '" . (int)$customer_id . "'");
    return $query->row;
}

【问题讨论】:

  • 您到底想做什么...尝试重新表述您的问题,以便人们能够正确理解它。

标签: php javascript populate drop-down-menu


【解决方案1】:

假设您正在使用 jQuery,您将监听选择更改事件,然后对将返回数据的 PHP 函数进行 ajax 调用。然后将数据输出到适当的地方。我建议为下一个标签设置 id 属性:&lt;select&gt;&lt;td&gt; 用于名称,&lt;td&gt; 用于姓氏,如下所示:

<select name="customer_id" id="customer_id>...</select>

<td id="firstname"> echo firstname </td>
<td id="lastname"> echo lastname </td>

然后是jquery代码:

<script type="text/javascript">//<!--
$(document).ready(function(){
    $('select#customer_id').change(function(){
        $.post(
            "http://www.domain.com/my_php_script.php",
            {customer_id: $(this).val()},
            function(data){
                $('td#firstname').html(data.firstname);
                $('td#lastname').html(data.lastname);
            }
        );
    });
});
//--></script>

假设你的my_php_script.php通过$_POST['customer_id']中给定的customer_id从数据库中检索数据并返回一个类似echo json_encode(array('firstname' =&gt; FIRSTNAME_FROM_QUERY, 'lastname' =&gt; LASTNAME_FROM_QUERY));的JSON对象

添加: 有两种解决方法 - 在 JS 中而不是

$.post()

你必须使用

$.get(...)

OR 在您的 PHP 脚本中,而不是

$this->request->get['customer_id']

你必须使用

$this->request->post['customer_id']

在每个地方...应该这样做... 例如:

<script type="text/javascript">//<!--
$(document).ready(function(){
    $('select#customer_id').change(function(){
        $.get(
            "http://www.domain.com/my_php_script.php",
            {customer_id: $(this).val()},
            function(data){
                $('td#firstname').html(data.firstname);
                $('td#lastname').html(data.lastname);
            }
        );
    });
});
//--></script>

【讨论】:

  • @shadyyx,非常感谢您的关注建议,我对您的代码很感兴趣,但似乎我还没有幸运,所以我通过包含 json 调用编辑了我以前的代码,请有一个看,让我知道如何解决它。再次感谢
  • 嗨,再次感谢伙计,我已经使用它,但似乎不起作用,没有数据填充。我该怎么办?
  • 我最近在stackoverflow.com/questions/5873723/… 上发布了我的完整代码,请看一下,也许对我有帮助。谢谢
  • 嗨。你有安装了 Firebug 插件的 Firefox 浏览器吗?如果没有,请安装它,加载页面并按 F12 打开 Firebug。转到“控制台”选项卡(如果不允许,则允许)并将页面重新加载到再次调用 AJAX 调用。观察控制台上的输出,并在控制台下查看“响应”选项卡。还有什么?或者您可以为我们提供现场演示吗?
  • 好的,我在这里回答了 stackoverflow.com/questions/5873723/… - 现在应该可以了 :-)
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2014-12-11
  • 1970-01-01
  • 2022-11-17
  • 2012-10-25
  • 2012-07-24
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多