7

私のhtmページでは、関数を使用してフォームを送信するボタンを使用したいと考えています。フィールドで検証を使用し、送信ボタンを押すとエラーメッセージが表示されますが、最後の値は保持されず、フォームが更新されます。入力した値がそこに存在し、エラーメッセージのみのフィールドだけが消えることを望んでいます。他のすべてのフィールドはそこに残ります。これが私のコードです：

     <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head>
    <!--<meta http-equiv="refresh" content="text/html; charset=iso-8859-1" />-->
    <!--
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    -->
    <title>Phone Registration</title>
    <link rel="stylesheet" type="text/css" href="file:///C|/xampp/htdocs/track/css/view.css" media="all"/>
    <script type="text/javascript" src="file:///C|/xampp/htdocs/track/javascript/view.js"></script>
    <script type="text/javascript" src="file:///C|/xampp/htdocs/track/javascript/external.js"></script>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />
    <script src="http://code.jquery.com/jquery-1.8.3.js"></script>
    <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>

    <script>
        $(function() {
            $( "#datepicker" ).datepicker();
        });
        </script>

    </head>
    <body id="main_body" >
        <img id="top" src="file:///C|/xampp/htdocs/track/images/top.png" alt=""/>
            <div id="form_container">
            <h3>
                <a href="file:///C|/xampp/htdocs/track/phonereg.php">Phone Registration</a>
                <a href="file:///C|/xampp/htdocs/track/officerreg.php">Officer Registration</a>
                <a href="file:///C|/xampp/htdocs/track/customerreg.php">Customer Registration</a>
                <a href="file:///C|/xampp/htdocs/track/taskentry.php">Task Entry</a>
            </h3>       
            <form  name="order" id="form_532698" class="appnitro"  method="post" action="" >
                <div class="form_description">
                <h2>Phone Registration</h2>
            </div>                      
            <ul >
              <li>
              <span>
                <label class="description">IMEI # : </label>
                <input name="imei" id="imeinum" class="element text medium" type="text" maxlength="15" value=""/> 

                </span>
              </li>
              <li>
              <span>
                <label class="description" >Phone Number </label>
                <input name="phone" id="phnum" class="element text medium" type="text" maxlength="11" value="" onblur="validate(this)"/>  

                </span>
              </li>
              <li>
              <span>
                <label class="description" >From Date </label>
                <input id="datepicker" name="fdate" class="element text medium" maxlength="10" value="" type="text"/>
                </span>
              </li>
              <li>
              <span>
                <label class="description" for="element_4">Active </label>
                <input name="r1" id="rad" class="element radio" type="radio" value="Yes" checked="checked" />
                <label class="choice">Yes</label>
                <input name="r1" id="rad" class="element radio" type="radio" value="No" />
                <label class="choice">No</label>
                </span>
              </li>

              <li>
              <input type="button" name="save" value="Save" />
              </li>

              <!--
              <li class="buttons">
                    <input type="hidden" name="form_id" value="532698" />
                    <input class="button_text" type="submit" name="save" value="Save" id=""  />
                    &nbsp;<input class="button_text" type="reset" name="cancel" value="Cancel" />
                    &nbsp;<input class="button_text" type="submit" name="search" value="Search" id="" />
                    &nbsp;<input class="button_text" type="submit" name="up" value="Update" id=""  />
                    &nbsp;<input class="button_text" type="submit" name="del" value="Delete" id="" />
              </li>
              -->
            </ul>
            </form>
    </div>
    <img id="bottom" src="file:///C|/xampp/htdocs/track/images/bottom.png" alt=""/>

    <script type="text/javascript" language="JavaScript">
//submit form
document.order.submit();
</script>
    </body>

</html>

どうすればこれを行うことができますか? 私はあなたに感謝します

4

4 に答える 4

0

e.preventDefault();または_return false;

于 2012-12-19T12:23:04.727 に答える
0

$(function())で検証が成功したかどうかを確認し、そうでない場合は false を返します。それ以外の場合は true を返します...

<script>
$(function() {
    $( "#datepicker" ).datepicker();
    if(!validation) {
        return false;
    }
    return true;
});
</script>
于 2012-12-19T12:25:13.830 に答える
0

これには、PHP (サーバー側) と JavaScript (クライアント側) の 2 つの主要な方法があります。

PHPソリューションはそれほどきれいではありません。ページを更新し、そこで値を確認し、valueすべての入力に正しい値を設定する必要があります(削除したいものを削除します)

javascript/jQuery ソリューションはよりクリーンです<input type='submit' />。javascript 関数を呼び出すボタンを使用する代わりに、すべての入力をチェックし (チェックするサーバー情報が必要な場合は Ajax を使用できます)、エラーを表示し、間違っていたものだけを設定します。空欄。

どちらの方法でも問題ありませんが、javascript による方法の方が制御/更新がはるかに簡単で、ページが更新されないため、よりユーザー フレンドリーです。

于 2012-12-19T12:30:43.313 に答える
0

このコードを使用して、検証が失敗した場合にフォームがサーバーに送信されないようにすることができます。

$("form").on("submit", function(event){
  if(!isValidForm($(this)){
    event.preventDefault();
  }
});

おそらく isValidForm() メソッドはフォームセレクターを取り、フォームが有効な場合は true を返し、そうでない場合は false を返します。

于 2012-12-19T12:31:11.600 に答える