i want to add my dynamically created table rows.. to the database .. however i cant add it .. badly needed your help guys... thanks in advance

heres my code:

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

if(!isset($_SESSION['user_id']))
{
    header('Location: login.php');
}
$user_id = $_SESSION['user_id'];
?>
<?php
$date = $_POST['date'];

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

    if($date != '')
    {

        $desc = $_POST['desc'];
        $unit = $_POST['unit'];
        $qty = $_POST['qty'];

        for ($i=0; $i<count($desc); $i++) 
        {
            $ins_query = mysql_query("INSERT INTO t_request (`desc`) VALUES ('$desc [$i]')");
        }


        $afe = mysql_affected_rows();

        if($afe > 0)
        {
            echo "<script>alert('Request Successfully Added')</script>";
            echo "<script>window.location.replace('s_user_view.php')</script>";

            }
        else
        {
            echo mysql_error();
        }
    }
    else
    {
        echo "<script>alert('Please Complete Details!')</script>";
        echo "<script>window.location.replace('t_requisition.php')</script>";

    }
}
?>

<!DOCTYPE HTML>
<html>
<head>
<?php include('head.php'); ?>

<link rel="stylesheet" type="text/css" media="all" href="jsdatepick-calendar/jsDatePick_ltr.min.css" />
<script type="text/javascript" src="jsdatepick-calendar/jsDatePick.min.1.3.js"></script>
<script type="text/javascript">
    window.onload = function(){
        new JsDatePick({
            useMode:2,
            target:"inputField",
            dateFormat:"%Y-%m-%d",
            weekStartDay:0
        });
        new JsDatePick({
            useMode:2,
            target:"inputField2",
            dateFormat:"%Y-%m-%d",
            weekStartDay:0
        });
    };
</script>

    <SCRIPT language="javascript">
        function addRow(tableID) {

            var table = document.getElementById(tableID);

            var rowCount = table.rows.length;
            var row = table.insertRow(rowCount);

            var cell1 = row.insertCell(0);
            var element1 = document.createElement("input");
            element1.type = "checkbox";
            cell1.appendChild(element1);

            var cell2 = row.insertCell(1);
            var element1 = document.createElement("input");
            element1.type = "text";
            element1.name = "unit[]";
            element1.style.border = "0px solid #000000";
            cell2.appendChild(element1);

            var cell3 = row.insertCell(2);
            var element2 = document.createElement("input");
            element2.type = "text";
            element2.name = "desc[]";
            element2.style.border = "0px solid #000000";
            element2.size = "20";
            cell3.appendChild(element2);

            var cell4 = row.insertCell(3);
            var element1 = document.createElement("input");
            element1.type = "text";
            element1.size = "10";
            element1.name = "qty[]";
            element1.style.border = "0px solid #000000";            
            cell4.appendChild(element1);

            var cell5 = row.insertCell(4);
            var element1 = document.createElement("input");
            element1.type = "text";
            element1.size = "10";
            element1.name = "rec_qty[]";
            element1.style.border = "0px solid #000000";
            cell5.appendChild(element1);

            var cell6 = row.insertCell(5);
            var element1 = document.createElement("input");
            element1.type = "text";
            element1.name = "remarks[]";
            element1.style.border = "0px solid #000000";
            cell6.appendChild(element1);

        }

        function deleteRow(tableID) {
            try {
            var table = document.getElementById(tableID);
            var rowCount = table.rows.length;

            for(var i=0; i<rowCount; i++) {
                var row = table.rows[i];
                var chkbox = row.cells[0].childNodes[0];
                if(null != chkbox && true == chkbox.checked) {
                    table.deleteRow(i);
                    rowCount--;
                    i--;
                }


            }
            }catch(e) {
                alert(e);
            }
        }

    </SCRIPT>
