Question

我在Jquery＆amp; amp; 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行用于一个文件描述） $（document）.ready（function（）{ var counter = 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");
});

我可以向用户显示我的第一个文件上传说明，但我无法向其显示其他上传文件的详细信息。我需要将所有上传的文件数据发送到JSON中，最后向用户显示表中不同行中所有上传文件的描述。我不知道该怎么做。它困惑了我...... Sry for long text

Answer 1

在看到这个问题的时候看起来除了json函数的表之外的所有东西都在工作。我不会为你做编码，但我会告诉你如何。

在docFile旁边添加另一个名为submit的按钮。
Google html＆＃34; table to json＆＃34;
请注意http://plugins.jquery.com/tabletojson/已存在
包含插件
添加以提交var json = $('#myTable').tableToJSON();
通过编写json文件不确定你的意思，但现在你有了json，你可以通过$ .post发送到你的服务器。虽然您可以保存cookie或使用HTML5 localStorage，但您无法直接从javascript在客户端计算机上编写文件。

Answer 2

我不知道你想要做什么。

但最好的方式（在我看来）是使用表格

将此添加到您的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>

和你的脚本

    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
    });
    }

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

2 个答案: