Сохранять значение поля c html в json

245
25 февраля 2017, 06:50

Есть html, данные в который Ajaxom грузятся из json. Есть поле которое отображает количество кликов на кнопку. Мне нужно чтоб это значение сохранялось в json файл. Подскажите пожалуйста как это вообще делается? Я так понимаю что мне нужен обработчик на серверном языке(для меня интересен nodejs). Но cделать не получается, буду признателен за рабочий примере, или ссылку на него, Для работы поднял простой nodejs сервер. Не закидывайте тапками это мой первый опыт работы с nodejs, да и с бекендом в целом.

Мой код html

       <li class="product-item">
        <h2 class="product-item__title"></h2>
       <p class="content"></p>
       <button class="product-item__buy-btn">Buy</button>
      <span class="product-item__counter">0</span>
      </li>

js

(function () {
  var buttons = document.querySelector('#list');
// обработчик кликов
 buttons.onclick = function (e) {
  var target = e.target;
  if (target.tagName != 'BUTTON') return;
    var count = target.closest('li').querySelector('.product-  item__counter');
// счётчик
   count.innerText = parseInt(count.innerText) + 1;
  };
  //ренедер html шаблона
  var container = document.querySelector(".products-list");
 getProduct();
 function renderProduct(item) {
  item.forEach(function (product) {
    var element = getElementFromTemplate(product);
    container.appendChild(element);
   });
 }
 //Ajax запрос
 function getProduct() {
  var xhr = new XMLHttpRequest();
  xhr.open('GET', 'data/product.json');
  xhr.onload = function (evt) {
  var rawData = evt.target.response;
  var loadedProduct = JSON.parse(rawData);
  renderProduct(loadedProduct);
};
xhr.send();
 }
   //запись данных в html
 function getElementFromTemplate(data) {
   var template = document.querySelector('#template');
   if ('content' in template) {
     var element = template.content.children[0].cloneNode(true);
   } else {
     var element = template.children[0].cloneNode(true);
   }
   element.querySelector('.product-item__title').textContent =   data.name;
   element.querySelector('.content').textContent =   data.description;
   return element;
 }
 })();

json

   [
  {
    "name": "Product",
    "description": "Lorem ipsum dolor sit amet, ."
  },
 ]

для запуска локального сервера использую вот так просто код

var http = require('http');
var static = require('node-static');
var file = new static.Server('.');
http.createServer(function(req, res) {
  file.serve(req, res);
}).listen(8080);
console.log('Server running on port 8080');
READ ALSO
Скорость наше всё?

Скорость наше всё?

Доброго вечера всеПрофессионалы и любители JavaScript

268
React и ввод данных в input

React и ввод данных в input

Доброго времени суток! Делаю небольшое приложение на React, опыта пока немногоУ меня два React-класса, один - это навигация, второй - форма редактирования...

307
Вопрос на счёт Ember.run

Вопрос на счёт Ember.run

Всем приветНашел в коде такое

256
Как организовать событие mousePressed jquery?

Как организовать событие mousePressed jquery?

Не получается нормально сделать событие mousePressed (при зажатой кнопки мыши происходит увеличение величины с шагом одна единица), получается...

335