Click here to Skip to main content
15,900,907 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
I m new with jquery.Below is my html table which is in content page.In master page i have also other tables. when i select table cell from 'tableAppointment' by dragging. it selects all table cell within a page. user has restriction to select only second and third cell of current tr.if user selects more than three rows then give alert("time slot not more than 45 minutes.")..How can i do that with jquery.

XML
<script type="text/javascript">

        google.load("jquery", "1.3.2");

        google.setOnLoadCallback(function ()
        {
            var active = false;

            $("#tableAppointment td").mousedown(function (ev)
            {
                active = true;
                $(".csstdhighlight").removeClass("csstdhighlight"); // clear previous selection
                ev.preventDefault(); // this prevents text selection from happening
                $(this).addClass("csstdhighlight");
            });

            $("td").mousemove(function (ev)
            {
                if (active)
                {
                    $(this).addClass("csstdhighlight");
                }
            });

            $(document).mouseup(function (ev)
            {
                active = false;
            });

        });

    </script>

<table id="tableAppointment" cellspacing="1" width="50%" bgcolor="#cccccc" align="center">
            <tr>
                <td bgcolor="#ffffff">
                </td>
                <td class="csstablelisttd">
                </td>
                <td class="csstablelisttd">
                    <b>Patient Name</b>
                </td>
            </tr>
            <tr>
                <td class="csstablelisttd" valign="top" width="70px">
                    8:00AM
                </td>
                <td class="csstablelisttd">
                    0
                </td>
                <td class="csstablelisttd">
                </td>
            </tr>
            <tr>
                <td class="csstablelisttd">
                </td>
                <td class="csstablelisttd">
                    15
                </td>
                <td class="csstablelisttd">
                </td>
            </tr>
            <tr>
                <td class="csstablelisttd">
                </td>
                <td class="csstablelisttd">
                    30
                </td>
                <td class="csstablelisttd">
                </td>
            </tr>
            <tr>
                <td class="csstablelisttd">
                </td>
                <td class="csstablelisttd">
                    45
                </td>
                <td class="csstablelisttd">
                </td>
            </tr>
            <tr>
                <td class="csstablelisttd" valign="top" width="90px">
                    9:00AM
                </td>
                <td class="csstablelisttd">
                    0
                </td>
                <td class="csstablelisttd">
                </td>
            </tr>
            <tr>
                <td class="csstablelisttd">
                </td>
                <td class="csstablelisttd">
                    15
                </td>
                <td class="csstablelisttd">
                </td>
            </tr>
            <tr>
                <td class="csstablelisttd">
                </td>
                <td class="csstablelisttd">
                    30
                </td>
                <td class="csstablelisttd">
                </td>
            </tr>
            <tr>
                <td class="csstablelisttd">
                </td>
                <td class="csstablelisttd">
                    45
                </td>
                <td class="csstablelisttd">
                </td>
            </tr>
        </table>
Posted

1 solution

I think you can do this by using many methods, one of them is to add a simple Attribute to selected cell like "isSelected='true'" by using jquery (like what you have do with CSS)
JavaScript
$(cell).attr("isSelected","true"); //(just example).


than filter by all TD that has isSelected=true if > 3, show your alert message
 
Share this answer
 
v2
Comments
[no name] 10-Jun-12 12:50pm    
code please

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



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900