Печать объекта из локального хранилища - PullRequest
Новая
       30

Печать объекта из локального хранилища

0 голосов
/ 24 мая 2018

У меня есть форма расходов, которая сохраняет данные в локальном хранилище браузера.У меня есть кнопка на странице под формой, так что после ее заполнения вы можете нажать, чтобы распечатать данные в хорошем формате.

Я должен использовать данные JSON в локальном хранилище из-зак функциональности моего приложения.

Я использую переменную js, чтобы получить данные из локального хранилища: 

var my_expenses = localStorage.getItem('my_expenses');

Вот запись в локальном хранилище моего браузера с неизмененным значением.

Ключ: my_expenses Значение: 

{
    "income": {
        "1": {
            "name": "Pay (after tax)",
            "freq": "26",
            "value": "233"
        },
        "2": {
            "name": "Partners take home pay",
            "freq": "4",
            "value": "10"
        },
        "3": {
            "name": "Bonuses/overtime",
            "freq": "26",
            "value": "30"
        },
        "4": {
            "name": "Income from savings and investments",
            "freq": "1",
            "value": "50"
        },
        "5": {
            "name": "Child support received ",
            "freq": "12",
            "value": "40"
        }
    },
    "outgoings": {
        "1": {
            "name": "Electricity",
            "freq": "4",
            "value": "0"
        },
        "2": {
            "name": "Gas",
            "freq": "4",
            "value": "0"
        },
        "3": {
            "name": "Water",
            "freq": "4",
            "value": "0"
        },
        "4": {
            "name": "Internet",
            "freq": "4",
            "value": "0"
        },
        "5": {
            "name": "Telephone",
            "freq": "4",
            "value": "0"
        },
        "6": {
            "name": "Car Insurance",
            "freq": "1",
            "value": "0"
        }
    }
}

Согласно Print.js вы можете печатать данные JSON следующим образом (включая мою переменную с данными локального хранилища): 

 <button type="button" onclick="printJS({printable: my_expenses, properties: ['name', 'freq', 'value'], type: 'json'})">
Print JSON Data

По какой-то причине я получаю сообщение об ошибке в своей консоли и не могу ее выяснить, и диалог печати не открывается. 

Uncaught Error: Missing printable information.
at init (print.min.js:1)
at HTMLButtonElement.onclick ((index):156)

Я думаю, что это может быть структурамой JSON в локальном хранилище?любая помощь будет принята с благодарностью.

Попробовал использовать JSON.parse () примерно так: 

var my_expenses = JSON.parse(localStorage.getItem("my_expenses"));

до того, как я добавил анализ JSON.Я получал сообщение об ошибке, и это был вывод локального хранилища в консоли.

before JSON parse

после того, как я его добавил, это был вывод и печатьКнопка вроде бы работала:

with JSON parse

Но в диалоге печати нет данных?

enter image description here

Как создается объект и функции локального хранилища: 

//Set the default incomes and outgoings here
var defaultsObj = {
    'income':{
        1:{name:"Pay (after tax)",freq:52,value:0},
        2:{name:"Partners take home pay",freq:4,value:0},
        3:{name:"Bonuses/overtime",freq:26,value:0},
        4:{name:"Income from savings and investments",freq:1,value:0},
        5:{name:"Child support received ",freq:12,value:0}
    },'outgoings':{
        1:{name:"Electricity",freq:4,value:0},
        2:{name:"Gas",freq:4,value:0},
        3:{name:"Water",freq:4,value:0},
        4:{name:"Internet",freq:4,value:0},
        5:{name:"Telephone",freq:4,value:0},
        6:{name:"Car Insurance",freq:1,value:0}
    }
};  

//Functions to store and retrieve objects from localstorage
function ls_store(name,o){
    localStorage.setItem(name, JSON.stringify(o));          
};
function ls_read(name){
    return JSON.parse(localStorage.getItem(name));
};  

function set_defaults(){
    ls_store('my_expenses',defaultsObj);
    expensesObj = ls_read('my_expenses'); 
}
//If our localstroage items are empty let's store the defaults
if(ls_read('my_expenses')==null){
    set_defaults();
}

1 Ответ

0 голосов
/ 24 мая 2018

Вы не сохраняете массив, а printjs ждет массива.

Сначала попытайтесь сохранить в двух разных массивах, чтобы увидеть результат в своем PDF-файле.

Если данные отображаются для первого массива, вы должны: вызвать два раза printjs, один для первого массива и другой для второго массива ИЛИ объединить эти два массива в один и, возможно, добавить атрибут к дальнему, если он не получен или результат,

...