0

私が構築しているページ作成ウィザードがあり、ユーザーが最大 3 つの画像をページに追加できるようにしています。私が現在使用しているコードは仕事を成し遂げますが、私が望むようには機能しません。私のページウィザードでは、これはファイル入力を含むhtmlです:

<div class="pictures">
    <label>Add Pictures </label><span>(Maximum: 3)</span>
    <span id="input_container"></span>
    <a href="javascript:addPic()">add</a> |
    <a href="javascript:rmvPic()">remove</a>
</div>

私のjavascriptは次のようになります：

var picNum = 0;

function addPic() {
    if (picNum < 3) { picNum++;
        var input = document.createElement('input');
        input.setAttribute('type', 'file');
        input.setAttribute('name', 'picture_' + picNum);
        input.setAttribute('id', 'picture_' + picNum);

        var container = document.getElementById('input_container');
        container.appendChild(input);
    }
}

function rmvPic() {
    if (picNum > 0) {
        var container = document.getElementById('input_container');
        container.removeChild(document.getElementById('picture_' + picNum));
        picNum--;
    }
}

この現在の設定では、ユーザーはページに必要な量の画像を動的に追加できますが、フォームを送信してページを編集するために戻った後、追加したすべての要素がページから削除されます。ユーザーが戻ってきて画像を変更したいときに、追加した画像の量と値をウィザードが記憶するようにしたいと思います。

私の言っていることが理にかなっているかわからないので、さらに情報が必要な場合は、喜んで提供します。あなたがそれを知る必要があるなら、私はRuby on Railsを扱っています。

4

1 に答える 1

0

「編集ページに戻る」と言うとき、ページの読み込みが発生することを意味していると思います。その場合、画像が追加された送信ページの状態が失われます (javascript vars がリセットされます)。送信を実行した場合、探している値がサーバー上に存在する必要があります。したがって、編集ページをリロードするときは、サーバー (ajax) から値を要求するか、ページ スコープで値をレンダリングする必要があります。

ページ間を移動する方法や、送信された値を保存する方法が明確に理解できないため、ここではかなりの仮定を外しています。

つまり、HTML はステートレスなので、ページ間で値を保存する方法が必要です。サーバーに保存するか、ローカルに (Cookie またはローカル キャッシュに) 保存することができます。

アプリがどのように構造化されているかを明確に把握しないと、アプローチをお勧めできません。

于 2012-07-25T21:22:41.640 に答える