2017-06-27 10 views
1

のないアップデートは、私はオプションの同じ値(同じテキスト)2つのドロップダウンの間の値を渡します。クリック

セレクタ1つの セレクタと2つの別々のドロップダウンセレクターを構築しようとしている2

<script type="text/javascript"> 


jQuery(function ($) { 
var $set = $('#selector1, #selector2') 
$set.change(function() { 
    $set.not(this).val(this.value) 
}) 

}) 
</script> 

<html> 
<div style="float: right;margin-left: 10px;"> 
        <div > 
        <select id="selector1" onchange="" 
style="width:130px;"> 
         <option selected diabled hidden value="">Select Volume 
Type</option> 
         <option value="1">Auto-Weekly</option> 
         <option value="2">Auto-Monthly</option> 
         <option value="3">Custom Weekly</option> 
           <option value="4">Custom Monthly</option> 

        </select></div> 
       </div> 
<td style="text-align: center;"> 

<select id="selector2" style="width:80px;"> 
<option selected="" diabled="" hidden="" value="0">Select Report 
Period</option> 
         <option value="1">Auto-Weekly</option> 
         <option value="2">Auto-Monthly</option>  
          <option value="3">Custom Weekly</option> 
          <option value="4">Custom Monthly</option>   
        </select> 

          </td> 


</html> 

問題: は今、私はjavascriptの上で使用しています$ setの値と一致するようにします。 問題は、「更新」するためにドロップダウンに「クリック」しなければならないことです。 たとえば、 セレクタ1でオプション値= 1を選択した場合、セレクタ2をクリックして更新された値を表示する必要があります。

もっと洗練された解決策がありますか?私はこれらのオプションを後で別の方法で使用しています。そのため、2つの別々のセレクタが必要であり、バインドでそれらを一致させる必要があります。

+0

は、今あなたが、セレクタ1つの右の値を変更するとすぐにselector2で同じ値を更新する必要がありますか? –

+0

はい、現在、私は値をつかむためにonchangeを開始するために 'クリック'する必要があります。 –

答えて

0

私は以下のスクリプトを試しましたが、まだクリックしてドロップダウン値を更新する必要があります。

<script type="text/javascript"> 
$(document).ready(function(){ 
$('#selector1, #selector2').on('change',function() 
{ 
var report_answer = jQuery('#selector1').val(); 
var report_type = jQuery('#selector2').val(); 



var x= document.getElementById("selector1").selectedIndex; 
var y = document.getElementById("selector2").selectedIndex; 

    report_type = this.report_answer; 
    this.selectedIndex = y; 
     y=report_type; 
    return report_type; 

}); 
}); 

関連する問題