论坛 › php › php级联

dongnanfeng 发表于 2015-8-28 07:09:42

php级联

Demo
　　Fill second (or more) <select> with data from a JSON request. And yes, those are the breeds of my pets.


-- Select Value -- Dog CatDomestic Medium Hair 　　

jQuery

$(document).ready(function(){
    $("select#category").change(function(){
      // Post string
      var post_string = "type=" + $(this).val();
      // Send the request and update sub category dropdown
      $.ajax({
            type: "POST",
            data: post_string,
            dataType: "json",
            cache: false,
            url: 'json.php',
            timeout: 2000,
            error: function() {
                alert("Failed to submit");
            },
            success: function(data) {
                // Clear all options from sub category select
                $("select#sub_category option").remove();
                // Fill sub category select
                $.each(data, function(i, j){
                  var row = "<option value=\"" + j.value + "\">" + j.text + "</option>";
                  $(row).appendTo("select#sub_category");
                });
            }
      });
    });   
});
HTML

<select name="category" id="category">
    <option value="">-- Select Value --</option>
    <option value="1">Dog</option>
    <option value="2">Cat</option>
</select>
<select name="sub_category" id="sub_category">
    <option value="">-- Select First Value --</option>
</select>
JSON AJAX Script, json.php

$json = array();
if ($_POST['type'] == 1)
{
    $json[] = array(
      'value' => '1',
      'text' => 'Staffordshire Bull Terrier'
    );
    $json[] = array(
      'value' => '2',
      'text' => 'Labrador Retriever/American Pit Bull Mix'
    );
    $json[] = array(
      'value' => '3',
      'text' => 'German Short Hair Pointer'
    );
}
elseif ($_POST['type'] == 2)
{
    $json[] = array(
      'value' => '4',
      'text' => 'Domestic Medium Hair'
    );
}
echo json_encode($json);

查看完整版本: php级联