at first the validation is working but when i added some design the validation is not working anymore help pls can you check my code

<?php
include('conn.php');
session_start();
if (!isset($_SESSION['Username'])){
header('location:index.php');
}
//
?>

<html>
<head>
<title>Delivery</title>
        <link rel="stylesheet" type="text/css" href="style.css" />
        <link rel="shortcut icon" href="favicon.gif">
        <script type="text/javascript" src="js/jquery.js"></script> 
        <script type="text/javascript" src="js/jquery.validate.js"></script> 
        <script language="javascript" src="js/cal2.js"></script>
        <script language="javascript" src="js/cal_conf2.js"></script>
        <script src="js/margz.js" type="text/javascript" charset="utf-8"></script>
        <script src="js/application.js" type="text/javascript" charset="utf-8"></script> 

        <script type="text/javascript">


        function Price(data) {

        document.getElementById("productprice").value = data.options[data.selectedIndex].id;

        newValue = (parseInt(document.form.bottles.value) * parseInt(document.form.price.value)); 
        document.form.total.value = newValue;

        }

        function computetotal() {

        newValue = (parseInt(document.form.price.value) * parseInt(document.form.deliver.value)); 
        document.form.total.value = newValue;

        }


        function computecustody() {

        newValue = (parseInt(document.form.deliver.value) - parseInt(document.form.return.value)); 
        document.form.custody.value = newValue;

        }

        function computecharge() {

        newValue = (parseInt(document.form.cash.value) - parseInt(document.form.total.value)); 
        document.form.charge.value = newValue;

        }



            $('document').ready(function(){

            $('#form').validate({
                    rules:{
                        "tror":{
                            required:true,
                            number:true,
                            maxlength:40
                        },

                        "name":{
                            maxlength:40
                        },
                        "price":{
                            required:true,
                            number:true
                        },
                        "deliver":{
                            required:true,
                            number:true
                        },
                        "return":{
                            required:true,
                            number:true
                        },
                        "total":{
                            required:true,
                            number:true
                        },
                        "date":{
                            required:true
                        }},

                    messages:{
                        "tror":{
                            required:"tror field is required",
                            number:"Please enter a valid number"
                        },
                        "price":{
                            required:"Price field is required select product first",
                            number:"Please enter a valid number"
                        },
                        "deliver":{
                            required:"Deliver field is required",
                            number:"Please enter a valid number"
                        },
                        "return":{
                            required:"Return field is required",
                            number:"Please enter a valid number"
                        },
                        "total":{
                            required:"Total field is required",
                            number:"Total must be a valid number"
                        }},

            })

        });
        </script> 
        <style type="text/css">
        .error{
        font-family:Arial, Helvetica, sans-serif;
        color:#FF0000;
        font-size:10px;
        padding-left:10px;
        }
        </style>
</head>

<?PHP

$sql = mysql_query('SELECT Product,Quantity,Price  FROM Inventory ORDER BY Price');
$product = array();
while ($row = mysql_fetch_array($sql)){
    $product[] = $row;
}
?>


<body>

<div id="main_container">
    <div id="header">
        <div class="logo"><img src="images/logo.png" width="150px" height="100px" /></div>      
    </div>
        <div class="menu">
            <ul>                                                                         
                <li><a href="inventory.php">Inventory</a></li>
                <li><a href="walkin.php">Walk In</a></li>
                <li><a href="dealer.php">Dealer</a></li>
                <li class="selected"><a href="delivery.php">Delivery</a></li>
                <li><a href="logout.php">Log Out</a></li>
                <li><input type="text" style="height:42px;" name="filter" placeholder="Search" value="" id="filter" /></li>
            </ul>
        </div>

    <div class="center_content">

    <div class="title">DELIVERY</div>

