Javascript 使用PHP从文本文件读取数据并将其存储在html表中_Javascript_Php_Html Table

Javascript 使用PHP从文本文件读取数据并将其存储在html表中

javascript php

Javascript 使用PHP从文本文件读取数据并将其存储在html表中,javascript,php,html-table,Javascript,Php,Html Table,我有一个文本文件，其中包含的数据看起来像是在表格中格式化的。但它们只是一排排排列有序的文本，就像一张桌子。我正在尝试读取文本文件，获取数据并存储在HTML表中文本文件如下所示： Sl.No., Project Name, ChangeDate, Changed By 01, 01, 02, 03 02, 04, 05, 06 03, 07, 08, 09 04, 10, 11, 12 05, 13, 14, 15 06, 16, 17, 18 07, 19, 20, 21 08, 22, 23

我有一个文本文件，其中包含的数据看起来像是在表格中格式化的。但它们只是一排排排列有序的文本，就像一张桌子。我正在尝试读取文本文件，获取数据并存储在HTML表中

文本文件如下所示：

Sl.No., Project Name, ChangeDate, Changed By
01, 01, 02, 03
02, 04, 05, 06
03, 07, 08, 09
04, 10, 11, 12
05, 13, 14, 15
06, 16, 17, 18
07, 19, 20, 21
08, 22, 23, 24
09, 25, 26, 27
010, 28, 29, 30
011, 31, 32, 33
012, 34, 35, 36
013, 37, 38, 39
014, 40, 41, 42
015, 43, 44, 45
016, 46, 47, 48
017, 49, 50, 51
018, 52, 53, 54
019, 55, 56, 57
020, 58, 59, 60

<html>
<script>
function makeTable()
{
    var row_num = 20;
    var cell_num = 4;

    var tab = document.createElement('table');
    tab.setAttribute('id','newtable');

    var tbo = document.createElement('tbody');
    tbo.setAttribute('id','tabody');

    var cont;
    for(var c = 0 ; c < row_num ; c++)
    {
        var row = document.createElement('tr');
        for(var k = 0 ; k < cell_num ; k++)
        {
            var cell = document.createElement('td');
            if (k > 0)
            {
                cont = document.createElement("input");
                cont.setAttribute('type','text');
            }
            else
            {
                cont = document.createTextNode("0" + (c+1));
            }
            cell.appendChild(cont);
            row.appendChild(cell);
        }
        tbo.appendChild(row);
    }
    tab.appendChild(tbo);
    document.body.appendChild(tab);
    tab.setAttribute("align", "top-left");
}
window.onload = function()
{
    makeTable();
};

function GetCellValues()
{
    var str = '';
    var rows = document.getElementsByTagName('tr');
    var table=document.getElementById("project");
    for (var i=0;i<table.rows[0].cells.length;i++)
    {
        if (i > 2 )
        {
            str = str + table.rows[0].cells[3].innerHTML.replace(", ");
        }
        else
        {
            str = str + (table.rows[0].cells[i].innerHTML) + ', ' ;
        }
    }
    for (var c = 1 ; c < rows.length ; c++)
    {
        str += '\n' + "0" + c + ', ';
        var row = rows[c];
        var inputs = row.getElementsByTagName('input');                
        for (var k = 0 ; k < inputs.length ; k++)
        if (k > 1)
        {
            str += inputs[k].value.replace(", ");
        }
        else 
        {
            str += inputs[k].value + ', ';
        }
    }   
    document.getElementById('hide').value = str;
}

</script>
</head>
<body>
<form action = "project.php" method = "POST">
<h1><u>PROJECT</u> :</h1>
<input type="hidden" id="hide" name="hide" value="">
<input type="submit" name="submit" onclick = "GetCellValues()" />
<table id = "project" border = "1" width ="60%" class = "newtable" cellpadding="10" cellspacing="0">
<tr>
<th align="center" width ="200px" id = "Sl.No." >Sl.No.</th>
<th align="center" width ="200px" id = "Project Name" >Project Name</th>
<th align="center" width ="200px" id = "ChangeDate" >ChangeDate</th>
<th align="center" width ="200px" id = "Changed By" >Changed By</th>
</tr>
</form>
</body>
</html>

我使用此代码创建html表，如下所示：

Sl.No., Project Name, ChangeDate, Changed By
01, 01, 02, 03
02, 04, 05, 06
03, 07, 08, 09
04, 10, 11, 12
05, 13, 14, 15
06, 16, 17, 18
07, 19, 20, 21
08, 22, 23, 24
09, 25, 26, 27
010, 28, 29, 30
011, 31, 32, 33
012, 34, 35, 36
013, 37, 38, 39
014, 40, 41, 42
015, 43, 44, 45
016, 46, 47, 48
017, 49, 50, 51
018, 52, 53, 54
019, 55, 56, 57
020, 58, 59, 60

