CODEWITHSUNDEEP
htmlforms
Bayu Anggara
Bayu Anggara

Reputation: 287

Clear text box after choose certain option on select box

I have a select box and text box like this :

<?php
    $receipt="12345";
?>

<form>
    <select name="sent" id="sent">            
        <option value="1">Yes</option>
        <option value="0">No</option>
    </select> 

    <input type="text" name="receipt" value="<?=$receipt?>">
</form>

how can I clear the textbox after I choose option No ?

Upvotes: 0

Views: 2543

Answers (3)

Shehary
Shehary

Reputation: 9992

You can achieve it with jQuery change method

create variable receipt

var receipt = "12345"; //replace 12345 with <?php echo $receipt;?>

bind select element with jQuery change method$("#sent").change(function ()

check select element value against var receipt and if true, clear the input.

$(document).ready(function () {
	var receipt = "123456";
	$("#sent").change(function () {
		var sel = $(this).val();
		if (sel == 0) {
			$("input[name=receipt]").val("");
		} else {
			$("input[name=receipt]").val(receipt);
		}
	});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
    <select name="sent" id="sent">
        <option value="1">Yes</option>
        <option value="0">No</option>
    </select>
    <input type="text" name="receipt" value="123456">
</form>

Fiddle

Upvotes: 1

Gaurav Rai
Gaurav Rai

Reputation: 928

<?php
    $receipt="12345";
?>

<script>
function SetField(val)
{
    if(val==0)
        document.getElementById('input-field').value='';
    else
        document.getElementById('input-field').value='<?php echo $receipt;?>';
}
</script>
<form>
    <select name="sent" id="sent" onchange="SetField(this.value);">            
        <option value="1">Yes</option>
        <option value="0">No</option>
    </select> 

    <input type="text" id="input-field" name="receipt" value="<?=$receipt?>">
</form>

Much compact

Upvotes: 0

Fenny
Fenny

Reputation: 41

try this one its work i have try it

<html>
<head>

<script>
function Clear()
{
    var sent = document.getElementById('sent').value;
    if(sent==0){
        document.getElementById("receipt").value="";
    }


}
</script>

</head>

<body>
    <?php
    $receipt="12345";
?>

<form>
    <select name="sent" id="sent" onchange="Clear()">            
        <option value="1">Yes</option>
        <option value="0">No</option>
    </select> 

    <input type="text" id="receipt" name="receipt" value="<?=$receipt?>">

</form>
</body>
</html>

Upvotes: 0

Related Questions