ユーザー入力に基づいて対応するフィールドを自動入力する方法

私はフォームまたはフォームをいくつか持っていますが、コンセプトは似ていて、1つのフィールドからユーザー入力値を取り込み、。ユーザが 'に入力するようにした場合、したがって、基本的ユーザー入力に基づいて対応するフィールドを自動入力する方法

<?php 
    case 'Multiply': 
     echo "<p>Matrix Multiplication requires Matrix B to have the same number of rows as Matrix A has columns.</p>" 
      . "<p> What size matrices would you like? </p>"; 
     echo " <form method='POST' action='$_SERVER[PHP_SELF]' onsubmit='return param_check_mux();'>            
        <p>A Rows:<input type='text' name='arows' id='arows'> A Columns:<input type='text' name='acolumns' id='acolumns'></p> 
        <p>B Rows:<input type='text' name='brows' id='brows'> B Columns:<input type='text' name='bcolumns' id='bcolumns'></p> 
        <input type='submit' value='Compile my Matrices!' name='submit'>        
       </form>"; 
    break; 
?>

たとえば、行列を乗算するために、行列Aの行は、私のフォームを

したがって行列Bの列に等しくなければなりません行番号 '3'、 'B列'に自動入力を行い、 '3'値を保持します。私はこれも逆もうまくいきたいので、 'B Columns' = '3'ならば 'A Rows' = '3'にもなります。

どこでも正しい例を見つけることができないか、かなり具体的なので、検索で質問の語り方をわかりません。

事前にお気軽にお問い合わせください。ありがとうございました。 jQueryの使い方

出典

2017-04-20 Kieran

JavaScriptを使用する方法です。始める方法：[CodeAcademy]（https://www.codecademy.com/learn/javascript） – Hulothe

はJavaScriptを使用して値をつかむだろうだろう。 JavaScriptを使用して値を取得して埋め込む方法をよく理解できるように、この例をかなり基本的なものに保つようにしました。

function fillB(){ 
 
\t var anum = document.getElementById('aRow').value; 
 
    var bnum = document.getElementById('bRow'); 
 
    bnum.value = anum; 
 
} 
 

 
function fillA(){ 
 
\t var bnum = document.getElementById('bRow').value; 
 
    var anum = document.getElementById('aRow'); 
 
    anum.value = bnum; 
 
}

A: <input type="number" onblur="fillB()" id="aRow"> 
 
B: <input type="number" onblur="fillA()" id="bRow">

出典

2017-04-20 16:12:18

サンプルコードを読み、理解してくれてありがとう！これは治療に役立ちました。 – Kieran

私は助けることができてうれしいです！ :) –

：このような何かのために

jQuery(document).ready(function() 
{ 
    // Set the B Columns if A rows changed 
    jQuery('#arows').on('change', function() 
    { 
     jQuery('#bcolumns').val(jQuery('#arows').val()); 
    }); 

    // Set the A rows if B Columns changed 
    jQuery('#bcolumns').on('change', function() 
    { 
     jQuery('#arows').val(jQuery('#bcolumns').val()); 
    }) 
});

出典

2017-04-20 16:05:48 Hossein

あなたは、クライアント側でJavascriptを試してみて、使用することができます。入力値の変化を監視し、適切なアクションを実行します。例：

<body> 
    <form action="#" method="post"> 
     <div> Matrix A <br/> 
      <label> Rows </label><input type='text' name='arows' id='arows'></input> 
      <label> Columns </label> <input type='text' name='acolumns' id='acolumns' onchange=columnChange(this.value)></input> 
     </div> 
     <br/> 
     <div> Matrix B <br/> 
      <label> Rows </label> <input type='text' name='brows' id='brows' onchange=rowChange(this.value)></input> 
      <label> Columns </label> <input type='text' name='bcolumns' id='bcolumns'> 
     </div> 
     <input type="submit" name="send" value="Send"> 
    </form> 
    <script type="text/javascript"> 
     function columnChange(input){ 
      document.getElementById("brows").value=input; 
     } 
     function rowChange(input){ 
      document.getElementById("acolumns").value=input; 
     } 
    </script> 
</body>

出典

2017-04-20 16:30:14 user3344867

ユーザー入力に基づいて対応するフィールドを自動入力する方法

答えて

関連する問題