Clear form that has been automatically filled in with PHP echo code

Question

I have created an order form and have automatically filled in some of the fields with the current users information that has been stored in the database. However, I realise that people will some times want to order somewhere new and may change the details just for that particular order. at the moment some of form field code is:

<label>Email :</label>
   <input type="text" value="<?php echo $info[email]?>" name="email" id="email">

Is there a way for me to clear the value of a field when I am echoing the value?

I know how to clear a form normally using javascript and reset() function on the form with button, but obviously that will only clear the values of the fields that the user has entered themselves not the ones output by PHP code. Any nudge in the right direction would be appreciated :).

Deleted the tag sorry was asking in general and unsure whether I'd need to add more or less to the PHP code. I am not using jquery on this part yet, but i will look into it now if you think that's the right direction to look in :). — Beasted, Apr 25 '15 at 22:21
@Beasted If it's just for doing this one thing, jQuery is likely an overkill. I would only use jQuery if you're going to actually use it for multiple things on your site, not just one small thing like this. I found [this answer](http://stackoverflow.com/a/10754924/811240) that gives a solution to your problem using jquery. To use plain JS, you have to loop through all the child `input` elements of your form and remove the `value` attribute. — Mike, Apr 25 '15 at 22:50

score 2 · Accepted Answer · edited May 23 '17 at 11:58

First: that's correct, you can't do that with PHP

Then: neither with pure JavaScript (except if you loop through inputs and change their value), JavaScript reset() will 'reset' all form values to their defaults and when you define (in HTML) an input tags 'value' to an string you are defining it as its default value.

lastly, you can either use Ajax and fill inputs with JavaScript (or use Angular) or use JQuery or write a java script function that iterate through input elements of the form and change all their 'value' attributes to an empty string:

Using JQuery: jQuery/Javascript function to clear all the fields of a form or How to reset (clear) form through JavaScript?

Using Javascript:

function resetForm(frm_elements){
for (i = 0; i < frm_elements.length; i++)
{
    field_type = frm_elements[i].type.toLowerCase();
    switch (field_type)
    {
    case "text":
    case "password":
    case "textarea":
    case "hidden":
        frm_elements[i].value = "";
        break;
    case "radio":
    case "checkbox":
        if (frm_elements[i].checked)
        {
            frm_elements[i].checked = false;
        }
        break;
    case "select-one":
    case "select-multi":
        frm_elements[i].selectedIndex = -1;
        break;
    default:
        break;
    }
}
}

Sources: 1 & 2

Hope it helps, ;)

Awesome, thanks for the sources and taking the time to explain the different options I have to use! very useful :D. — Beasted, Apr 26 '15 at 11:31

score -1 · Answer 2 · answered Apr 26 '15 at 00:01

-1

I'd use the attribute 'placeholder' for that need:

<input type="text"' value="" placeholder="<?php echo $info[email] ?>" name="email" id="email">

This way the 'suggestion' is removed as soon as the user enters something else.

answered Apr 26 '15 at 00:01

Jeff

6,895
1
15
33

If the user does not want to change the value, then no value will be posted if you are only using placeholder... – DarkBee Apr 26 '15 at 15:46

Clear form that has been automatically filled in with PHP echo code

2 Answers2