Сохранение данных с jqMobi

Что ж, я разобрался в поиске Google и разобрался с переполнением стека, и пока я не знаю, как с этим поступить.

Я хотел бы создать программу To Do для iphone, используя jqMobi + CSS + HTML 5. Я много работал с jQuery, провел некоторое время с jQuery Mobile и сделал тонны css и HTML (хотя мало работал с HTML5). Что мне нужно сделать, так это сохранить списки, которые создает пользователь, когда открывает программу.

У меня нет проблем с динамическим созданием и связыванием страниц... но когда вы открываете программу во второй раз, все созданные мной страницы (IE To Do Items) исчезают. Я понимаю, что это потому, что они не были прописаны как часть базовой программы. Мне приходит в голову, что способ обойти это - сохранить эти списки в файл или базу данных, а затем загрузить их при запуске программы.

Я видел документацию, чтобы сделать это с помощью Titanium Studio (он поддерживает SQL lite), но генерация страниц и общий пользовательский интерфейс отстой. Кроме того, запуск эмулятора из этого кода доставил мне много хлопот. По крайней мере, я могу сказать, что использование приложения appMobi для тестирования дает вам достойный эмулятор для работы, прежде чем вы перенесете код в скомпилированное состояние.

В любом случае, кто-нибудь знает, как настроить сохранение данных (между перезапусками программы) для jqMobi + CSS + HTML 5 либо с генерацией БД, либо с файлом?

РЕДАКТИРОВАТЬ x2: Поскольку я вас зацепил, @ian, можете ли вы взглянуть на этот код и сказать мне, почему $.ui.addContentDiv() не обновляет содержимое? ? $(#content).append(строка); похоже, тоже не хочет сотрудничать. Есть ли какая-то функция, которую мне нужно вызвать, чтобы обновить ее? Немного разобрал, но проблемы остались. Как ни странно, добавление в список работает нормально, но когда я пытаюсь добавить этот слой div, его не существует...

код выглядит следующим образом:

function genPage( id, list, parent ) {
    var content = '<div id="' + id + '" class="panel">' + id + '</div>';    
    var threadLink='<li><a href="#' + id +'">' + id + '</a></li>';      
    $("#" + list).append(threadLink);
    $("#content").append(content);

    //$.ui.addContentDiv(id, content, id);
}

person Rift    schedule 01.02.2012    source источник


Ответы (3)


Я ведущий разработчик jqMobi, поэтому буду рад помочь с вопросами.

Я работаю над мини-списком дел в качестве демонстрации для версии 1.0. Я бы сохранил данные в виде строкового объекта JSON в window.localStorage.

Но если это приложение appMobi, то у нас есть похожие AppMobi.cache.cookies. Разница лишь в том, что AppMobi.cache позволяет хранить больше данных.

Посетите http://forums.appmobi.com, чтобы получить дополнительную помощь.

person Community    schedule 01.02.2012
comment
Я думаю, что понял. Я посмотрю, что произойдет, и дам вам знать. Тем временем для других людей, следящих за этим, вот ссылка на локальные хранилища: diveintohtml5.info/storage.html< /а> - person Rift; 02.02.2012

Вы думали об использовании PhoneGap? У него есть библиотека базы данных, которую вы можете использовать для сохранения всех ваших данных в базе данных sqlite. http://docs.phonegap.com/en/1.5.0/phonegap_storage_storage.md.html#Database

person TrippRitter    schedule 09.04.2012

Вот мой первый способ заставить json и куки работать для тех, кто может найти это полезным. Это всего лишь прототип, поэтому он мало что делает. Я вырезал дополнительный javascript, добавленный средой разработки AppMobi, для простоты.

РЕДАКТИРОВАТЬ: похоже, что JSON работает довольно хорошо для структуры данных, если вы не пытаетесь сделать что-то особенно интенсивное с данными. Также похоже, что AppMobi.cache от appMobi очень хорошо работает с файлами cookie. Вот мой мини-скрипт для демонстрации основных операций с файлами cookie/строками JSON.

код:

<!DOCTYPE html><!--HTML5 doctype-->
<html>
<head>
<title>Your New Application</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8"> 
<style type="text/css">
    /* Prevent copy paste for all elements except text fields */
    *  { -webkit-user-select:none; -webkit-tap-highlight-color:rgba(255, 255, 255, 0); }
    input, textarea  { -webkit-user-select:text; }

    /* Set up the page with a default background image */
    body {
        background-color:#fff;
        color:#000;
        font-family:Arial;
        font-size:48pt;
        margin:0px;padding:0px;
        background-image:url('images/background.jpg');
    }
</style>
<script type="text/javascript" charset="utf-8" src="http://localhost:58888/_appMobi/appmobi.js"></script> 
<script type="text/javascript" charset="utf-8" src="http://localhost:58888/_appMobi/xhr.js"></script> 
<script type="text/javascript">

function setCookie() {
    var value = document.getElementById('cookie').value;
    AppMobi.cache.setCookie("test", value, 1);
}

function testbed() {
alert("Trying new things!");
var jsonobj = {"bindings": [
        {"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"},
        {"ircEvent": "PRIVMSG", "method": "deleteURI", "regex": "^delete.*"},
        {"ircEvent": "PRIVMSG", "method": "randomURI", "regex": "^random.*"}
    ]
};

var test = jsonobj.bindings[0].method;
alert(test);
}

function getCookie(){
    var cookie = AppMobi.cache.getCookie("test");
    document.getElementById("cookievalue").innerHTML = cookie;
}

</script>

</head>
<body>
<form action="javascript: setCookie()">
<input type="text" id="cookie" value="set a cookie">
<input type="submit">
</form>

<p id="cookievalue"></p>

<form action="javascript: getCookie()">
<input type="submit" value="Get a Cookie">
</form>

<form action="javascript: testbed()">
<input type="submit" value="try new things">
</form>
</body>
</html>
person Rift    schedule 02.02.2012