Show Only Numeric keypad in your Application

Here, I will show you how to display only numeric keypad in page.

Sometimes people face difficulty to type string like you want to enter cell number but there is display one character keyboard.

So if you have field of cell number than display only numeric keypad. i will saw you how to display only numeric keypad in page.



There is three ways as per your platform like you are working on IOS than the way is:

1. For IOS (for numeric keypad) your text box
   
   your text box name.Attributes.Add("type", "tel");
    
2. For android (for numeric keypad) your text box
   
   name.Attributes.Add("type", "Number");
    
3. For email keypad
   
   name.Attributes.Add("type", "Email");

But you are working in c#.net 3.5 than this type is doesn't work.

Solution

In below code you have used TYPE like if you want to display keypad in IOS than Type='tel' but if you want to display in android than type='Number'.for more see below example:

Collapse |

<table>

    <%--For IOS--%>

    <tr>

        <td>

            Mobile IOS

        </td>

        <td>

            <div style="display: none">

                <asp:textbox id="txtMobileIOS" runat="server" width="30px" text="0">

</asp:textbox>

            </div>

            <input onblur="document.getElementById('<%=txtMobileIOS.ClientID %>').value = this.value"

                type="tel" size="1" value="0" />

        </td>

    </tr>

    <%--For Android--%>

    <tr>

        <td>

            Mobile Android

        </td>

        <td>

            <div style="display: none">

                <asp:textbox id="txtMobileAndroid" runat="server" width="30px" text="0"></asp:textbox>

            </div>

            <input onblur="document.getElementById('<%=txtMobileAndroid.ClientID %>').value = this.value"

                type="Number" size="1" value="0" />

        </td>

    </tr>

    <%--For Email--%>

    <tr>

        <td>

            Email

        </td>

        <td>

            <div style="display: none">

                <asp:textbox id="txtEmail" runat="server" width="30px" text="0"></asp:textbox>

            </div>

            <input onblur="document.getElementById('<%=txtEmail.ClientID %>').value = this.value"

                type="Email" size="1" value="0" />

        </td>

    </tr>

</table>  

So, if you want to saw a keypad in replacement of full keypad than try this.