編集
これは私が取り組んできた新しいコードです。新しいコードが送信のチェックの外にある場合、ページはサイドインすらせず、新しい URL に移動するだけです! その後、モーダル チェックを読み込みますが、AJAX ファイルを読み込んだばかりなので、これらすべてをプラン ページで行います。
グレン。
$(document).ready(function() {
$('#UserSignUpUserForm').on('submit', function(e) {
if ($('div.error-message').size() == 0) { // if no error messages
$('form').off('submit'); // unbind the form submission.
$('form').submit(); // submit the form now to reload the page.
} else {
e.preventDefault();
$.post($(this).attr('action'), $(this).serialize(), function(res) {
$('form').replaceWith(res);
console.log(res);
})
} //End of if / else check!
})
});
古い投稿
誰かが私を助けてくれて、私の問題の 1 つを解決するためにこのコードをくれましたが、このコードを詳しく調べてみると、100% は機能しません。私は CakePHP を使用しており、管理者にサインアップするユーザーがいて、消灯ボックスに読み込まれます。サインアップ モーダルのパスワードが 8 文字以上で、ユーザー名が一意である必要がない場合。
これで、div が消灯ボックスにロードされたモーダル エラーであることを確認するために、コード (追加したもの) が提供されました。問題は、エラーがない場合、ページ リダイレクトがメイン ブラウザ ウィンドウではなく、ライト アウト ボックスに読み込まれることです。
したがって、以下のコードを変更して、これらまたはこれらのエラーがサーバーから戻ってくるかどうかを確認するチェックを追加しようとしています。
私はJQueryが少し苦手で、PHPの方が私のものです。初歩的なミスがありましたら申し訳ありません.....
$('form').on('submit', function(e) {
var pattern = 'error-meesage'; //I added this
var exists = pattern.test(res); //I added this
if(exists) { //I added this
e.preventDefault();
$.post($(this).attr('action'), $(this).serialize(), function(res) {
$('form').replaceWith(res);
console.log(res);
})
} //I added this
})
これは私に返されるものであり、エラーメッセージdivがそこにある場合は機能しません。リクエストはAJAXによって行われているため、レイアウトなしで新しいウィンドウにロードします!
Uncaught ReferenceError: $ is not defined
どうもありがとう
グレン。
編集
「これを追加しました」とマークした行を削除すると、コードは問題なく動作し、Jquery lib ファイルにアクセスできますが、Cake からレイアウトを停止してロードする可能性があると思います!!
ありがとうグレン。
あなたが要求している編集コードは打撃です::
また、消灯ボックスを取り外したという事実についても更新しますが、私がやっていることは多かれ少なかれ同じことです. 私は今、まだ AJAX を使用しているこれらのページを非表示の div にロードしています。これは、JQuery UI の副作用を使用する側にあります。しかし、同じエラーが発生します。エラーが発生した場合、cake はクラスまたはエラー メッセージを持つ div を使用してモーダルからエラー メッセージを報告します。ただし、エラー メッセージ div がなく、問題なく保存されている場合は、消灯ボックスの場合と同様に、画面の横に表示される div にコンテンツが読み込まれます。
ただし、余分なコードを追加すると、ユーザーがいなくてもページが送信され、側面全体が表示されるようになります。このサイトで作業しています)、投稿の送信を確認するだけです。ただし、送信すると、ページ全体が読み込まれますが、デフォルトのレイアウトの外にあります。たとえば、まだ読み込まれているときに ajax ページがあります。
それが明確になったことを願っています。
これは私のデフォルトのレイアウト ファイルです。
<!DOCTYPE html>
<html>
<head>
<?php
$Header = $this->Html->charset();
$Header .= '<title>XXXXXXXX</title>';
$Header .= $this->Html->meta('icon');
$Header .= $this->AssetCompress->css('CssFile');
$Header .= $this->AssetCompress->script('JSFile');
$Header .= $this->fetch('meta');
$Header .= $this->fetch('css');
$Header .= $this->fetch('script');
echo $Header;
?>
<?php
$MainLayout ='<div id="Logo">' . $this->Html->image('logo.gif', array('alt' => 'top banner')) . '</div>';
$MainLayout .= $this->Session->flash('bad', array('element' => 'FlashError'));
$MainLayout .= $this->Session->flash('good', array('element' => 'FlashGood'));
$MainLayout .= $this->Session->flash('auth', array('element' => 'FlashError'));
$MainLayout .= $this->fetch('content');
echo $MainLayout;
?>
<div class="SideBoxUser"></div> //These are the areas where file loads!
<div class="SideBoxClient"></div>
ユーザーファイル形式 ::
<?php
$this->layout = 'ajax';
$AddUserForm = $this->Form->create('User', array('url' => '/PATH-TO-GO-TO'));
$AddUserForm .= "<h1>Add New User</h1>";
$AddUserForm .= $this->Form->input('username');
$AddUserForm .= $this->Form->input('password');
$AddUserForm .= $this->Form->input('email');
$AddUserForm .= $this->Form->input('role', array('options' => array('user' => 'User','admin' => 'Admin')));
$AddUserForm .= $this->Form->input('clients_id', array('options' => array($AllClients), 'empty'=>true));
$AddUserForm .= $this->Form->submit("SAVE USER", array('class' =>'Button'));
$AddUserForm .= $this->Form->end();
echo $AddUserForm;
?>
<script>
$(document).ready(function() {
$('form').on('submit', function(e) {
e.preventDefault();
$.post($(this).attr('action'), $(this).serialize(), function(res) {
$('form').replaceWith(res);
console.log(res);
})
})
if ($('div.error-message').size() == 0) { // if no error messages
$('form').off('submit'); // unbind the form submission.
$('form').submit(); // submit the form now to reload the page.
}
});
</script>
サイドボックスをロードするための JS ファイル ::
$(".ADDUSER").click(function() { //This is for the text link on my page
$('.SideBoxUser').toggle("slide", { direction: "right" }, 1000);
$('.SideBoxUser').load('/PATH-TO-GO-TO');
});
それがすべてのコードであることを願っています。そうでない場合は、お知らせください....
どうもありがとうグレン。