表格由jquery创建的输入文本如何保存在mysql数据库中

时间:2015-02-07 09:01:39

标签: javascript php jquery mysql css

请帮我如何在我的动态表中保存输入数据的mysql数据库。

这是html文件。

  

的index.html:

<!DOCTYPE html>
<html>

<head>

  <meta charset="UTF-8">

  <title>CodePen - Dynamic Table</title>

  <link href="dynamictable_css/font-awesome.min.css" rel="stylesheet">



</head>

<body>

  <div id="main">
  <h1>Data Table</h1>
  <table id="data" class="data-table data-table-horizontal data-table-highlight">
    <tbody>
      <tr>
        <td><input type="text" /></td><td><input type="text" /></td><td><input type="text" /></td>
        <td><input type="text" /></td>
        <td><input type="text" /></td>
        <td><a type="button" value="Delete" onclick="deleteRow(this)"><i class="fa fa-trash-o fa-fw"></i></a></td>
      </tr>

  </table>
  <div class="pull-right">
    <input type="button" value="Add" class="top-buffer" onclick="addRow('data')" />
  </div>
</div>

  <script src="dynamictable_js/index.js"></script>

</body>

</html>

这是javascript。

  

index.js:

function addRow(tableID) {
  var table = document.getElementById(tableID);
  var rowCount = table.rows.length;
  var row = table.insertRow(rowCount);
  var colCount = table.rows[0].cells.length;

  for(var i=0; i<colCount; i++) {
    var newRow = row.insertCell(i);

    newRow.innerHTML = table.rows[0].cells[i].innerHTML;
    newRow.childNodes[0].value = "";
  }
}

function deleteRow(row) {
  var table = document.getElementById("data");
  var rowCount = table.rows.length;
  if (rowCount > 1) {
    var rowIndex = row.parentNode.parentNode.rowIndex;
    document.getElementById("data").deleteRow(rowIndex);
  }
  else {
    alert("Please specify at least one value.");
  }
}

这是css。

  

的style.css:

h1 {
  font-family: Arial;
  font-size: 20px;
  color: #666;
}

.data-table {
  border: solid 1px #eee;
  border-collapse: collapse;
  border-spacing: 0;
  font: normal 13px Arial, sans-serif;
  width: 100%;
}

.data-table tbody td {
  border: solid 1px #eee;
  color: #333;
  padding: 10px;
  text-shadow: 1px 1px 1px #fff;
}

.data-table-highlight tbody tr:hover {
  background-color: #f8f8f8;
}

.data-table-horizontal tbody td {
  border-left: none;
  border-right: none;
}

.top-buffer {
  margin-top: 20px;
}

.pull-right {
  float: right;
}

#main {
  width: 60%;
  margin: 5%;
}

我的论文来自菲律宾布拉干州立大学。 我是第四年IT学生想要通过我的论文。

抱歉我的英文不好..

0 个答案:

没有答案