for input type="number" how to set default value to 0

Question

For a textbox that accept numbers as shown below, how can the default value be set to 0?

<input name="smtpPort" type="number" id="smtpPort" size="30" maxlength="50" class="input-full" tabindex="4" value="{{model.PortNumber}}">

Though the value in DB is null, it still shows 0 in textbox.

Any help would be appreciated.

Answer 1

HTML attribute to set a default value is value :

<input type="number" value="1">

You're setting this default value to null , and nothing (in HTML) can change it to zero (or anything else).
You must fix the value in your database, or in your template engine (something like {{model.PortNumber || 0}} ).

At least, you can force your field to be filled with required attribute:

<input type="number" required value="">

Answer 2

<input name="smtpPort" type="number" id="smtpPort" size="30" maxlength="50" class="input-full" tabindex="4" value="{{model.PortNumber || 0}}">

我假设您正在使用AngularJS。

Answer 3

The correct way should be to fix the value before sending to template. However, if you still insist on doing it in frontend, you can also try using || operator in your AngularJS frontend.

<input name="smtpPort" type="number" id="smtpPort" size="30" maxlength="50" class="input-full" tabindex="4" value="{{model.PortNumber || 0}}">