フォームが有効な値を持たない場合に警告（）ダイアログボックスを表示

Question

テキストボックスとテキストエリアからTitle変数とContents変数を受け取る単純なフォームがあります。フォームはそのデータをadd-post.phpというファイルに送信します。しかし、私は、送信ボタンをクリックした場合、テキストボックスまたはテキストエリアのいずれかに無効なデータ（空白）があることをユーザーに警告する方法を探しています。

私はalert()ポップアップボックスが他のページにリダイレクトされず、ユーザーがデータを失うことはないと考えていました。（テキストをたくさん入力したがタイトルを忘れたとします。データをadd-post.phpに転送し、チェックを実行すると、ユーザーのデータが失われます）。

しかし、私は実際にalert()ポップアップを実装する方法がわかりません。送信ボタンをクリックした後、データが次のファイルに送信される前に、チェックが行われるようにするにはどうすればよいですか。アドバイスをいただければ幸いです。

Answer 1

が他の人のように。また、この

<form name="frm1" onsubmit="InputChecker()"> 

次にJavaScriptで

<script type="text/javascript"> 
function InputChecker() 
{ 
    if(document.getElementById({formElement}) != '') { // not empty 
     alert("This element needs data"); // Pop an alert 
     return false; // Prevent form from submitting 
    } 
} 
</script> 

のようなものを追加しjQueryはこの少し簡単になりますと述べています。私は非常にお勧めします。jQuery Validate Plugin

警告ボックスが「煩わしい」という人がいるので、メッセージをDOMに追加して、何を修正する必要があるかをユーザーに知らせる方がよい場合があります。これは、エラーがより永続的になり、ユーザーが修正する必要があるすべてのものを見ることを可能にするので、多数のエラーがある場合に便利です。ここでも、jQuery Validateプラグインにはこの機能が組み込まれています。

Answer 2

フォームにonsubmitイベントを添付し、チェックが失敗した場合はreturn false;を入力して送信を停止します。

Answer 3

Form validation with Javascript。 Or easier with jQuery。

基本的に、送信ボタンがクリックされたとき（onsubmitハンドラを使用して）フォームを検証し、必要に応じてalert（）ボックスを使用します。ところで、人々は通常警告ボックスを嫌う。フォーム上

Answer 4

クライアント側の検証にはいくつかのオプションがあります。これはただのものです。もっと徹底的例えば

<form id="tehForm" method="post"> 
    <input type="text" id="data2check" > 
    <input type="button" id="btnSubmit" /> 
</form> 
<script type="text/javascript"> 
    function submit_form(){ 
     if(document.getElementById("data2check").value!="correct value"){ 
      alert("this is wrong"); 

     }else{ 
      document.getElementById("tehForm").submit(); 
     } 
    } 
</script>

this link