PHP从其他选择值中选择选项

时间:2017-08-20 12:43:23

标签: php forms select

如果在第一个选择中选择'Man'然后第二个选择选项从数据库显示Man的产品。 如果在第一个选择“女人”然后选择第二个选择选项显示女人的数据库产品。 我该如何设置这个系统?

<form method="post" action="" >            

        <label>Category</label></br>
            <select name="cat">
                <option value="Man">Man</option>
                <option value="Woman">Woman</option>
            </select></br></br>


        <label>Product</label></br>
            <select name="product">
                <option value="">Select Product</option>
            </select></br></br>
        <input type="submit" name="submit" value="Submit"/>
</form>

1 个答案:

答案 0 :(得分:0)

&#13;
&#13;
$(document).ready(function(){
    $("select.cat").change(function(){
        var selectCat = $(".cat option:selected").val();

//sample data - code starts here
        var data  = '[{"id":1,"name":"product 1"},{"id":2,"name":"product 2"}, {"id":3,"name":"product 3"}]';
        data = jQuery.parseJSON( data ); 
//sample data ends here
$('#response').html('');
       $('#response').append(' <label>Product:</label><select class="product" id="product"> </select> ');

       $('#response select').append($("<option />").val('').text('Select'));

       $.each(data,function(index, value){

           $('#response select').append($("<option  />").val(value.id).text(value.name));
       });
//add above code to your ajax success - code ends here.. 
        //return false;
        $.ajax({
            type: "GET",
            url: "process-ajax.php",
            data: { cat : selectCat } 
        }).done(function(data) {
        });
    });
});
&#13;
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<form>
    <table>
        <tr>
            <td>
                <label>Category:</label>
                <select class="cat">
                    <option>Select</option>
                    <option value="1">Man</option>
                    <option value="2">Woman</option>
                </select> 
            </td>
            <td id="response">
            </td>
        </tr>
    </table>
</form>
&#13;
&#13;
&#13;