0

単純な php/mysql/js プロジェクトでは、ユーザーがいくつかのフォームをカスタマイズできるようにする必要がありました。だから私はこのページを書いたので、ユーザーはデフォルトのフォームを編集し、独自の入力を追加し、それらをドラッグして好きなように配置できます.

今私の質問は、どうすれば最終結果を保存できますか? 各入力のスタイルを mysql に入力する必要がありますか? または、すべての入力のすべての css を抽出し、それらをテキストとして mysql に保存する必要がありますか?

何か案は ？

フィドルの例

ここに私のコードhtmlがあります

<h1>Form editer</h1>
<div id='form' style="position:relative;width:100%;border:1px dashed grey"></div>
<div id="generator">
   <label for="label">label</label><input type="text" value="" name="label">
   <label for="system">System name</label><input type="text" value="" name="system">
   <label for="type">input type</label><select name="type">
   <option value="input">input</option><option value="dropdown">dropdown</option</select>
   <label for="value">value</label><input type="text" value="" name="value">
   <button type="button" name="generate">generate</button>
   <div style="border:1px solid;width:250px;height:50px;margin: 0 auto;" id="tempo"></div>
   <button id="add_2_form" type="button" name="add to form">add to form</button>
</div>

Js (プラグイン: jquery,draggable)

$('button[name="generate"]').click(function(){
    var html,
    label=$('#generator input[name=label]').val(),
    sys=$('#generator input[name=system]').val(),
    type=$('#generator [name=type]').val(),
    value=$('#generator input[name=value]').val(),x;

    if(type == 'dropdown'){
        html='<label for="'+sys+'">'+label+'</label><select name="'+sys+'">';
        arr=value.split(",");
        for (x in arr)
        {
        html=html+'<option value="'+arr[x]+'">'+arr[x]+'</option>';
        }
        html=html+'</select>';
        $('#tempo').html(html);
    }else{
        html='<label for="'+sys+'">'+label+'</label><input type="'+type+'" name="'+sys+'" value="'+value+'">';
        $('#tempo').html(html);
    }
});
$('#add_2_form').click(function(){
var html='<p>'+$('#tempo').html()+'</p>';
    $('#form').append(html);
    $('#form p').css('border','1px dashed blue').draggable();
});

ここに画像の説明を入力

これはこれまでの私のコードですが、ユーザーがフォームを作成してすべての入力をドラッグした後、フォームを保存するにはどうすればよいですか?

4

1 に答える 1

0

独自のポジショニング メカニズムを構築し、それらをセッションまたは Cookie (PHP を使用) またはローカル ストレージ (JavaScript を使用) に保存する必要があります。ユーザーがこのページに 2 回目にアクセスしたときに、古い設定の存在を確認し、保存した内容に合わせて位置を設定して UI を復元します。

name最も単純なメカニズムは、要素(またはid) とそのtop, left, ... 値を格納することだと思います。

于 2013-01-19T13:22:52.487 に答える