<form name="form" id="form" action="" method="post">
<br />
<table width="449" border="0">
<thead>
  <tr>
    <td width="107">TR/OR: </td>
    <td width="326"><input type="text" name="tror" maxlength="4" /></td>
    </tr>
  <tr>
    <td> Customer's Name: </td>
    <td><input type="text" name="name" maxlength="40" /></td>
    </tr>
      <tr>
   <td> Product: </td>
    <td>
    <select name="product" onchange="Price(this)">
    <option value="" disabled="disabled" selected="selected">Please select a product</option>
    <?php
    foreach ($product as $product) {
    ?>
    <option value="<?php echo $product['Product']?>" id="<?php echo $product['Price']?>"><?php echo $product['Product'] . " Qty: " . $product['Quantity']?></option>
    <?php
    }
    ?>
    </select>
    </td>
    </tr>
    <tr>
  <tr>
    <td> Price: </td>
    <td><input id="productprice" onchange="computetotal" readonly type="text" name="price" /></td>
    </tr>
  <tr>
    <td> Deliver: </td>
    <td><input type="text" onchange="computecustody();computetotal();" name="deliver" /></td>
    </tr>
  <tr>
    <td> Return: </td>
    <td><input type="text" onchange="computecustody();computetotal();" name="return" /></td>
    </tr>
  <tr>
    <td> Custody: </td>
    <td><input readonly type="text" name="custody" /></td>
    </tr>
      <tr>
    <td> Total: </td>
    <td><input readonly type="text" onchange="computecharge()" name="total" /></td>
    </tr>
    <tr>
    <td> Cash: </td>
    <td><input type="text" onchange="computecharge()" name="cash" /></td>
    </tr>
    <tr>
    <td> Charge: </td>
    <td><input readonly type="text" name="charge" /></td>
    </tr>
  <tr>
    <td></td>
    <td>
    <?php
    $date = date("Y/m/d");
    echo "<input type='text' name='date' hidden readonly value='$date' />";
    ?>
    </td>
    </tr>
    <tr>
    <td></td><td><input type="submit" name="Add" value="Add"></td>
    </tr>
</thead>
</table>
</form>


<?php
include('conn.php');

if (isset($_POST['Add'])){

$tror=$_POST['tror'];
$name=$_POST['name'];
$product=$_POST['product'];
$price=$_POST['price'];
$deliver=$_POST['deliver'];
$return=$_POST['return'];
$custody=$_POST['custody'];
$cash=$_POST['cash'];
$charge=$_POST['charge'];
$date=$_POST['date'];

mysql_query("insert into delivery (TrOr,Customers_Name,Product,Price,Deliver,xReturn,Custody,Cash,Charge,Date)
            values('$tror','$name','$product','$price','$deliver','$return','$custody','$cash','$charge','$date') ; SELECT Quantity - $deliver + $return from Inventory WHERE TrOr='$tror';");
}
?>



<table>
<thead>
<tr>
<th>TR/OR</th>
<th>Customer's Name</th>
<th>Product</th>
<th>Price</th>
<th>Deliver</th>
<th>Return</th>
<th>Custody</th>
<th>Cash</th>
<th>Charge</th>
<th>Delete</th>
<th>Update</th>
</thead>
</tr>
<?php

$sql = "select * from delivery" ;
$select = mysql_query($sql);
while($rows = mysql_fetch_assoc($select)){
?>
<tr>
<td><?php echo $rows['TrOr'] ; ?></td>
<td><?php echo $rows['Customers_Name'] ; ?></td>
<td><?php echo $rows['Product'] ; ?></td>
<td><?php echo $rows['Price'] ; ?></td>
<td><?php echo $rows['Deliver'] ; ?></td>
<td><?php echo $rows['xReturn'] ; ?></td>
<td><?php echo $rows['Custody'] ; ?></td>
<td><?php echo $rows['Cash'] ; ?></td>
<td><?php echo $rows['Charge'] ; ?></td>
<td><a href="deliverydelete.php<?php echo '?tror='.$rows['TrOr']; ?> ">Delete</a></td>
<td><a href="deliveryupdate.php<?php echo '?tror='.$rows['TrOr']; ?>">Edit</a></td>
</tr>


<?php 

}?>
</table>

</div>    


    <div id="footer">                                              
        <div class="left_footer">Copyright Margz 2013</div>
    </div>



</div>
<!-- end of main_container -->

</body>
</html>

when i added some design the validation is not working anymore

What exactly is no longer working, and how did it work before?

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.