BLOG ENTRY

JSでformに入力された値をPOSTしたりバリデーションかけたり

javascript

初歩的なスクリプトですが、けっこー使うとこ多いのでメモメモ。


『submit』や『button』を画像にしたい場合、formに入力された値やhiddenの値をJSで同じページ内でPOSTをするときに便利。


<?php
$value=$_POST['post_data'];
?>
<html>
<head>
<script type="text/javascript">
function test_Post(){
document.name1.submit();
}
</script>
</head>
<body>
<form name="name1" method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>" >
<input type="text" name="post_data" />
<a href="javaScript:test_Post()"><img src="" alt="POSTボタン" /></a>
<p>↓↓これがPOSTされたデータ↓↓</p>
<p><?php echo $value; ?></p>
</body>
</html>


少し展開してメールアドレスのバリデーションをつけてみる。

<?php
$value=$_POST['email'];
?>
<html>
<head>
<script type="text/javascript">
function test_Post(){
if(!document.name1.email.value.match(/^[\w_-]+@[\w\.-]+\.\w{2,}$/)){
alert('正しいメールアドレスを入力して下さい。');
return;
}
document.name1.submit();
}
</script>
</head>
<body>
<form name="name1" method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>" >
メールアドレス:<input type="text" name="email" />
<a href="javaScript:test_Post()"><img src="" alt="POSTボタン" /></a>
<p>↓↓これが正規表現チェックOKなメールアドレス↓↓</p>
<p><?php echo $value; ?></p>
</body>
</html>

関連記事

  1. $_SERVER['PATH_INFO']でやる擬似rewrite[PHP]
  2. CakePHP1.2でRSS2.0を出力する[RSS][CakePHP]
  3. PHP5でxml_parse_into_struct()でXMLをパースできない
  4. AS3で外部JSONデータ読み込みのカスタムイベント[AS3][JSON]
  5. 外部複数ブログのRSS情報をWordPress上で表示する[WordPress]

WRITE COMMENT


(required)


(required)


(required)

MENU