テキストフィールドの値で隠しフォームフィールドを更新する

Question

フォームを送信するときに、テキストフィールドに入力された値で隠しフォームフィールドの値を設定しようとしています。

私は様々な質問への回答を組み合わせることを試みましたが、私のソースフィールドの「ID」を取得しています。

テキストフィールド名= wpcf-利用可能在庫 隠しフィールド名= wpcf-全株式

隠しフィールドは、単純にjqueryのを使用して提出し、フォーム上のテキストフィールドと同じ値に設定する必要がありますか？

私はすべてのおかげ

Answer 1

HTMLの下に使用し、expeccted結果を達成するために：

<input type="hidden" name="wpcf-total-stock"> 
<input type="text" name="wpcf-available-stock" value="test"> 

JS：

$("input[name='wpcf-available-stock']").on('keyup',function(){ 
$("input[name='wpcf-total-stock']").val($(this).val()); 
alert($("input[name='wpcf-total-stock']").val()); 
}); 

Codepen- http://codepen.io/nagasai/pen/RRBwjA

Answer 2

まず...尋ねた他の質問に簡単なサンプルを見つけることができないよう：あなたはとにかくそれを送信しようとしているのに、なぜあなたは、テキストフィールドから非表示のフォームフィールドを埋めるでしょうか？

var fieldValue = $('#wpcf-available-stock').val(); 
$('#wpcf-total-stock').val(fieldValue); 

一緒にすることができます明らかにチェーンでなく、これはかなりきれいです：

第二に、jQueryのは次のようになります。 https://jsfiddle.net/u5Lj8cLz/

Answer 3

ピュアJavaScriptのソリューションを

はここでデモです。

updateHidden = function(x) { 
 
     document.querySelector("[name=bar]").value = x; 
 
    }

<input name="foo" value="" onchange="updateHidden(this.value)" type="text"> 
 
    <input name="bar" value="sometext" type="hidden">

updateHidden = function() { 
 

 
document.querySelector("[name=bar]").value = document.querySelector("[name=foo]").value; 
 
} 
 

 

 
document.querySelector("[name=foo]").addEventListener("change", updateHidden); 
 

 
/* 
 
or, 
 
document.querySelector("[name=foo]").addEventListener("keyup", updateHidden); 
 
*/

 <input name="foo" type="text"> 
 
     <input name="bar" type="hidden">

更新