0

嘿，我正在尝试在另一个使用 ajax 的基础上填充一个选择下拉列表。我有一个选择填充投资组合，第二个是空的。当我从第一个选择框中选择一个选项时。我调用一个 ajax 函数，在其中发送所选的投资组合 id，在 ajax 方法中，我找到所选 id 的组，如何用我找到的组填充第二个选择。我的代码是

包含两个选择的表单

<form name="portfolios" action="{{ path('v2_pm_portfolio_switch') }}" method="post" >
        <select id="portfolios" name="portfolio" style="width: 200px; height:25px;">
            <option selected="selected" value="default">Select Portfolio</option>
            {% for portfolio in portfolios %}
                <option get-groups="{{ path('v2_pm_patents_getgroups') }}" value={{ portfolio.id }}>{{ portfolio.portfolioName }}</option>
            {% endfor %}
        </select><br/><br/>
        <select id="portfolio-groups" name="portfolio-groups" style="width: 200px; height:25px;">
            <option selected="selected" value="default">Select Portfolio Group</option>
        </select><br/>
</form>

JS

 <script>
    $(document).ready(function(){
        $('#portfolios').change(function() {
            var id = $("#portfolios").val();
            var url = $('option:selected', this).attr("get-groups");
            var data = {PID:id};
            $.ajax({
                type: "POST",
                data: data,
                url:url,
                cache: false,
                success: function(data) {
                    //want to populate the 2nd select box here
                }
            });
        });
    }); 
</script>

控制器方法，我在其中找到所选投资组合的组

public function getgroupsAction(Request $request){
    if ($request->isXmlHttpRequest()) {

        $id = $request->get("PID");
        $em = $this->getDoctrine()->getEntityManager();
        $portfolio_groups = $em->getRepository('MunichInnovationGroupPatentBundle:PmPatentgroups')
        ->getpatentgroups($id);
        return $portfolio_groups;
    }
}

知道如何发送投资组合组并填充第二个选择

提前致谢

4

5 回答 5

2

使用getJson代替ajax();

Json（JavaScript Object Notation），是在 php 和 javascript 之间发送结构化数据的最简单方法。

我在这里假设控制器直接响应 ajax 查询，这$portfolio_groups是一个以“id”和“name”为键的关联数组或具有相同属性的对象。

在您的 PHP 控制器中发送 json 数据：

public function getgroupsAction(Request $request){
    if ($request->isXmlHttpRequest()) {

        $id = $request->get("PID");
        $em = $this->getDoctrine()->getEntityManager();
        $portfolio_groups = $em->getRepository('MunichInnovationGroupPatentBundle:PmPatentgroups')
        ->getpatentgroups($id);
        echo json_encode($portfolio_groups);
    }
}

然后使用 getJson 检索数据并对其进行迭代：

$.getJSON(url, data, function(result) {
    var options = $("#portfolio-groups");
    $.each(result, function(item) {
        options.append($("<option />").val(item.id).text(item.name));
    });
});

查看getjson 文档以获取更多详细信息

于 2012-08-21T14:28:48.153 回答
0

最简单的方法是从控制器返回 json 字符串，然后在 $.ajax 的“成功”调用中处理它。

让我们假设，您的 $portfolio_groups 变量是一个数组：

$portfolio_groups = array('1'=>'Portfolio 1', '2' => 'Portfolio 2');

然后你可以从控制器返回它作为 json 字符串，如下所示：

echo json_encode($portfolio_groups);

然后在您的 jQuery ajax 调用中，您可以在响应中捕获此字符串（$.ajax 的“成功”设置）。不要忘记添加设置 dataType: 'json'

粗略地说，您的 $.ajax 调用将如下所示：

$.ajax({
    type: "POST",
    data: data,
    url:url,
    cache: false,
    dataType: 'json', // don't forget to add this setting
    success: function(data) {
        $.each(data, function(id, title){
            var node = $('<option>').attr('value', id).html(title);

            // this will simply add options to the existing list of options
            // you might need to clear this list before adding new options
            $('#portfolio-groups').append(node);
        });
    }
});

当然，如果数据不为空等，您还需要添加检查。

于 2012-08-21T14:35:17.563 回答
0

假设函数getgroupsAction保留在一个平面 php 控制器中（不在类中），您应该告诉服务器执行该函数

因此，在 ajax 调用文件的末尾，您几乎不应该先调用该函数（可能是您做到了！）

对于您的专利组结果集，您可以通过 php 或 javascript 生成选择

在第一种情况下，您应该这样做：

//php
  $options = getgroupsAction($_REQUEST);
  $return = "<select name =\"name\" id=\"id\"><option value=\"\"></option>";
 foreach( $options as $option){
       $return.= "<option value=\"$option\">$option</option>";
 }
 $return .= "</select>";
  echo $return;

然后在Javascript中：// javascript

  var data = {PID:id};
        $.ajax({
            type: "POST",
            data: data,
            url:url,
            cache: false,
            success: function(data) {
                //inside data you have the select html code so just:
               $('#divWhereToappend').append(data);
            },
    error: function(data) {
                //ALWAYS print the error string when it returns error for a more easily debug
         alert(data.responseText);
            }
        });
于 2012-08-21T14:58:50.177 回答
0

看看这个 XML教程（有人会因为我链接到 w3schools 而发火）这是一个好的开始。

AJAX 请求在非常广泛的术语中是使浏览器打开一个只有它可以看到（而不是用户）可以看到的窗口的调用。向服务器发出请求，服务器返回一个页面，发出请求的脚本可以查看该页面。这意味着任何可以用文本表达的东西都可以通过 AJAX 传输，包括 XML（AJAX 中的 X 代表 XML）。

这有什么帮助？考虑一下，如果您尝试填充下拉列表，则需要返回一个项目列表来填充它。您可以对页面进行 ajax 调用http://www.mysite.com/mypage.php?d=select1（如果您不熟悉 GET 和 POST 请求，或者对 AJAX 更实用的方面有一点了解，可以在此处获得另一个完整的教程）并让它返回一个项目列表如下：

item1
item2
item3
...

并扫描文本以查找换行符。虽然这肯定适用于大多数情况，但它并不理想，并且在可能使用 AJAX 的所有其他情况下肯定不会有用。而是考虑在 XML 中格式化 PHP（.NET、ASP 等）中的返回：

<drop>
    <item>item1</item>
    <item>item2</item>
    <item>item3</item>
</drop>

并使用内置在解析器中的 Javascript（在此处概述）来获取数据。

于 2012-08-21T14:32:10.170 回答
0

我要做的是使用 $.load() 函数。为此，您getgroupsAction应该返回选项 html。

JS：

<script>
    $(document).ready(function(){
        $('#portfolios').change(function() {
            var id = $("#portfolios").val();
            var url = $('option:selected', this).attr("get-groups");
            var data = {PID:id};

            // Perhaps you want your select to show "Loading" while loading the data?
            $('#portfolio-groups').html('<option selected="selected" value="default">Loading...</option>');

            $('#portfolio-groups').load(url, data);
        });
    }); 
</script>

我不知道如何$portfolio_groups存储数据，但假设您会在回复中执行以下操作：

<?php foreach($portfolio_groups as $p) : ?>
    <option value="<?php echo $p->value ?>"><?php echo $p->name ?></option>
<?php endforeach ?>

这样，选择将填充由输出的选项getgroupsAction。

于 2012-08-21T14:32:39.730 回答