Блог

Я новичок в Jquery и Angularjs.

Я хочу создать форму с двумя кнопками.

Имя первой кнопки = Создатель строки, а имя второй = Отправить.

когда я нажимаю на кнопку создания строки, она создает строку таблицы с 3 столбцами. (имя 1-го столбца =Name, имя 2-го столбца = Size и имя 3-го столбца =Type)

и каждый раз, когда я нажимаю на это, добавляется новая строка.

в конце, когда я нажимаю на кнопку «Отправить«, она отправляет все данные моих строк в файл 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 amp; 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 строка для описания одного файла)
$(документ).готово(функция () {
счетчик переменных = 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 для длинного текста

Я не знаю, что именно вы хотите сделать.

Но лучший способ (на мой взгляд) — использовать 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>
  

и ваш скрипт

     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, работает. Я не собираюсь делать ваше кодирование за вас, но я покажу вам, как это сделать.

1. добавьте еще одну кнопку рядом с файлом docFile под названием submit.
2. Google html «таблица в json»
3. обратите внимание, чтоhttp://plugins .jquery.com/tabletojson / уже существует
4. включите плагин
5. добавить в onclick отправки var json = $('#myTable').tableToJSON();
6. Не уверен, что вы имеете в виду, когда пишете файл json, но теперь у вас есть json, который вы можете отправить на свой сервер через $.post. Вы не можете напрямую записать файл на клиентский компьютер из javascript, хотя вы можете сохранить cookie или использовать HTML5 localStorage.