Javascript 添加或删除表中的一行，然后将所有数据放入JSON文件中

我是Jquery和Angularjs的新手

我想做一个有两个按钮的表格

第一个按钮名为=行创建者，第二个按钮名为=提交

当我单击“行创建者”按钮时，它会创建一个包含3列的表行。 （第一列名称=名称，第二列名称=大小，第三列名称=类型）

每当我点击它，它就会添加一个新行

最后，当我单击提交按钮时，它会以JSON文件的形式发送我所有的行数据

我对此一无所知。我需要Angularjs、JQuery或Javascript中的代码

谢谢分享

    $scope.fileContent = "";
$scope.storeFile = function () {
    var saveFile = new dataStructure();
    var fileContent = $scope.fileContent.Content;
    saveFile.EntityInfo[0].Name = GUID() + "." + $scope.fileContent.FileName.split('.').pop(); //taking the name of the off and adding the GUID & splitting the postfix
    saveFile.EntityInfo[0].Type = "CUSTOMFILE";
    saveFile.EntityInfo[0].Size = $scope.fileContent.Size; //Taking the size of the file
    saveFile.EntityData = [
        {"Content": fileContent}
    ];

    var inputjsondata = JSON.stringify(saveFile);
    $http({ method: 'POST', url: rootURL + '/data/savefilecontent', data: inputjsondata, dataType: 'text', processData: false, async: false, headers: { 'Content-Type': 'application/json; charset=utf-8' } }).success(function (data) {
        alert("File successfuly saved.");

    });
};
       $scope.attachedFile = [];
        $scope.attachedFile.push({
            "filename": $scope.fileContent.FileName,
            "filetype": $scope.attachedFile.FileType,
            "filesize": $scope.fileContent.Size
        });

有了上面的代码，我可以从浏览器读取文件并上传到我的服务器上，然后。。。 即使下面的代码也可以为我创建一个JSON文件，我可以上传带有名称、大小和类型的文件：

$scope.attachedFile = [];
        $scope.attachedFile.push({
            "filename": $scope.fileContent.FileName,
            "filetype": $scope.attachedFile.FileType,
            "filesize": $scope.fileContent.Size
        });

但使用下面的代码，我可以创建一个包含3行的表，并希望向用户显示我表中任何行中上传文件的描述（1行表示一个文件描述） $（文档）.ready（函数（）{ var计数器=0

$("#DocFile").on("click", function () {

    counter = $('#myTable tr').length - 2;

    var newRow = $("<tr>");
    var cols = "";
    cols += '<td><input type="text" "name="name'  + counter + '" /></td>';
    cols += '<td><input type="text" "name="size'  + counter + '" /></td>';        
    cols += '<td><input type="text" "name="type'  + counter + '" /></td>';

    cols += '<td><img src="images/template/Icons/closec.png" class="ibtnDel" title="Rmoving Row" style="cursor:pointer" /></td>';

    newRow.append(cols);
    $("table.letter-list").append(newRow);
    counter++;
});

$("table.letter-list").on("click", ".ibtnDel", function (event) {
    $(this).closest("tr").remove();

    counter -= 1
    $('#DocFile').attr('disabled', false).prop('value', "Add Row");
});

$（“#DocFile”）。在（“单击”，函数（）{
计数器=$（'#myTable tr'）。长度-2；
var newRow=$（“”）；
var cols=“”；
cols+=''；
cols+='在看到这个问题时，除了table to json函数外，似乎所有的东西都在工作。我不打算为您编写代码，但我会告诉您如何编写

在docFile旁边添加另一个名为submit的按钮
谷歌html“表到json”
请注意，这已经存在
包括插件
添加到提交的onclick
var json=$（“#myTable”）.tableToJSON（）；
不确定编写json文件是什么意思，但现在您有了可以通过$.post发送到服务器的json。虽然可以保存cookie或使用HTML5 localStorage，但您不能直接从javascript在客户端计算机上编写文件
我不知道你到底想做什么

但（在我看来）最好的方法是使用table

将此添加到您的HTML中

<tr ng-repeat="item in formData.Attachments" style="width:25px; height:20px;">
<td>{{item.Filename}}</td>
<td>{{item.filesize}}</td>
<td><button ng-click="deleteItem($index)" id="removefile" style="cursor:pointer" align="center/></td>
</tr>


{{item.Filename}
{{item.filesize}
我添加了我的JQuery代码。它创建了我的行。但它无法将我所有新行的数据推送到JSON文件中。JQuery和angularjs都是javascript。但是angular使用的方法与JQuery完全不同。你想要什么？JQuery还是angular？两者结合在一起不是一个好主意。我更喜欢使用JQuery。我可以创建，但我无法发送m的数据在我的旧JSONYes的y新行中，我可以看到您的示例在jquery中。基本上它是有效的。现在是什么问题？您能用这个plunker来进一步描述您的问题吗？请从您的问题中删除角度标记，因为这与此无关。顺便说一句，我在您的问题中也看不到任何json。谢谢先生。这真是太好了有益的
    var fileContent = "";
    for (var i=0; i < $scope.attachedFile.length; i++) {
    fileContent = $scope.attachedFile[i].fileContent;

    $scope.attachedFile.push({
        "filename": $scope.fileContent[i].FileName,
        "filesize": $scope.fileContent.Size
    });
    }