入力フィールドのデータを選択オプション値として保存します

このドロップダウンリストには異なる値があります。私がしようとしているのは、id = othertype showで他のオプション、隠しdivを選択したときに入力フィールドに入力し、そのデータを保存したいが、それが機能しないときです。私は同じ名前属性を2回使用することはできませんが、私は他の入力のためだけに別の列を必要としません。オプションと同じ列に入力値を保存することは可能ですか？私は他のオプションである他のオプションで渡している値ではなく、入力フィールドの値を求めます。入力フィールドのデータを選択オプション値として保存します

<div class="form-group"> 
    <div class="col-sm-12"> 
    <label for="p_type">Type*:</label> 
    <select class="form-control" name="qp_type" id="p_type" required> 
     <option value="Css">CSS</option> 
     <option value="HTML">HTML</option> 
     <option value="PhP">PhP</option> 
     <option value="Other">Other</option> 
    </select> 
    </div> 
</div> 

<div class="form-group" id="otherType" style="display:none;"> 
    <div class="col-sm-12"> 
     <label for="pType">If you chose ‘Other’, please describe below:</label> 
     <input id="pType" type="text"> 
    </div> 
</div>

テキストフィールドの入力またはドロップダウンから値のいずれかを使用しようとしているようなスクリプト

$('#p_type').on('change',function(){ 
    if($(this).val()==="Other"){ 
    $("#otherType").show() 
    } 
    else{ 
    $("#otherType").hide() 
    } 
});

出典

2016-10-09 stack kid

あなたはそれが「その他」だかどうかをチェックする以外のオプションの[値]属性を使用していますか？ '.val（）'の代わりに '.text（）'を使い、 'pType'の値をオプションの' 'value''に格納することができます（あるいは単に' data-'属性として格納することもできますが...おそらく悪いフォーム） – Tibrogargan

私はあなたが別のタイプのため、このデータのための別の列を作成する必要があると思うし、DB情報にユーザーがオプション "その他"を選択する必要があります。もちろん、このデータを同じDB列に入れることはできますが、正しいIMOではありません。 –

私はtext（）を使用しましたが、何とか動作しません。ええ、私は同じアプローチをしましたが、それを行う方法として例を見つけることができません。 –

が見えます。 1つのフィールドを有効または無効にできます。名前は同じであっても問題はありません。

<div class="form-group"> 
    <div class="col-sm-12"> 
    <label for="p_type">Type*:</label> 
    <select class="form-control" name="qp_type" id="p_type" required> 
     <option value="Css" selected>CSS</option> 
     <option value="HTML">HTML</option> 
     <option value="PhP">PhP</option> 
     <option value="Other">Other</option> 
    </select> 
    </div> 
</div> 

<div class="form-group" id="otherType" style="display:none;"> 
    <div class="col-sm-12"> 
     <label for="pType">If you chose 'Other', please describe below:</label> 
     <!-- START OFF WITH THIS ONE DISABLED, NAME IT THE SAME AS ABOVE ---> 
     <input id="pType" type="text" name="qp_type" disabled> 
    </div> 
</div> 

<script> 
$(document).ready(function(){ 
    $('select[name=qp_type]').change(function(){ 
     if($(this).val() == 'Other') { 
      $('#otherType').show(); 
      $('#pType').prop('disabled',false); 
     } 
     else { 
      $('#otherType').hide(); 
      $('#pType').prop('disabled',true); 
     } 
    }); 
}); 
</script>

出典

2016-10-09 23:16:44 Rasclatt

ありがとうalas Rasclatt。出来た。ありがとうございました。 –

これは、選択したオプションの値を入力フィールドの値に変更します。

function init() { 
 
\t $('#p_type').on('change',function(){ 
 
\t \t if($("option:selected", this).text()==="Other"){ 
 
\t \t $("#otherType").show() 
 
\t \t } 
 
\t \t else{ 
 
\t \t $("#otherType").hide() 
 
\t \t } 
 
\t }); 
 

 
\t $('#pType').on('change',function(){ 
 
\t \t // selector should be '#p_type option[text="Other"]', but it's returning an empty array 
 
\t \t $('#p_type option:selected').val($(this).val()) 
 
\t \t console.log($('#p_type').val()); 
 
\t }); 
 
} 
 

 
$(init);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"> 
 
</script> 
 
<body> 
 
<div class="form-group"> 
 
    <div class="col-sm-12"> 
 
    <label for="p_type">Type*:</label> 
 
    <select class="form-control" name="qp_type" id="p_type" required> 
 
     <option value="Css">CSS</option> 
 
     <option value="HTML">HTML</option> 
 
     <option value="PhP">PhP</option> 
 
     <option value="Other">Other</option> 
 
    </select> 
 
    </div> 
 
</div> 
 

 
<div class="form-group" id="otherType" style="display:none;"> 
 
    <div class="col-sm-12"> 
 
     <label for="pType">If you chose ‘Other’, please describe below:</label> 
 
     <input id="pType" type="text"> 
 
    </div> 
 
</div> 
 
</body>

出典

2016-10-09 23:34:23 Tibrogargan

入力フィールドのデータを選択オプション値として保存します

答えて

関連する問題