时间戳

首页 > 解决方案 > 如何将 HTML 动态表保存到数据库中

javascript - 如何将 HTML 动态表保存到数据库中

问题描述

我的问题是我正在HTML使用javascript.

如何HTML使用 CodeIginter 将此动态表保存到数据库中？

这是我的输入文本代码：

<table  id="tb3" name="tb3">
    <tr>
        <td>Product Code</td>
        <td>Product Name</td>
        <td>Qty</td>
        <td>Rate</td>
        <td>Amount</td>
    </tr>

    <tr>        
        <td>
            <input  type="text" onkeyup="autofill()" id="Product_Code" name="Prdtcode" class="form-control input-xs Product_Code "     required>
        </td>

        <td ><input type="text" id="Product_Name" name="Prdtname" class="form-control input-xs"></td>

        <td><input  type="text" 
            onkeypress="javascript:doit_onkeypress(event)"  id="Qty" onkeyup="movetoNext(this, 'addMore3')" name="Qty"class="form-control input-xs"    required>
        </td>

        <td><input  type="text" id="Rate"  class="form-control input-xs"name="Rate" value="" ></td>

        <td><input type="text" id="Value" name="Value" class="form-control input-xs"  ></td>

    </tr>
</table>

此代码从 a 获取数据TextBox并使用以下表格格式显示javascript：

<table  class="table table-bordered table-striped table-xxs" id="tb2" name="tb2">
    <tr>
        <th>Product Code</th>
        <th>Product Name</th>
        <th>Qty</th>
        <th>Rate</th>
        <th>Amount</th>
    </tr>

这是javascript创建表的代码

function doit_onkeypress(event)
{
    if (event.keyCode == 13 || event.which == 13){
        if(!checkEmptyInput()){
            var newRow = table.insertRow(table.length),
            cell1 = newRow.insertCell(0),
            cell2 = newRow.insertCell(1),
            cell3 = newRow.insertCell(2),
            cell4 = newRow.insertCell(3),
            cell5 = newRow.insertCell(4),
            code = document.getElementById("Product_Code").value,
            name = document.getElementById("Product_Name").value,
            qty = document.getElementById("Qty").value,
            rate = document.getElementById("Rate").value,
            amt = document.getElementById("Value").value;

            cell1.innerHTML = code;
            cell2.innerHTML = name;
            cell3.innerHTML = qty;
            cell4.innerHTML = rate;
            cell5.innerHTML = amt;

            var prdtcode = $("#Product_Code").val("");
            var Prdtname = $("#Product_Name").val("");
            var qty = $("#Qty").val("");
            var Rate = $("#Rate").val("");
            var amt = $("#Value").val("");
        }
    }
}

我的问题是我正在使用创建一个动态HTML表javascript，我如何使用 codeiginter 将此动态 html 表保存到数据库中。

标签： javascriptphphtmlcodeigniter

解决方案

将整个表格 html 数据存储到一个变量中

var table_data = $("#table_id").html();
$.trim(table_data. replace(/>[\n\t ]+</g, "><"));

现在将此 table_data 变量发送到控制器函数以添加数据 确保字段的数据类型应为文本或长文本，然后通常在控制器函数中执行 insertdata 查询。

ajax代码如下：

$.ajax({
url:"path to your controller function",
type: 'POST',
data:{
    table_data:table_data,
},
success:function(result){
   console.log(result);
},
});

控制器功能代码如下：

function insert_table_data(){
    $data = array('table_data' => $this->input->post('table_data'));
    $this->db->insert('table_name', $data);
}

推荐阅读