PHPによるLeanModalの実装

フィールドフィールドのいずれかが無効であるか、フォームが正常に送信されたかどうかをユーザーに知らせるために、送信ボタンがクリックされたときにLeanModal関数をトリガする方法。

送信/送信ボタンをクリックした場合:

  • check PHP event handler within the same sheet
  • Display the result on the LeanModal
    • If it is successful then text displayed in modal, all fields in the form are empty.
    • If not, then text displayed in modal, the invalid fields in the forms are highlighted.

これらはすべてcontact.phpに関連するすべてのファイルです:

  1. contact.php(私が作業しているメインシート)
  2. validate.php(contact.phpにインポートしてフォームフィールドを検証する)
  3. validate.js(このファイルの関数はcontact.phpで呼び出されています)
  4. Leanmodal.js

contact.php:

<head>
<script type="text/javascript">
$(function() {
$('a[rel*=leanModal]').leanModal();     
});

</script>
</head>

<body>
<div id="content">

<?if( isset($_POST['send']) && (!validateName($_POST['name']) || !validateSurname($_POST['surname']) || !validateEmail($_POST['email']) || !validateMessage($_POST['message']) || !validateHuman($_POST['human']) ) ):?>  

<div id="error">  
   
    <?if(!validateName($_POST['name'])):?>
  • Invalid Name:Required more than 3 letters!
  • <?endif?> <?if(!validateSurname($_POST['surname'])):?>
  • Invalid Surname:Required more than 3 letters!
  • <?endif?> <?if(!validateEmail($_POST['email'])):?>
  • Invalid E-mail:Invalid email-address format!
  • <?endif?> <?if(!validateMessage($_POST['message'])):?>
  • Invalid Message:Required more than 3 letters
  • <?endif?> <?if(!validateHuman($_POST['human'])):?>
  • Answer Incorrect:Human Validation Failed
  • <?endif?>
  

</div> 

   <?elseif(isset($_POST['send'])):?>  
   <div id="error" class="valid">  
     
  • Congratulations!
  
   </div>  
   <?endif?>

<form method="post" id="customForm" action="contact.php">
   .
   .
   .
<input id="send" name="send" type="submit" value="Send" />
</form>

<script type="text/javascript" src="js/validation.js"></script>

</div>
</body>
3
これはjQueryを使用していますか?また、最初の段落をもう少し細かく分解できますか?それは非常に明確なatmではありません。
追加された 著者 halfer,
フォローアップしないために-1!
追加された 著者 halfer,
あなたのコードは何をしてはならないとしていますか?あなたのコードは何をしていなければならないのですか?問題が何であるかはあなたのポストからは不明です。
追加された 著者 user212218,
はいLeanModalはjqueryプラグインです。
追加された 著者 Modular,
この行をシート上のどこかに置いてこのテキストは必要ありませんと入力すると、<div id = "error">セクションをフォームセクションの上のcontact.phpの代わりにモーダルウィンドウに表示するだけですが、問題は私が最初に "Send"ボタンをクリックしてcontact.phpに表示されるメッセージを取得し、 Dont Want This Text "リンクをクリックすると、最後にエラーメッセージがモーダルに表示されます。
追加された 著者 Modular,

1 答え

あなたの質問はまだ私には完全にはっきりしていないので、私は答えるときにいくつか前提をします。私はLeanModalに慣れていないので、ドキュメントをチェックする価値があるかもしれません。 (これは主にjqueryの質問のように感じるので、あなたのタグに 'jquery'を追加することをお勧めしますか?)。

PHPベースの検証システムがあるようですが、JavaScriptを使用してエラーを表示する必要があります。あなたはそれについて言及していませんが、これはjQueryで簡単なAJAX opの候補のようです。あなたのフォーム提出のクリックイベントをキャプチャする必要があります:

$(document).ready(function() {
    $('#send).click(function() {
       //Do ajax op here

        return false;
    });
});

ご覧のように、DOM readyイベントの代わりに設定されています。正しく検証するためには、フォームの内容をサーバーに送信する必要があります(ここから始めてください)。私はあなたのためにこれを行うjQueryのための優れたフォームプラグインがあることを覚えているようです - それをチェックアウトしてください(またはあなたは手動でフォームの値を取得できます)。

検証結果はおそらくJSON回答を返します。jQueryで受け取った場合、モーダルダイアログボックスまたはすべてがOKであるdivが表示されます。

私の設計仮定が正しい場合は、それを試してください。ウェブ検索をしたり、ここで補足的な質問をしなければならないかもしれません:-)

0
追加された
PHP - 日本のコミュニティ [ja]
PHP - 日本のコミュニティ [ja]
4 参加者の

このグループではPHPについて話します。 パートナー:kotaeta.com