Question

<label class="col-sm-1 control-label">Tahun Lulus</label>
<div class="col-sm-1">
   <select class="form-control1" name="thn_lulus1">
      <option value="">--Pilih--</option>
      <?php                                             
         $tahunawal = 2000;                                                             
         $query = mysqli_query($k,"select YEAR(now()) as tahun");
         $obj = mysqli_fetch_object($query);                                                
         while($tahunawal<=$obj->tahun){
         ?>
      <option value="<?=$tahunawal; ?>"><?=$tahunawal; ?></option>
      <?php
         $tahunawal++;
         } 
         ?>
   </select>
</div>
<div class="col-sm-1">
   s/d
   <select class="form-control1" name="thn_lulus2">
      <option value="">--Pilih--</option>
      <?php                                             
         $tahunawal = 2000;                                                             
         $query = mysqli_query($k,"select YEAR(now()) as tahun");
         $obj = mysqli_fetch_object($query);                                                
         while($tahunawal<=$obj->tahun){
         ?>
      <option value="<?=$tahunawal; ?>"><?=$tahunawal; ?></option>
      <?php
         $tahunawal++;
         } 
         ?>
   </select>
</div>

以上代码仅显示开始年份为2000年至当年的组合框年份。

请帮助我，如何选择第二年，不少于第一年？

Answer 1

在您的选择标记中添加ID。喜欢 -

<select class="form-control1" name="thn_lulus1" id="thn_lulus1">

<select class="form-control1" name="thn_lulus2" id="thn_lulus2">

然后 -

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
$("select").on("change", function(e){
    if(e.target.id == "thn_lulus1"){
        var lulu1 = $(e.target).val();
        $.each($("#thn_lulus2 option"), function(k,v){
            if($(v).val() < lulu1) 
                $(v).attr("disabled", true);
        });
    }
});
</script>

Answer 2

你可以选择Ajax 像这段代码： -

HTML代码：

<select id='dropdown1' onChange='getData(this.value);'>
    <option value="">--Pilih--</option>
    <?php                                             
        $tahunawal = 2000;                                                             
        $query = mysqli_query($k,"select YEAR(now()) as tahun");
        $obj = mysqli_fetch_object($query);                                                
        while($tahunawal<=$obj->tahun)
        {
    ?>
            <option value="<?=$tahunawal; ?>"><?=$tahunawal; ?></option>
    <?php
            $tahunawal++;
        } 
    ?>
</select>  

<select id='dropdown2'>
</select>

Javascript代码：

<script>
    function getData(val)
    {
        var xmlhttp = new XMLHttpRequest();
        xmlhttp.onreadystatechange = function()
        {
            if (this.readyState == 4 && this.status == 200)
            {
                document.getElementById("dropdown2").innerHTML = this.responseText;
            }
        };
        xmlhttp.open("GET", "data.php?q="+val, true);
        xmlhttp.send();
    }
</script>

PHP代码：

<?php
    //mysql connection
    $val =  $_GET['q'];
    $str = '';
    //select query contains where condition like 'Year > $val'
    $obj = mysqli_fetch_object($query);                                                
    while($tahunawal<=$obj->tahun)
    {
        $str .= '<option value="'.$tahunawal.'">'.$tahunawal.'</option>';
    }
    echo $str;
?>

Answer 3

一种方法是禁用第二个选择框中小于所选选项的选项。

这是一个小提琴 -

＆＃13;

<script>
  function changeS2() {
    var selectBox1 = document.getElementById("s1");
    var selectedValue1 = parseInt(selectBox1.options[selectBox1.selectedIndex].value);
    var selectBox2 = document.getElementById("s2");
    var selectedValue2 = parseInt(selectBox2.options[selectBox2.selectedIndex].value);


    for (i = 0; i < selectBox2.options.length; i++) {
      if (parseInt(selectBox2.options[i].value) < selectedValue1) {
        selectBox2.options[i].disabled = true;
        if (parseInt(selectBox2.options[i].value) == selectedValue2) {
          // you can change it
        }
      } else {
        selectBox2.options[i].disabled = false;
      }
    }
  }
</script>

<select name="asdf" id="s1" onchange="changeS2();">
  <option value="2000">2000</option>
  <option value="2001">2001</option>
  <option value="2002">2002</option>
  <option value="2003">2003</option>
  <option value="2004">2004</option>
</select>
<select name="qwer" id="s2">
  <option value="2001">2001</option>
  <option value="2002">2002</option>
  <option value="2003">2003</option>
  <option value="2004">2004</option>
  <option value="2004" selected>2005</option>
</select>

＆＃13;

如何选择第二年，不少于第一年？

3 个答案: