Q:

Jquery draggable not working in my code

i am trying to create a page here with a table having the property of being dragged. the code is a bit messy but here it is:
<!DOCTYPE html>
<head>

    <link rel="stylesheet" type="text/css" href="css/style.css" />
    <link rel="stylesheet" type="text/css" href="css/menu.css" />
    <link rel="stylesheet" type="text/css" href="css/bootstrap.css" />
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
    <link rel="stylesheet" type="text/css" href="css/bootstrap-theme.css" />
    <link rel="stylesheet" type="text/css" href="css/bootstrap-theme.min.css" />
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
    <link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
    <script type="text/javascript">
      $(document).ready(function(){
        $(".smsSecond").draggable();
      });
    </script>

</head>
<body>
    <div id="top">
        <div id="topLogo">
            <a href="#"><img src="images/logo_big.png"  height="50" width="310"/></a>
        </div>
        <div id="topLogoR">
            <img src="images/right logo.png"  height="60" width="300"/><br/>
            <font color="#335599">Logged in as XXXXXXXXXX: </font>
            <select>
                <option value="online"><font color="#335599">Online</font></option>
                <option value="offline"><font color="#335599">Offline</font></option>
                <option value="away"><font color="#335599">Away</font></option>
                <option value="busy"><font color="#335599">Busy</font></option>
                <option value="others"><font color="#335599">Others</font></option>
            </select></font>
        </div>
    </div>

    <div id="topnav">
        <ul id="nav">

    <li><a href="#">MENU 1</a>
        <!--ul>
            <li><a href="#">MENU 1-1</a></li>
            <li><a href="#">MENU 1-1</a></li>
        </ul-->
    </li>
    <li><a href="#">MENU 2</a>
        <!--ul>
            <li><a href="#">MENU 2-1</a></li>
            <li><a href="#">MENU 2-2</a></li>                       
        </ul-->
    </li>
    <li><a href="#">MENU 3</a><span class="rarrow"> &#9660; </span>
        <ul>
            <li><a href="#">MENU 3-1</a></li>
            <li><a href="#">MENU 3-2</a></li>                       
        </ul>
    </li>
     <li><a href="#">MENU 4</a><span class="rarrow"> &#9660; </span>
        <ul>
            <li><a href="#">MENU 4-1</a></li>
            <li><a href="#">MENU 4-2</a><!--span class="rarrow"> &#9654; </span-->
                <!--ul>
                    <li><a href="#">MENU 4-2-1</a></li>
                    <li><a href="#">MENU 4-2-2</a></li>
                    <li><a href="#">MENU 4-2-3</a></li>
                    <li><a href="#">MENU 4-2-4</a></li>
                </ul-->
            </li>                       
        </ul>
    </li>   

    <li><a href="#">MENU 5</a><span class="rarrow"> &#9660; </span>
        <ul>
            <li><a href="#">MENU 5-1</a></li>
            <li><a href="#">MENU 5-2</a><!--span class="rarrow"> &#9654; </span-->
                <!--ul>
                    <li><a href="#">MENU 5-2-1</a></li>
                    <li><a href="#">MENU 5-2-2</a></li>
                    <li><a href="#">MENU 5-2-3</a></li>
                    <li><a href="#">MENU 5-2-4</a></li>
                </ul-->
            </li>                       
        </ul>
    </li>   

    <li><a href="#">MENU 6</a><span class="rarrow"> &#9660; </span>
        <ul>
            <li><a href="#">MENU 6-1</a></li>
            <li><a href="#">MENU 6-2</a><!--span class="rarrow"> &#9654; </span-->
                <!--ul>
                    <li><a href="#">MENU 6-2-1</a></li>
                    <li><a href="#">MENU 6-2-2</a></li>
                    <li><a href="#">MENU 6-2-3</a></li>
                    <li><a href="#">MENU 6-2-4</a></li>
                </ul-->
            </li>                       
        </ul>
    </li>

    <li><a href="#">MENU 7</a><span class="rarrow"> &#9660; </span>
        <ul>
            <li><a href="#">MENU 7-1</a></li>
            <li><a href="#">MENU 7-2</a><!--span class="rarrow"> &#9654; </span-->
                <!--ul>
                    <li><a href="#">MENU 7-2-1</a></li>
                    <li><a href="#">MENU 7-2-2</a></li>
                    <li><a href="#">MENU 7-2-3</a></li>
                    <li><a href="#">MENU 7-2-4</a></li>
                </ul-->
            </li>                       
        </ul>
    </li>   

    <li><a href="#">MENU 8</a><span class="rarrow"> &#9660; </span>
        <ul>
            <li><a href="#">MENU 8-1</a></li>
            <li><a href="#">MENU 8-2</a><!--span class="rarrow"> &#9654; </span-->
                <!--ul>
                    <li><a href="#">MENU 8-2-1</a></li>
                    <li><a href="#">MENU 8-2-2</a></li>
                    <li><a href="#">MENU 8-2-3</a></li>
                    <li><a href="#">MENU 8-2-4</a></li>
                </ul-->
            </li>                       
        </ul>
    </li>   

    <li><a href="#">MENU 9</a><span class="rarrow"> &#9660; </span>
        <ul>
            <li><a href="#">MENU 9-1</a></li>
            <li><a href="#">MENU 9-2</a><!--span class="rarrow"> &#9654; </span-->
                <!--ul>
                    <li><a href="#">MENU 9-2-1</a></li>
                    <li><a href="#">MENU 9-2-2</a></li>
                    <li><a href="#">MENU 9-2-3</a></li>
                    <li><a href="#">MENU 9-2-4</a></li>
                </ul-->
            </li>                       
        </ul>
    </li>   

    <li><a href="#">MENU 10</a><span class="rarrow"> &#9660; </span>
        <ul>
            <li><a href="#">MENU 10-1</a></li>
            <li><a href="#">MENU 10-2</a><!--span class="rarrow"> &#9654; </span>
                <ul>
                    <li><a href="#">MENU 10-2-1</a></li>
                    <li><a href="#">MENU 10-2-2</a></li>
                    <li><a href="#">MENU 10-2-3</a></li>
                    <li><a href="#">MENU 10-2-4</a></li>
                </ul-->
            </li>                       
        </ul>
    </li>

    <li><a href="#">MENU 11</a><span class="rarrow"> &#9660; </span>
        <ul>
            <li><a href="#">MENU 11-1</a></li>
            <li><a href="#">MENU 11-2</a><!--span class="rarrow"> &#9654; </span>
                <ul>
                    <li><a href="#">MENU 11-2-1</a></li>
                    <li><a href="#">MENU 11-2-2</a></li>
                    <li><a href="#">MENU 11-2-3</a></li>
                    <li><a href="#">MENU 11-2-4</a></li>
                </ul-->
            </li>                       
        </ul>
    </li>   

    <li><a href="#">MENU 12</a><span class="rarrow"> &#9660; </span>
        <ul>
            <li><a href="#">MENU 12-1</a></li>
            <li><a href="#">MENU 12-2</a><!--span class="rarrow"> &#9654; </span>
                <ul>
                    <li><a href="#">MENU 12-2-1</a></li>
                    <li><a href="#">MENU 12-2-2</a></li>
                    <li><a href="#">MENU 12-2-3</a></li>
                    <li><a href="#">MENU 12-2-4</a></li>
                </ul-->
            </li>                       
        </ul>
    </li>

    </ul>

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript" charset="utf-8"></script>    
    <script src="http://jquery-ui.googlecode.com/svn/tags/latest/ui/jquery.effects.core.js" type="text/javascript"></script>
    <script type="text/javascript" src="js/scripts.js"></script>

   </div>

   <div id="page">
    <div id="leftcolumn">
        <p class="form">
            <form class="form-inline" role="form">

                <div class="form-group">
                    <label class="sr-only" for="ticket">Ticket</label>
                    <input type="text" class="form-control" id="exampleInputPassword2" placeholder="TICKET">
                </div>
                <br/>
                <br/>
                <!--button type="submit" class="btn btn-success">SUBMIT</button-->

                <!--grey button for grey template-->
                <button class="btn btn-default" type="submit">SUBMIT</button>

            </form>
        </p>
        <p class="form">
            <form class="form-inline" role="form">

                <div class="form-group">
                    <label class="sr-only" for="ticket">Ticket</label>
                    <input type="text" class="form-control" id="exampleInputPassword2" placeholder="TICKET">
                </div>
                <br/>
                <br/>
                <!--button type="submit" class="btn btn-success">SUBMIT</button-->
                <button class="btn btn-default" type="submit">SUBMIT</button>

            </form>
        </p>
        <p class="form">
            <form class="form-inline" role="form">

                <div class="form-group">
                    <label class="sr-only" for="ticket">Ticket</label>
                    <input type="text" class="form-control" id="exampleInputPassword2" placeholder="TICKET">
                </div>
                <br/>
                <br/>
                <!--button type="submit" class="btn btn-success">SUBMIT</button-->
                <!--button type="submit" class="btn btn-primary">SUBMIT</button-->
                <!--a href="#" class="btn btn-default btn-lg active" role="button">SUBMIT</a-->
                <button class="btn btn-default" type="submit">SUBMIT</button>

            </form>
        </p>

    </div>

    <div class="maincol">   
        <div id="inner">
        <div class="t"> 

            <form class="form-inline" role="form">

                <div class="form-group">
                    <label class="sr-only" for="ticket">Ticket</label>
                    <input type="text" class="form-control" id="exampleInputPassword2" placeholder="TICKET">
                </div>
                <br/>
                <br/>
                <!--button type="submit" class="btn btn-success">SUBMIT</button-->
                <!--button type="submit" class="btn btn-primary">SUBMIT</button-->
                <!--a href="#" class="btn btn-default btn-lg active" role="button">SUBMIT</a-->
                <button class="btn btn-default" type="submit">SUBMIT</button>

            </form>
            <br/>
    <table class="smsSecond"><!--bgcolor="#4ab54d"><class="smsSecond"--     this is td bgcolor: bgcolor="#4ab54d"-->
        <tr>
             <td colspan="2" width="auto" align="center">Ticket Info</td>
        </tr>

        <!--odd row-->
        <tr align="center"><!-- style="color: #000000; font-size: 12px;"-->
            <td>
                Ticket number
            </td>
            <td>
                HFK-864-69976
            </td>
        </tr>

        <!--even row-->
        <tr align="center"><!--style="color: #000000; font-size: 15px; background-color: #FFFFFF" --><!--background-color: #A4EAF6-->
            <td>
                Department
            </td>
            <td>
                Support
            </td>
        </tr>

        <!--odd row-->
        <tr align="center">
            <td>
                Priority
            </td>
            <td>
                P3-Normal
            </td>
        </tr>

        <!--even row-->
        <tr align="center">
            <td>
                Open Date and Time
            </td>
            <td>
                2011-02-28 21:24:01          
            </td>
        </tr>

        <!--odd row-->
        <tr align="center">
            <td>
                Close Date and Time
            </td>
            <td>
                2011-02-28 21:24:01
            </td>
        </tr>

        <!--even row-->
        <tr align="center">
            <td>
                Total Time
            </td>
            <td>
                00:03:09
            </td>
        </tr>

        <!--odd row-->
        <tr align="center">
            <td>
                Ticket Spent
            </td>
            <td>
                00:02:00
            </td>
        </tr>

        <!--even row-->
        <tr align="center">
            <td>
                No. of staff worked
            </td>
            <td>
                2
            </td>
        </tr>

        <!--odd row-->
        <tr align="center">
            <td>
                Ticket Status
            </td>
            <td>
                Closed
            </td>
        </tr>

        <!--even row-->
        <tr align="center">
            <td>
                SLA
            </td>
            <td>
                Yes
            </td>
        </tr>

        <!--odd row-->
        <tr align="center">
            <td>
                Type
            </td>
            <td>
                Issue
            </td>
        </tr>

        <!--even row-->
        <tr align="center">
            <td>
                Red Flag
            </td>
            <td>
                0
            </td>
        </tr>

        <!--odd row-->
        <tr align="center">
            <td>
                Yellow Flag
            </td>
            <td>
                0
            </td>
        </tr>

        <!--even row-->
        <tr align="center">
            <td>
                Orange Flag
            </td>
            <td>
                0
            </td>
        </tr>

        <!--odd row-->
        <tr align="center">
            <td>
                Closed by
            </td>
            <td>
                Harsha p
            </td>
        </tr>
    </table>

    </div>
    </div>

    </div>

    </div>      

</body>
</html>

the table with the class .smsSecond needs to be dragbale, which doen not seem to work. please help.

A:

Your code seems to work fine. Does it work for you in this example?
Update:
Looking at updated your code, the problem is you are using two different versions of jquery.
First here:  
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

Then later:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript" charset="utf-8"></script> 
<script src="http://jquery-ui.googlecode.com/svn/tags/latest/ui/jquery.effects.core.js" type="text/javascript"></script>

Get rid of the script tags for jquery 1.4 