<style type="text/css" media="print">
@media print {
.displaycontrols {
display: none;
}
</style>
</head>

<body>
<!-- Start: Page Wrap -->
<div>
<!-- Header Grid Container: Start -->
    <div class="grid_24" >

        <?php include('header.php') ?>

        <!-- Breadcrumb Bar: Start -->
        <div id="breadcrumb">

            <!-- Breadcrumb: Start -->
            <ul class="left">
                <li class="icon home"><a href="index.php" class="" title="Home">Home</a></li>
                <!-- <li class="icon point_right"><a href="#">Dashboard</a></li> -->
            </ul>
            <!-- Breadcrumb: End -->

        </div>
        <!-- Breadcrumb Bar: End -->

<!-- *** START CODING HERE *** -->
<div class="grid_24" >
    <!-- Box Header: Start --><!-- Box Header: End -->

                <div class="box_top">
              <h2 class="icon pages">Supply Requisition</h2>       
                </div>

    <!-- Box Content: Start -->

  <form method="post" class="form">
<div class="box_content padding">  
<table width="800" border="2">
  <tr>
    <td colspan="3"><p align="center"><strong>REQUISITION  AND ISSUE SLIP</strong><br />
    <strong>Polytechnic  University of the Philippines</strong></p></td>
  </tr>
  <tr>
    <td width="300"><strong>Division:  Commonwealth</strong></td>
    <td width="308"><strong>Responsibilty  Center RIS No.</strong></td>
    <td width="279"><strong>Date: 
        <input type="text" name="date" id="inputField"  style="border: 0px solid #000000;"> 
    </strong></td>
  </tr>
  <tr>
    <td><strong>Office:</strong></td>
    <td><strong>Code:</strong></td>
    <td><strong>Date: 

    </strong></td>
  </tr>
  <tr>
    <td colspan="3"><strong><p align="center">Requisition
    </p>
    </strong></td>
  </tr>
</table>
<table width="800" height="77" border="2" id="dataTable">
  <tr>
    <th width="100" scope="col"><strong>
    <div class=displaycontrols>
      <input type="button" value="+" onClick="addRow('dataTable')" />
      <input type="button" onClick="deleteRow('dataTable')" value="-" />
    </div>
    </strong></th>
    <th width="238" height="5" scope="col">Unit</th>
    <th width="238" height="5" scope="col">Description</th>
    <th width="238" height="5" scope="col">Quantity Units</th>
    <th width="124" height="5" scope="col">Quantity</th>
    <th width="253" height="5" scope="col">Remarks</th>
    </tr>
  <div id="tableID">
  <tr valign="top">

    <td><input type="checkbox" name="chk" id="checkbox"></td>
    <td><input type="text" name="unit[]" id="unit" size="20" style="border: 0px solid #000000;"></td>
    <td><input type="text" name="desc[]" id="desc" size="20" style="border: 0px solid #000000;"></td>
    <td><input type="text" name="qty[]" id="qty" size="10" style="border: 0px solid #000000;"></td>
    <td align="center">&nbsp;</td>
    <td align="center"><label>
      <input name="remarks[]" type="text" id="remarks" size="20" style="border: 0px solid #000000;">
    </label></td>
    </div>
  </tr>
</table>
<table width="800" border="2">
  <tr>
    <td height="5">Noted  By:</td>
  </tr>

  <tr>
    <td>Purpose:</td>
  </tr>
</table>
<table width="800" border="2">
  <tr>
    <th width="97" scope="col">&nbsp;</th>
    <th width="164" scope="col">Requested by</th>
    <th width="171" scope="col">Approve by</th>
    <th width="167" scope="col">Issued by</th>
    <th width="165" scope="col">Received by</th>
  </tr>
  <tr>
    <td><strong>Signature:</strong></td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td><strong>Printed Name:</strong></td>
    <td align="center"><input type="text" name="textfield" id="textfield" style="border: 0px solid #000000;"></td>
    <td align="center">&nbsp;</td>
    <td align="center">&nbsp;</td>
    <td align="center"><input type="text" name="textfield4" id="textfield4" style="border: 0px solid #000000;"></td>
  </tr>
  <tr>
    <td><strong>Designation:</strong></td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>

</table>
<p>
<div class=displaycontrols>
            <button name="submit" type="submit" class="field" id="submit" value="Submit">Submit</button>
</div>
</p>
  </div>
  </form>

    </div>
    <!-- Box Content: End -->

<!-- 100% Box Grid Container: End -->
<!-- *** END CODING HERE *** -->

<!-- Footer Grid: Start -->
<!-- Footer Grid: End -->
    </div>
<!-- Footer Grid: End -->
</div>
<!-- End: Page Wrap -->

    <!-- jQuery libs - Rest are found in the head section (at top) -->
    <script type="text/javascript" src="js/jquery.visualize-tooltip.js"></script>
    <script type="text/javascript" src="js/jquery-animate-css-rotate-scale.js"></script>
    <script type="text/javascript" src="js/jquery-ui-1.8.13.custom.min.js"></script>
    <script type="text/javascript" src="js/jquery.poshytip.min.js"></script>
    <script type="text/javascript" src="js/jquery.quicksand.js"></script>
    <script type="text/javascript" src="js/jquery.dataTables.min.js"></script>
    <script type="text/javascript" src="js/jquery.facebox.js"></script>
    <script type="text/javascript" src="js/jquery.uniform.min.js"></script>
    <script type="text/javascript" src="js/jquery.wysiwyg.js"></script>
    <script type="text/javascript" src="js/syntaxHighlighter/shCore.js"></script>
    <script type="text/javascript" src="js/syntaxHighlighter/shBrushXml.js"></script>
    <script type="text/javascript" src="js/syntaxHighlighter/shBrushJScript.js"></script>
    <script type="text/javascript" src="js/syntaxHighlighter/shBrushCss.js"></script>
    <script type="text/javascript" src="js/syntaxHighlighter/shBrushPhp.js"></script>
    <script type="text/javascript" src="js/fileTree/jqueryFileTree.js"></script> <!-- Added in 1.2 -->

    <!-- jQuery Customization -->
    <script type="text/javascript" src="js/custom.js"></script>

</body>
</html>

Is it not working? if so then what error you are facing?

what you can do is to make new table rows with unique ids which you will use to access them.

following is a basic idea that i have used in a project:

<input type="hidden" value="0" id="numOfRows" />

<table id="table">.....</table>

if(button is pressed)
{
update value of input numOfRows by 1

add element to table with id as getElementId("numOfRows").value()

}
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.