0

私のdjangoアプリでは、buttonwhichを持つページを表示していstarts and stops a clockます。ページには、formユーザーが名前、説明などの詳細を入力して送信できる場所があります。最初は、divこのフォームを含むものdisplay:noneは css で非表示になっています。ボタンのみが表示されます。クリックすると時計が動き始めます。ユーザーが同じボタンをもう一度押すと、時計が止まり、非表示のフォームが表示されます。

ボタンにステータス値を与えるjavascriptを使用してこれを行いました-「開始」と「停止」。ユーザーがクリックした場合に関数を作成し、それに応じてステータスを変更しました。

var buttonStatusChange= function(){
    var buttonstatus = $('#clockbtn').attr("value");
    if (buttonstatus == "start"){
        $('#clockbtn').attr("value","stop");
        ...
        hideElement("userinputdiv");
    }else if (buttonstatus == "stop"){
        $('#clockbtn').attr("value","start");
        ...
        showElement("userinputdiv");
    }
};

var showElement=function(elementId){
    var elem_selector='#'+elementId;
    $(elem_selector).show();  
};
var hideElement=function(elementId){
    var elem_selector='#'+elementId;
    $(elem_selector).hide();
};

私の django ビューでは、投稿でuserinputformおよびその他を検証しています。検証が失敗した場合、元のフォームが表示されます (フィールドの横にエラーが表示されます)。forms

def my_view(request,...):
    if request.method=='POST' and otherform.is_valid():
        ...
        userinputform_is_valid = userinputform.is_valid()
        if not userinputform_is_valid:
            return custom_render(request,context,template_name)
        ...
        #otherwise get values from form,save etc..

def custom_render(request,context,template):
   req_context=RequestContext(request,context)
   return render_to_response(template,req_context)

ページのhtml

....
<div id="userinputdiv">
    ....
    <form ...>
     <p>
  <span id="myfield">Enter WholeNumber:</span>
  {{my_form.myfield}}{{my_form.myfield.errors}}
  </p>
   ...

残念ながら、css には userinputdiv の display:none があるため、その div は隠されているため、ユーザーはエラーを見ることができません。現在表示されているのは、クロックを開始/停止できるボタンが 1 つだけのページです。ページ、エラーがあります<ul class="errorlist ...>

したがって、投稿中に検証エラーが発生した場合に、userinputform をユーザーに表示する方法を考えていますuserinputdiv display:block。実行..そして、ポストで送信され、djangoビューで処理される隠しフィールドとして時計の開始時刻と終了時刻を使用しているため、それが発生したくありません

4

1 に答える 1

0

同じ状況で私は Ajax を使用しています。サーバーからエラーが発生した場合は、これをフィールドに動的に追加します (プレースホルダーに書き込みます)。また、Ajax バリアントを使用すると、jquery の AjaxStart-AjaxStop 関数を使用してクロックを実行および停止できます。

于 2012-11-30T09:16:33.753 に答える