Click here to Skip to main content
13,248,562 members (57,658 online)
Rate this:
 
Please Sign up or sign in to vote.
how to validate dose not entry duplicate value in second column textbox group by first column textbox.
It Should be result like below.
<pre lang="HTML">
    <table rules="all" class="table table-bordered">
        <tbody>
            <tr>
                <td>
                    <span>1</span><input name="SerialNo1" type="text" value="5">
                </td>
                <td><input name="SerialNo_1" type="text" value="1"></td>
            </tr>
            <tr>
                <td>
                    <span>2</span><input name="SerialNo2" type="text" value="5">
                </td>
                <td><input name="SerialNo_2" type="text" value="2"></td>
            </tr>
            <tr>
                <td>
                    <span>3</span><input name="SerialNo3" type="text" value="5">
                </td>
                <td><input name="SerialNo_3" type="text" value="3"></td>
            </tr>
            <tr>
                <td>
                    <span>4</span><input name="SerialNo4" type="text" value="9">
                </td>
                <td><input name="SerialNo_4" type="text" value="1"></td>
            </tr>
            <tr>
                <td>
                    <span>5</span><input name="SerialNo5" type="text" value="9">
                </td>
                <td><input name="SerialNo_5" type="text" value="2"></td>
            </tr>
            <tr>
                <td>
                    <span>6</span><input name="SerialNo6" type="text" value="10">
                </td>
                <td><input name="SerialNo_6" type="text" value="1"></td>
            </tr>
        </tbody>
    </table>

Please guide me

What I have tried:

I don't have any idea. How to get result.
Posted 9-Nov-17 16:09pm
Updated 9-Nov-17 16:42pm

1 solution

Rate this: bad
 
good
Please Sign up or sign in to vote.

Solution 1

try

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<body>
    <table>
        <tbody>
            <tr>
                <td>
                    <span>1</span><input name="SerialNo1" type="text" value="5">
                </td>
                <td><input name="SerialNo_1" type="text" value="1"></td>
            </tr>
        </tbody>
    </table>
    <script>
        var left = document.getElementsByName('SerialNo1')[0];
        var right = document.getElementsByName('SerialNo_1')[0];
        left.addEventListener('blur', checkEqual);
        right.addEventListener('blur', checkEqual);
        function checkEqual(e) {
            if (left.value == right.value) {
                alert('both value should not be same,Please enter different value!');
                e.target.value = '';
                e.target.focus();
                return
            }
        }
    </script>
</body>
</html>


Demo: Plunker[^]
  Permalink  
v2

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
Top Experts
Last 24hrsThis month


Advertise | Privacy |
Web01 | 2.8.171114.1 | Last Updated 9 Nov 2017
Copyright © CodeProject, 1999-2017
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100