We have moved our forum to GitHub Discussions. For questions about Phalcon v3/v4/v5 you can visit here and for Phalcon v6 here.

Unable to get dependent dropdown working

I was trying to follow https://github.com/phalcon/cphalcon/wiki/Dependent-Select-Dropdown, but was unable to get it to work. I have a few questions.

  1. "Since I like to keep my javascript separate from the rest of the view I typically put the javascript in its own file. So there are three changes in the view." What is defined in that javascript file? I'm assuming that it is js/referrals.js, but that is not listed in the example.

  2. Would it be possible to get an example of the entire javascript file, view, controller and model?

Thank you.



12.2k

All code you need on the page

you need only 2 selectboxes at the view.

<select id="nation_id">
    <option value="">Empty</option>
    <option value="1">Nation #1</option>
    <option value="2">Nation #2</option>
    <option value="3">Nation #3</option>
    <option value="4">Nation #4</option>
    .....
    <option value="n">Nation #n</option>
</select>

<select id="states_id">
    <option value="">Empty</option>
</select>
$("#nation_id").change(function() {
    var value = $(this).val();

    $.ajax({
        type: "POST",
        url: getResultsUrl, // url to the Controller's action which make query to DB
        data: {"id": value},
        success: function(response){
            $("#states_id option")
                .not(":first").remove();

            parsed = $.parseJSON(response);

            $.each(parsed, function(key, value) {
                $("#states_id")
                    .append($("<option></option>")
                    .attr("value",value.id)
                    .text(value.name));
            });
        }
    });
});

If you have only this code than you are be able get it work