<html>
<script>
function makeTable()
{
    var row_num = 20;
    var cell_num = 4;

    var tab = document.createElement('table');
    tab.setAttribute('id','newtable');

    var tbo = document.createElement('tbody');
    tbo.setAttribute('id','tabody');

    var cont;
    for(var c = 0 ; c < row_num ; c++)
    {
        var row = document.createElement('tr');
        for(var k = 0 ; k < cell_num ; k++)
        {
            var cell = document.createElement('td');
            if (k > 0)
            {
                cont = document.createElement("input");
                cont.setAttribute('type','text');
            }
            else
            {
                cont = document.createTextNode("0" + (c+1));
            }
            cell.appendChild(cont);
            row.appendChild(cell);
        }
        tbo.appendChild(row);
    }
    tab.appendChild(tbo);
    document.body.appendChild(tab);
    tab.setAttribute("align", "top-left");
}
window.onload = function()
{
    makeTable();
};

function GetCellValues()
{
    var str = '';
    var rows = document.getElementsByTagName('tr');
    var table=document.getElementById("project");
    for (var i=0;i<table.rows[0].cells.length;i++)
    {
        if (i > 2 )
        {
            str = str + table.rows[0].cells[3].innerHTML.replace(", ");
        }
        else
        {
            str = str + (table.rows[0].cells[i].innerHTML) + ', ' ;
        }
    }
    for (var c = 1 ; c < rows.length ; c++)
    {
        str += '\n' + "0" + c + ', ';
        var row = rows[c];
        var inputs = row.getElementsByTagName('input');                
        for (var k = 0 ; k < inputs.length ; k++)
        if (k > 1)
        {
            str += inputs[k].value.replace(", ");
        }
        else 
        {
            str += inputs[k].value + ', ';
        }
    }   
    document.getElementById('hide').value = str;
}

</script>
</head>
<body>
<form action = "project.php" method = "POST">
<h1><u>PROJECT</u> :</h1>
<input type="hidden" id="hide" name="hide" value="">
<input type="submit" name="submit" onclick = "GetCellValues()" />
<table id = "project" border = "1" width ="60%" class = "newtable" cellpadding="10" cellspacing="0">
<tr>
<th align="center" width ="200px" id = "Sl.No." >Sl.No.</th>
<th align="center" width ="200px" id = "Project Name" >Project Name</th>
<th align="center" width ="200px" id = "ChangeDate" >ChangeDate</th>
<th align="center" width ="200px" id = "Changed By" >Changed By</th>
</tr>
</form>
</body>
</html>


函数makeTable（）
{
var row_num=20；
可变单元数=4；
var tab=document.createElement（'table'）；
tab.setAttribute（'id'，'newtable'）；
var tbo=document.createElement（'tbody'）；
setAttribute（'id'，'tabody'）；
var cont；
对于（var c=0；c0）
{
cont=document.createElement（“输入”）；
cont.setAttribute（'type'，'text'）；
}
其他的
{
cont=document.createTextNode（“0”+（c+1））；
}
附体子细胞（续）；
子行（单元格）；
}
tbo.追加子项（世界其他地区）；
}
表2.附加子项（tbo）；
document.body.appendChild（页签）；
tab.setAttribute（“对齐”，“左上”）；
}
window.onload=函数（）
{
makeTable（）；
};
函数GetCellValues（）
{
var-str=''；
var rows=document.getElementsByTagName（'tr'）；
var table=document.getElementById（“项目”）；
对于（变量i=0；变量i=2）
{
str=str+table.rows[0]。单元格[3]。innerHTML.replace（“，”）；
}
其他的
{
str=str+（table.rows[0].cells[i].innerHTML）+'，'；
}
}
对于（var c=1；c1）
{
str+=inputs[k].value.replace（“，”）；
}
其他的
{
str+=输入[k]。值+'，'；
}
}   
document.getElementById（'hide'）。value=str；
}
项目：
没有。
项目名称
变更日期
改为

现在我想把这个文本文件存储在这个表中

我使用此代码从表中检索数据并将其存储在txt文件中：

<?php
$handle = fopen("data.txt", "w");
$hide =$_REQUEST['hide'];
fwrite($handle,$hide);
echo $hide;
?>

我使用以下代码将txt文件转换为数组：

<?php
    $text = file_get_contents("data.csv");
    $fixed_text = str_replace("\n", "<br>", $text);
    echo '<pre>';
    print_r ( explode( ',', $fixed_text ) );
    echo '</pre>';
    //echo ( explode( ',', $fixed_text ) );
    //echo $fixed_text;         
?>

现在我想把这个文本文件数据存储到表中。

如何将此文本文件数据存储到表中？

使用文本格式是愚蠢的……创建数组并转换为json将其存储在json中，以json发送，以javascript将数组循环到poplulate表中。不要使用

使用

echo json\u encode（array）

使用json，你不会出错的。谷歌

解析json html

请给我一些关于这个的代码…@charlietfl