Как добавить элемент в файл массива JSON из формы, используя JS - PullRequest
0 голосов
/ 31 октября 2018

У меня есть эта HTML-форма для добавления данных в файл массива json

<head>
        <script type="text/javascript" src="require.js"></script>
        <script type="text/javascript" src="AddBook.js"></script>
    </head>
    <body>
        <form id="add">
            <input type="text" id="isbn" name="isbn">
            <br>
            <input type="text" id="title" name="title">
            <br>
            <input type="text" id="author" name="author">
            <br>
            <input type="text" id="issued" name="issued">
            <br>
            <input type="submit" name="submit">
        </form>
        <script>
                var x = document.getElementById("add");
                var isbn = x.elements[0].value;
                var title = x.elements[1].value;
                var author = x.elements[2].value;
                var issued = x.elements[3].value;
                write(isbn,title,author,issued);
        </script>

и ниже - AddBook.js

function write(isbn, title, author, issued) {
  const fs = require(['fs'], function (fs){  
  const data = fs.readFileSync('js/book.json');
  let jsonStr = data.toString();
  const obj = JSON.parse(jsonStr);

  obj.books.push({
    isbn,
    title,
    author,
    issued,
  });
  jsonStr = JSON.stringify(obj);
  console.log(jsonStr);
  fs.truncate('js/book.json', 0, () => {
    fs.writeFile('js/book.json', jsonStr, (err) => {
      if (err) {
        throw new Error(`Error writing file: ${err}`);
      }
    });
  });
  });
}

Проблема в том, что приведенный ниже скрипт работает как отдельный файл, но перестает работать, как только он используется с HTML. Как заставить этот скрипт работать с формой

1 Ответ

0 голосов
/ 31 октября 2018

Попробуйте добавить функцию для запуска при отправке в вашей форме. Примерно так:

<head>
    <script type="text/javascript" src="require.js"></script>
    <script type="text/javascript" src="AddBook.js"></script>
    <script>
        function writeToJSON(){
            var x = document.getElementById("add");
            var isbn = x.elements[0].value;
            var title = x.elements[1].value;
            var author = x.elements[2].value;
            var issued = x.elements[3].value;
            write(isbn,title,author,issued);
        }
    </script>
</head>
<body>
    <form id="add" onsubmit="writeToJSON()">
        <input type="text" id="isbn" name="isbn">
        <br>
        <input type="text" id="title" name="title">
        <br>
        <input type="text" id="author" name="author">
        <br>
        <input type="text" id="issued" name="issued">
        <br>
        <input type="submit" name="submit">
    </form>
</body>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...