PHPフォーム - オプションが選択されている場合にのみ入力を入力する必要があります

Question

次の形式では、クリームの科学的テストから一連の結果を入力するよう求められます。 しかし、私は、クリームが早い段階で「タイプ」ボックスにタンクまたはプラントとして入力されている場合にのみ、ユーザーが「phos」ボックスに記入する必要があるようにしました。 これについてはどうすればいいですか？

<div class="jumbotron loginandcreateuser"> 
    <form method="post" action="cream.php"> 
    <table> 
     <tr><th>Time</th><td><input type="time" name="cream_time"></td></tr> 
     <tr><th>Provenance</th><td> 
     <select name="prov"> 
      <option value="org">Org</option> 
      <option value="conv">Conv</option> 
     </select> 
     </td></tr> 
     <tr><th>Size</th><td><input type="text" name="size"></td></tr> 
     <tr><th>Type</th><td> 
     <select name="type"> 
      <option value="tank">tank</option> 
      <option value="plant">plant</option> 
      <option value="product">product</option> 
     </select> 
     </td></tr> 
     <tr><th>Grade</th><td> 
     <select name="grade"> 
      <option value="DC">DC</option> 
      <option value="SC">SC</option> 
      <option value="WC">WC</option> 
     </select> 
     </td></tr> 
     <tr><th>Customer</th><td><input type="text" name="customer"></td></tr> 
     <tr><th>Usebydate</th><td><input type="date" name="usebydate"></td></tr> 
     <tr><th>Temp</th><td><input type="number" name="temp"></td></tr> 
     <tr><th>B/fat</th><td><input type="number" name="b_fat"></td></tr> 
     <tr><th>Phos</th><td><input type="number" name="phos"></td></tr> 
    </table> 
    <input type="submit" value="submit" name="submit"><br> 
</div> 

Answer 1

ます...これは簡単にいくつかのJavaScriptの検証で解決することができる

Answer 2

ためにJavascriptを使用する必要があります機能がトリガされるように、私は値を取得し、イベントリスナーを追加してい以下のときオプションが選択されています。

この関数は、選択したオプションがタンクまたはプラントであるかどうかをチェックします。それがphosフィールドを表示する場合は、phosフィールドを非表示にします。

<div class="jumbotron loginandcreateuser"> 
    <form method="post" action="cream.php"> 
    <table> 
     <tr><th>Time</th><td><input type="time" name="cream_time"></td></tr> 
     <tr><th>Provenance</th><td> 
     <select name="prov"> 
      <option value="org">Org</option> 
      <option value="conv">Conv</option> 
     </select> 
     </td></tr> 
     <tr><th>Size</th><td><input type="text" name="size"></td></tr> 
     <tr><th>Type</th><td> 
     <select id="type" name="type"> 
      <option value="tank">tank</option> 
      <option value="plant">plant</option> 
      <option value="product">product</option> 
     </select> 
     </td></tr> 
     <tr><th>Grade</th><td> 
     <select name="grade"> 
      <option value="DC">DC</option> 
      <option value="SC">SC</option> 
      <option value="WC">WC</option> 
     </select> 
     </td></tr> 
     <tr><th>Customer</th><td><input type="text" name="customer"></td></tr> 
     <tr><th>Usebydate</th><td><input type="date" name="usebydate"></td></tr> 
     <tr><th>Temp</th><td><input type="number" name="temp"></td></tr> 
     <tr><th>B/fat</th><td><input type="number" name="b_fat"></td></tr> 
     <tr id="phos" style="display: none"><th>Phos</th><td><input type="number" name="phos"></td></tr> 
    </table> 
    <input type="submit" value="submit" name="submit"><br> 
</div> 

<script> 

    document.getElementById("type").addEventListener("change", enablePhosTextarea); 

    function enablePhosTextarea() { 
     type = document.getElementById("type"); 
     value = type.value; 
     if (value === 'tank' || value === 'plant') { 
      document.getElementById("phos").removeAttribute("style", "display: none;"); 
     } else { 
      document.getElementById("phos").setAttribute("style", "display: none;"); 
     } 
    } 

</script> 

ここでそれを試してみてください。それが今であるように、あなたのフォームコントロールの https://jsfiddle.net/f34184u1/

Answer 3

どれが現在、必要に設定されていない、あなたのユーザーは既にホス入力に記入する必要はありません、に関わらずどのタイプが選択されているか。

クライアント側のやりとりでは、JavaScriptを使用して別のコントロールの値に応じて条件付きでコントロールを必要（または他の回答に示されるように）にするさまざまな方法があります。

これは、より良いユーザーエクスペリエンスを提供するのに役立ちますが、クライアント側で何をするかに関係なく、のサーバー側の入力を検証する必要があります。クライアント側の検証は、意図的にまたは意図せずに簡単にバイパスすることができるため、実際に使用されるアプリケーションの部分に適切な入力があることを検証する必要があります。

は、ここでは、cream.phpでこれを行うことができる方法の本当に基本的な例です：

session_start();    // start the session so you can store potential errors 
unset($_SESSION['errors']); // clear any errors from previous attempts 

// Check for invalid input 
if (in_array($_POST['type'], ['tank', 'plant']) && $_POST['phos'] = '') { 

    // store an error in the session 
    $_SESSION['errors']['phos'] = 'You must enter a value for Phos for tank/plant types.'; 

    // redirect back to your input form 
    header('Location: path/to/yourinputform.php'); 
    exit(); 
} 

// If no input validation errors are encountered, then go ahead with 
// however you're normally processing the input data. 

は、その後、あなたのログインフォームで、エラーのためにセッションをチェックし、もしあれば、適切な場所にそれらを表示します。これ以上のことはありますが、これはあなたに一般的な考えを与えるはずです。

多くのさまざまなPHPフレームワーク（Laravel、Symfonyなど）には、これを単純化し、これを自分で行う場合に遭遇する可能性のあるさまざまな問題を処理する、このタイプのメソッドが組み込まれています。