jQuery/AJAX自动填充值

Question

我遇到了问题jQuery和AJAX。 我有3个选择标签，其值通过AJAX填充。

这是我需要的情况。

当我在第一个选择标签上选择选项时，我在第二个选择标签中获得特定值。 然后，当我在第二个标签上选择选项时，我在第三个选择标签中获得特定值。 在第三个选择标签中选择选项后 - 发生提交。 这部分工作。

当然在提交一切后重置。我不希望这样，所以我把选择标签放入选择标签中。现在我不知道如何“直播”从第一个和第二个选择标签读取，以便在提交选项保持填充。

这里是我的代码PHP/HTML代码：

<form action="<?php echo $PHP_SELF; ?>" method="POST" name="userVideos" id="userVideos" style="width: 580px; margin-left: 5px; margin-bottom: 2px;"> 
     <select name="brand_select" id="brand_select" style="width: 140px; margin-right: 20px;"> 
      <option value="">Select Brand</option> 

      <?php 
      $query_brands = mysql_query("SELECT DISTINCT brand FROM users_video WHERE location = '2' ORDER BY brand"); 
      while ($row = mysql_fetch_object($query_brands)) 
      { 
       $name = $row->brand; 
       $sel = ($_POST['brand_name'] == $name) ? "selected='selected'" : ""; 
       echo "<option value='{$row->brand}' $sel>{$row->brand}</option>"; 
      } 
      ?> 

     </select> 
     <input type="hidden" value="<?php echo htmlspecialchars($_POST['brand_select']); ?>" name="brand_name" id="brand_name"/> 

     <select name="series_select" id="series_select" style="width: 140px; margin-right: 20px;" disabled> 
      <option value="">Select Series</option> 

      <?php 
      //TODO: finish code tidification 
      $sel = ($_POST['series_name'] != "") ? "selected='selected'" : ""; 
      echo "<option value='" . htmlspecialchars($_POST['series_name']) . "' $sel>" . htmlspecialchars($_POST['series_name']) . "</option>"; 
      ?> 

     </select> 
     <input type="hidden" value="" name="series_name" id="series_name"/> 

     <select name="model_select" id="model_select" style="width: 140px; margin-right: 20px;" disabled> 
      <option value="">Select Model</option> 

      <?php 
      $sel = ($_POST['model_name'] != "") ? "selected='selected'" : ""; 
      echo "<option value='" . htmlspecialchars($_POST['model_name'] != "") . "' $sel>" . htmlspecialchars($_POST['model_name']) . "</option>"; 
      ?> 

     </select> 
     <input type="hidden" value="" name="model_name" id="model_name"/> 
    </form> 

这里是我的jQuery 代码：

jQuery(document).ready(function(){ 

var brand = ""; 
var series = ""; 
var model = ""; 
var _brand = ""; 
_brand = $('#brand_name').val(); 

$("#brand_select").live("change", function(){ 
    brand = $('select#brand_select').val(); 


    if (brand == "" && _brand == "") 
    { 
     $('select#series_select').attr('disabled','disabled'); 
     $('#model_select').attr('disabled','disabled'); 
    } 
    else 
    { 
     $('select#series_select').removeAttr('disabled'); 
     $('#brand_name').val(brand); 

     var grbData = $.ajax({ 
      type: "GET", 
      url: "series.php", 
      data: "brand=" + brand, 
      success: function(html){ 
       $("#series_select").html(html); 
      } 
     }); 
    } 
}); 

$("#series_select").change(function(){ 
    series = $('select#series_select').val(); 
    if (series != ""){ 
     $('#model_select').removeAttr('disabled'); 
     $('#series_name').val(series); 

     var newData = $.ajax({ 
      type: "GET", 
      url: "model.php", 
      data: "brand=" + brand + "&series=" + series, 
      success: function(html){ 
       $("#model_select").html(html); 
      } 
     }); 
    }else{ 
     $('#model_select').attr('disabled','disabled'); 
    } 
}); 

$("#model_select").change(function(){ 
    model = $('select#model_select').val(); 
    if (model != ""){ 
     $('#model_name').val(model); 
     $('#userVideos').submit(); 
    } 
}); 

Answer 1

尝试像这样为了简单。给他们所有同一班，但使用ID为品牌或系列。我在写这篇文章时没有测试对不起，但是你可以把你所有的功能都移到1.你需要调整的基本想法。另外，我甚至可能用静态变量将它复杂化。但至少你可以跟踪价值。

$(".series_select").change(function(){ 
var value = $(this).val(), 
    type = $(this).attr('id'), 
    data, 
    self = $(this); 
    if(type == "brand"){ 
    data = "brand=" + value; 
    $(".series_select").change.brand = value; 
    } else if (type == "series"){ 
    data = "brand=" + $(".series_select").change.brand + "&series=" + value; 
    $(".series_select").change.series = value; 
    } else if(type == "submit"){ 
     if($(".series_select").change.brand != '' && $(".series_select").change.series != ''){ 
     $('#userVideos').submit(); 
     return; 
     } 
} 

    $.ajax({ 
     type: "GET", 
     url: "model.php", 
     data: data, 
     success: function(html){ 
      self.html(html); 
     } 
     }); 
    });