Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
​
    <title></title>
    <script type="text/javascript" language="javascript">
​
    $(document).ready(function() {
    $('#btnSubmit').click(function(e) {
        var isValid = true;
        $('input[type="text"].required').each(function() {
            if ($.trim($(this).val()) == '') {
                isValid = false;
                $(this).css({
                    "border": "1px solid red",
                    "background": "#FFCECE"
                });
            }
            else {
                $(this).css({
                    "border": "",
                    "background": ""
                });
            }
        });
        if (isValid == false) 
            e.preventDefault();
        else 
            alert('Thank you for submitting');
    });
});
    </script>
</head>
<body>
    <table>
        <tr>
            <td>
                First Name:
            </td>
            <td>
                <input type='text' id='txtFName' />
            </td>
        </tr>
        <tr>
            <td>
                Last Name:
            </td>
            <td>
                <input type='text' id='txtLName' />
            </td>
        </tr>
        <tr>
            <td>
                Age:
            </td>
            <td>
                <input type='text' id='txtAge' />
            </td>
        </tr>
        <tr>
            <td>
                Email:
            </td>
            <td>
                <input type='text' id='txtEmail' />
            </td>
        </tr>
        <tr>
            <td colspan="2" style='text-align: center;'>
                <input type="button" id="btnSubmit" value=" Submit " />
            </td>
        </tr>
    </table>
</body>
</html>
​
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers