基本、自転車での移動ですし洗濯もできません。
今日の本題はこれです。
よくあるフォームの登録画面ですね。
これを送信した後、更新するとこのうざいヤツが出ます。
今日はこれを出ないようにしました。
<html>
<body>
<head>
<script type="text/javascript" src="js/jquery-1.6.2.min.js" charset="utf-8"></script>
<script type="text/javascript" src="js/jquery.form.js" charset="utf-8"></script>
<script>
$(document).ready(function() {
$("#form1").submit(function(){
if($("input:text[name='name']").val() == ""){
alert("名前を入力してください");
}
else if(!$("input:radio[name='gender']").is(":checked")){
alert("種類を選択してください");
}
else{
var options = {
success: function(response){
if(response == "success"){
$("#registMsg").empty().append("登録を完了しました。")
}
else{
$("#registMsg").empty().append("登録済みのアカウント名です。")
}
}
}
$(this).ajaxSubmit(options);
}
return false;
});
});
</script>
</head>
<form action="" method="post" id="form1">
<p>名前<input type="text" name="name"/></p>
<p><input type="radio" name="gender" value="male"/>男性
<input type="radio" name="gender" value="female"/>女性</p>
<input type="submit" value="登録">
</form>
<p id="registMsg"></p>
</body>
</html>
使ったのはjQuery Form Pluginです。
これのajaxSubmit()を使いました。
jQueryでformのsubmit時の動作を定義します。
例では値の空チェックとかやってます。
ajaxSubmitがちゃんと行われた後の動作をオプションで指定し、
呼び出します。
登録用のphpにprintとかでレスポンス用のメッセージを出力します。
それで判定に応じた結果を返します。
最後はreturn false;です。
これをしないと通常のsubmitを行ってしまいますので気を付けてください。

0 件のコメント:
コメントを投稿