如果在HTML PHP中选择下拉列表，则添加并获取另一个新文本框

Question

Current code snippets

HTML

<form action="" method="post">
<select name="Particulars">
<option value="Username">Username</option>
<option value="Email">Email</option>
<option value="Address">Address</option>
</select>
<input type="submit" name="submit" value="Get Selected Values" />
</form>

PHP

<?php
if(isset($_POST['submit'])){
$selected_val = $_POST['Particulars'];  // Storing Selected Value In Variable
echo $selected_val;  // Displaying Selected Value
}

So for example, if i select Username, i will want another new text box to come out so I can type in value inside and submit, is there any way I can do it? Currently I am only able to echo out the value, but not a brand new text box. Sorry, english is not my first language, Thank you so much! :)

I will keep updating and showing what I've done here.

Answer 1

I suggest you to use JS.

In HTML

<form action="test.php" method="post">
    <select name="Particulars">
        <option value="Username">Username</option>
        <option value="Email">Email</option>
        <option value="Address">Address</option>
    </select>
    <!--UserName TextField-->
    <input name="username" type="text" style="display: none">
    <input type="submit" name="submit" value="Get Selected Values" />
</form>

Suggested JS

//jQuery
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>

<script type="text/javascript">
//To show if default option Username is selected
$(document).ready(function(){
    if($('select[name=Particulars]').val() == "Username"){
        $('input[name=username]').show();
    }
});

//With changing dropdownlist, if Username is selected then text field will appear.
$('select[name=Particulars]').on('change', function(){
    if($(this).val() == "Username"){
        $('input[name=username]').show();
    }else {
        $('input[name=username]').hide().val('');
    }
});
</script>

In test.php

if(isset($_POST['submit'])){
    $selected_val = $_POST['Particulars'];  // Storing Selected Value In Variable
    echo $selected_val;  // Displaying Selected Value

    if(isset($_POST['username'])){ //Added
        echo "User Nmae: " . $_POST['username'];
    }
}

Hope it will help you.