how to make reset button on Metro UI bootstrap?

Question

i have some problem on my php code..

<form id="form1" method="post" action="proses.php">
    <div class="input-control text area">
        <textarea name="ipt1" type="textarea"><?php echo $data['data'];?></textarea>
    </div>
    <input name="submit-btn" type="submit" value="Submit"/>
    <input name="clear-btn" type="reset" value="Clear" onclick="document.getElementById('form1').clear();"/>
</form>

the result is nothing happened when i click the "Clear" button, and "ipt" field is not cleared, i need to help, if anyone know, please tell me.

Answer 1

The type='reset' button will reset all form values, but your problem is you have some default values coming from PHP. You can do the following:

<input name="clear-btn" type="reset" value="Clear" onclick="document.getElementsByName('ipt1')[0].innerHTML=''"/>

innerHTML here is used to access the content inside textarea.

DEMO