2017-04-05 19 views
0

私は現在、自分のHTMLコードに2つのフォームを持っています。フォームの1つ(id = "feedback")にはstyle = "display:none"が割り当てられ、フォームを非表示にします。もう1つのフォーム(id = "search")は、ユーザーに入力を要求します。テキスト入力が空の場合、入力を入力するようユーザーに警告します。それ以外の場合は、フォームから提出し、最初から非表示になっているフィードバックフォームを表示します。フォームを送信した後に隠しフォームを表示するにはどうすればよいですか?

私が問題になっているのは、投稿が完了すると、フィードバックフォームがページに留まらず、分割された秒間だけ表示されるということです。

ここはJsBinのコードです。あなたはライブプレビューでそれをレンダリングするときには、私の正確な問題を示しています

JsBin

function validateForm() 
{ 
    var x = document.getElementById("input").value; 
    if (x == "") 
    { 
     alert ("Please enter valid ID number"); 
     return false; 
    } 
    document.getElementById("feedback").style.display = "block"; 
} 

<form id = "search" onsubmit = "return validateForm();"> 
    <h3> ID Number: </h3> 
    <input type = "text" name = "idno" id = "input"> 
    <input type = "submit" value = "Submit"> 
</form> 

<form id = "feedback" style = "display:none"> 
    <h1> Leave a Feedback! </h1> 
    <h3> Found? </h3> 
    <input type = "radio" name = "found" value = "yes" checked> Yes <br> 
    <input type = "radio" name = "found" value = "no"> No <br> 
    <input type = "submit" value = "Submit"> 
</form> 

誰かが私は私のコードとどのように私が望む結果を達成するためにと間違って何を知らせることができますか?

答えて

0

機能validateForm(の終わりに戻り偽)

0

フォームは、ブラウザURLにエンコードされたデータでGETリクエストを送信し、その結果のHTMLを表示するように指示を提出します。だからこそ隠されたフォームは簡単にしか表示されません。

隠しフォームHTMLをサーバーから返すか、AJAXを使用するようにフォームを変更することができます。

関連する問題