A
A
Addvencher2018-12-08 17:11:24
JavaScript
Addvencher, 2018-12-08 17:11:24

How to use 1 json file for multiple pages?

The site has, for example, 3 sections of different topics in which there are different products (respectively, there should be 3 groups of products), I connect my own JSON file to each page, and 1 JSON file for the basket of goods, in which all 3 groups of records are located (the same records as and on 3 villages, only all together). How to make it easier? Preferably 1 json file for all pages and cart. In the example below json with only 1 section.

{
  "1001": {
    "name": "Доска обрезная 50х150х6000 (ель)",
    "cost": 385,
    "img" : "board.jpg"
  },
  "1002": {
    "name": "Доска обрезная 40х150х6000 (ель)",
    "cost": 305,
    "img" : "board.jpg"
  },
  "1003": {
    "name": "Доска обрезная 30х150х6000 (ель)",
    "cost": 230,
    "img" : "board.jpg"
  },
  "1004": {
    "name": "Брус обрезной 100х100х6000 (ель)",
    "cost": 510,
    "img" : "brus.jpg"
  },
  "1005": {
    "name": "Брус обрезной 150х150х6000 (ель)",
    "cost": 1150,
    "img" : "brus.jpg"
  }
}

var cart = {};

function init() {
    $.getJSON("goods.json", goodsOut);
}

function goodsOut(data) {
    console.log(data);
    var out='';
    for (var key in data) {
        out +='<div class="cart">';
        out +='<img src="../../img/'+data[key].img+'">';        
        out +='<p class="name">'+data[key].name+'</p>';
        out +='<div class="cost">'+data[key].cost+' руб./шт.</div>';
        out +='<button class="add-to-cart" data-id="'+key+'">В корзину</button>';
        out +='</div>';
    }
    $('.goods-out').html(out);
    $('.add-to-cart').on('click', addToCart);
}
function addToCart() {
    var id = $(this).attr('data-id');
    if (cart[id]==undefined) {
        cart[id] = 1;
    }
    else {
        cart[id]++;
    }
    saveCart();
}

function saveCart() {
    localStorage.setItem('cart', JSON.stringify(cart));
}

function loadCart() {
    if (localStorage.getItem('cart')) {
        cart = JSON.parse(localStorage.getItem('cart'));
    }
}

$(document).ready(function () {
    init();
    loadCart();
});

Answer the question

In order to leave comments, you need to log in

1 answer(s)
M
Maxim Litvinov, 2018-12-08
@Addvencher

I 'm too lazy to write the code, but I see the following logic:
1) Each "controller" should work with one file
2) To separate categories, you can use, for example, the following file structure:

{
    "cart":{...},
    "razdel1": {...},
    "razdel2": {...},
    "razdel3": {...}
}

Well, and accordingly, to automate the definition of a backlog - the name can be determined by a local variable.
In general, it’s difficult to change the logic of a project that you don’t know!))) Therefore, I think that I conveyed the general essence, but then it’s up to you!

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question