0

ajaxを使用して、別の選択ドロップダウンに基づいて、選択ドロップダウンを作成しようとしています。ポートフォリオが入力された 1 つの選択があり、2 番目の選択は空です。最初の選択ボックスからオプションを選択すると。選択したポートフォリオ ID を送信する ajax 関数を呼び出します。ajax メソッドで、選択した ID のグループを見つけます。見つけたグループを 2 番目の選択に入力するにはどうすればよいですか。私のコードは

2 つの選択を含むフォーム

<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;
    }
}

ポートフォリオ グループを送信して 2 番目の選択を入力する方法を教えてください。

前もって感謝します

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

この XMLチュートリアルを確認してください(w3schools へのリンクについて、誰かが私を炎上させようとしています)。これは良い出発点です。

AJAX リクエストは、非常に大まかに言えば、ブラウザだけが (ユーザーではなく) 見ることができるウィンドウを開く呼び出しです。サーバーに対してリクエストが行われ、サーバーがページを返し、リクエストを行ったスクリプトがそのページを表示できます。これは、テキストで表現できるものはすべて、XML (AJAX の X が表す) を含め、AJAX 経由で送信できることを意味します。

これはどのように役立ちますか? ドロップダウン リストに入力しようとしている場合は、入力するアイテムのリストを返す必要があることを考慮してください。ページへの ajax 呼び出しを行うことができますhttp://www.mysite.com/mypage.php?d=select1(GET および POST 要求に慣れていない場合、または AJAX のより実用的な側面について少し理解していない場合は、別の完全なチュートリアルが利用可能ですここ) アイテムのリストを返すようにすることができます次のように：

item1
item2
item3
...

そして、テキストをスキャンして改行を探します。これは確かにほとんどの場合に機能しますが、理想的ではなく、AJAX が使用される可能性がある他のすべての場合には役に立ちません。代わりに、PHP (.NET、ASP など) の戻り値を XML でフォーマットすることを検討してください。

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

そして、パーサーに組み込まれた Javascripts (ここで概説) を使用してデータを取得します。

于 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 ?>

このようにして、select は によって出力されたオプションで埋められますgetgroupsAction。

于 2012-08-21T14:32:39.730 に答える