I'm a beginner web developer who is currently putting together a dynamic website that will update an teacher's information in a MySQL database (such as their name, employee number, salary etc.) When a user opens this update form, I want them to see all the information as it exists in the database as the starting values of the inputs. I’ve run into trouble achieving this with my form’s numerical inputs that will alter a primarily numerical value that has a single character preceding it (like $50.00 or T1234). I don’t need the form to input that character, I was just hoping to show it within the input field before the user changes the number. Is there a way to accomplish this?

This a simplified version of my from (it’s very basic)

<form>

    <div>
        <label>Employee Number:</label>
        <input type="number" name="EmployeeNumber" id="EmployeeNumber" value="T134"/>
    </div>

    <div>
        <label>Salary:</label>
        <<input type="number" name="Salary" id="Salary" step='0.01' min="0" value="$50.25" />
    </div>

    <div>
        <input type="submit" value="Update Teacher" />
    </div>

</form>

CodePudding user response：

Turn off the border around the input, then wrap the input and the extra character in an additional div, should help with the layout!