0

HTML5 ローカル ストレージを使用してクライアント側でメモを保存するだけのメモ取り Web アプリを作成しようとしています。JSONはそれを行う方法だと思いますが、どうすればよいかわかりません。

タイトルとテキストエリアを設定したシンプルなフォームがあります。フォームを送信し、いくつかの「メモ」で入力した詳細を保存してからリストに戻す方法はありますか?

私はJavascriptとJSONが初めてなので、助けていただければ幸いです。

4

3 に答える 3

1

json を使用する方法はたくさんあります。

1> HTML ページで関数を作成し、ajax を呼び出してデータを投稿できます。ここでは、$("#txtboxid").val() を使用する必要があります。値を取得して投稿します。

2>ノックアウトjsを使用して双方向にバインドし、ajaxを呼び出します。

Web アプリを呼び出す簡単なコードを次に示します。ajax 呼び出しを使用します。

var params = { "clientID": $("#txtboxid") };     

        $.ajax({
            type: "POST",
            url: "http:localhost/Services/LogisticsAppSuite.svc/Json/GetAllLevelSubClients",
            contentType: 'application/json',

            data: JSON.stringify(params),
            dataType: 'json',
            async: false,
            cache: false,
            success: function (response) {



            },
            error: function (ErrorResponse) {


            }
于 2013-01-29T05:02:09.527 に答える
0

保存する情報の複雑さによっては、JSONは必要ない場合があります。

setItem()HTML5ののメソッドを使用しlocalStorageて、クライアント側でキーと値のペアを保存できます。このメソッドでのみ文字列値を格納できますが、ノートの構造がそれほど複雑でない場合は、これがおそらく最も簡単な方法です。これが使用していたHTMLであると仮定します。

<input type="text" id="title"></input>
<textarea id="notes"></textarea>

この単純なJavascriptコードを使用して、情報を保存できます。

// on trigger (e.g. clicking a save button, or pressing a key)
localStorage.setItem('title', document.getElementById('title').value);
localStorage.setItem('textarea', document.getElementById('notes').value);

localStorage.getItem()値を取得するために使用します。

これは、メソッドがどのように機能するかを示すために作成した単純なJSFiddleです（ただし、上記とまったく同じコードは使用していません。これはキーアップイベントに依存しています）。

私が見ることができるように、JSONを使用したい唯一の理由は、メモに深みのある構造が必要な場合です。たとえば、メモを書いた日付などの情報を添付して、次のような構造にすることができます。

{
    'title': {
        'text':
        'date':
    }
    'notes': {
        'text':
        'date':
    }
}

それはJSONになります。ただし、このlocalStorage.setItem()メソッドは文字列値のみを受け入れることに注意してください。これを行うには、オブジェクトを文字列に変換してから、で取得するときにオブジェクトを元に戻す必要がありますlocalStorage.getItem()。メソッドJSON.stringifyはオブジェクトから文字列への変換JSON.parseを実行し、その逆を実行します。しかし、私が言っているように、この変換は余分なコードを意味し、メモをそれほど複雑にする必要がある場合にのみ、本当に価値があります。

于 2013-01-08T14:22:20.837 に答える
0

エンティティ フレームワークと同じように機能する lib を作成しました。後でここに置きます。そこで私をフォローするか、私に連絡して今すぐソースコードを入手してください。次に、次のような js コードを記述できます。

var DemoDbContext = function(){ // define your db
    nova.data.DbContext.call(this);
    this.notes=new nova.data.Repository(...); // define your table
}
//todo: make DemoDbContext implement nova.data.DbContext
var Notes = function(){
    this.id=0; this.name="";
}
//todo: make Note implement nova.data.Entity

データを照会する方法

var notes = new DemoDbContext().notes.toArray(function(data){});

dbにメモを追加するには?

var db = new DemoDbContext();
db.notes.add(new Note(...));
db.saveChanges(callback);
于 2013-01-08T14:13:53.773 に答える