-1

ユーザー名フォームがあります。ユーザー名とパスワードの 2 つのフィールドがあります。基本的に私はそれが欲しいので、ユーザーがフィールドに入力せずに「送信」を押した場合、「必須フィールドを入力してください」のようなエラーが表示されます

JavaScriptまたはPHPで可能であることは知っていますが、その方法はわかりません。

ユーザーとパスワードのフォームのコードは次のとおりです。

<div id="sessionContainer" class="clearfix">
  <div class="content">
    <form action="goto.php" class=" sign-in" method="post">
      <div style="margin:0;padding:0"></div>
      <h3>Enter Details</h3>
      <p><font size="-1">Please enter your details</font></p><br>
      <div class="clearfix">
        <label for="">Username or email address</label><br>
        <input class="xlarge" id="email" name="email" tabindex="1" type="text" value="" />
      </div>
      <div class="clearfix">
        <label for=""><br>
          Password</label><br>
        <input class="xlarge" id="password" name="password" tabindex="2" type="password" value="" />
      </div>


      <p class="remember">&nbsp;</p>
      <p class="remember">
        <button class="btn btn-m btn-blue" id="signin_submit" name="commit" type="submit" tabindex=5>Sign in</button>
      </p>

ありがとう

4

6 に答える 6

2 
<?php if(!isset($_POST['email']) || !isset($_POST['password'])

このコードは、これらのフィールドのいずれかに値があるかどうかを確認します。そうでない場合は、エラー メッセージを出力できます。コンテキスト全体のコードは次のとおりです。

<?php if(!isset($_POST['email']) || !isset($_POST['password']): ?>
    <div>Please fill in all fields!</div>
<?php endif; ?>
于 2013-03-13T17:57:32.290 に答える
1

これは私の答えです...古典的なjavascript xDで：

<html>
  <head>
  <script type="text/javascript">
  function validar()
  {
     var right = 1;

     if(document.getElementById('email').value.length==0)
     {
        right = 0;
        document.getElementById('emptymail').innerHTML = "Empty Mail o Username";
     }
     if(document.getElementById('password').value.length==0)
     {
        right = 0;
        document.getElementById('emptypass').innerHTML = "Empty Password";
     }

    if(right == 1)
    {
      document.forms["formu"].submit();
    }

  }
  </script>
  </head>
  <body>
  <form action="goto.php" class=" sign-in" method="post" name="formu" id="formu">
        <div style="margin:0;padding:0"></div>
        <h3>Enter Details</h3>
        <p><font size="-1">Please enter your details</font></p><br>
        <div class="clearfix">
          <label for="">Username or email address</label><br>
          <input class="xlarge" id="email" name="email" tabindex="1" type="text" value="" /><div id="emptymail"></div>
        </div>
        <div class="clearfix">
          <label for=""><br>
            Password</label><br>
          <input class="xlarge" id="password" name="password" tabindex="2" type="password" value="" /><div id="emptypass"></div>
        </div>


        <p class="remember">&nbsp;</p>
        <p class="remember">
          <button class="btn btn-m btn-blue" id="signin_submit" name="commit" type="button" tabindex=5 onclick="validar();">Sign in</button>
        </p>

  </form>
  </body>
  </html>

サルドス ;)

于 2013-03-13T18:12:06.850 に答える
0

検証にはjQueryValidateを使用します

こちらからダウンロードしてお電話ください。次に、このコードを追加します

rules:
{
    email:
    {
        required: true
    }

},
messages:
{
    email:
    {
        required: "Please enter your email."
    }
}

または単にHTML5検証を使用する

<input id="email" name="email"  type="text" value="" required />
于 2013-03-13T18:00:10.673 に答える
0

属性を使用するHTMLのみのソリューションrequired（新しいブラウザーでのみ機能します）：

<input required="required" />

jscriptベースのソリューションを実行する方法の例は、ここ、ここ、またはjqueryのヘルプが少し付いたこのソリューションにあります。

于 2013-03-13T17:58:46.470 に答える
0 
var $form = $('form'),
    $user = $('#email),
    $pass = $('#password');

$form.on('submit', function(e) {
    e.preventDefault();   // stop the default behavior
    if ($user.text().length === 0) {
        $user.addClass('error'); // do something with the error class or add attribute 'required'
    } else if ($pass.text().length === 0) {
        // do something else
    } else if ($user.text().length > 0 && $pass.text().length > 0) {
          // post the form
          $.ajax({
              url: //URL where you send,
              data: $form.serialize(),
              success: function(e) { // do something },
              error: function(e) { // do something }
        });
    }
}
于 2013-03-13T18:09:16.993 に答える
0

JavaScript を使用してそれを行うには、フォームの OnSubmit 属性を探しています。

OnSubmit で呼び出した関数が失敗した (false を返す) 場合にできることはたくさんありますが、例として、このコードはポップアップ ボックスを表示します。

<script>
function checkForm()
{
  if (document.getElementById('email').value.length==0 || document.getElementById('password').value.length==0)
  (
    alert("fill in required fields")
    return false;
  )
  return true;
}
<script>

次に、フォームタグに入れます

<form onsubmit="return checkForm()" ...
于 2013-03-13T18:03:17.343 に答える