Knowledge - Free knowledge base system

コンテンツ

フォームへの確認画面などで「戻るボタン」を押して画面遷移した場合や「リロード」ボタンを押した時に自動的に値を再構築したい場合、非常に面倒な手間が必要だった。

この面倒な処理をなくし、HTML5のローカルストレージ機能を使用してフォームの値を再構築するJQueryプラグインが「sisyphus.js」である。

HTML5のローカルストレージ(ローカルDB)を使用するので、IEの古いバージョンでは動作しない。
Chrome,Firefoxなどでは問題なく利用することができる。

[sisyphus.js リンク](http://sisyphus-js.herokuapp.com/)


## 使用方法

HTMLフォーム(例
`
<form id="dataform">
....
</form>
`
JavaScript で以下のように記述(以下の例ではhidden以外を再構築するように指定)

`
$(function(){
    $( "#dataform" ).sisyphus( {
        locationBased: false,
        excludeFields: $('input[type="hidden"]'),
        autoRelease: false
    } );
});
`

その他パラメータなどは、プラグイン付属のドキュメントもしくは公式サイトを参照。

コンテンツ

フォームへの確認画面などで「戻るボタン」を押して画面遷移した場合や「リロード」ボタンを押した時に自動的に値を再構築したい場合、非常に面倒な手間が必要だった。

この面倒な処理をなくし、HTML5のローカルストレージ機能を使用してフォームの値を再構築するJQueryプラグインが「sisyphus.js」である。

HTML5のローカルストレージ(ローカルDB)を使用するので、IEの古いバージョンでは動作しない。
Chrome,Firefoxなどでは問題なく利用することができる。

[sisyphus.js 本家サイト http://sisyphus-js.herokuapp.com/ ](http://sisyphus-js.herokuapp.com/)


## 使用方法

HTMLフォーム(例

```
<form id="dataform">
....
</form>
```

JavaScript で以下のように記述(以下の例ではhidden以外を再構築するように指定)

```
$(function(){
    $( "#dataform" ).sisyphus( {
        locationBased: false,
        excludeFields: $('input[type="hidden"]'),
        autoRelease: false
    } );
});
```

この例では `autoRelease` を無効にしているので、ローカルストレージのデータを手動で削除する必要がある。

最終的なsubmit処理の時に、以下のような onclick動作を追加して、ローカルストレージを削除する。

```
onclick="localStorage.clear();return true;"
```

その他パラメータなどは、プラグイン付属のドキュメントもしくは公式サイトを参照。

更新履歴

現在との差分

過去のナレッジの内容

現在のナレッジの内容