2017-01-27 8 views
0

ページが読み込まれたときに非表示になる2つのフォーム(ログインフォームは非表示)があります。ユーザーはボタンでそれらの間を切り替えることができます。ログインに失敗すると、エラーが発生し、ログインフォームに表示されます。問題は、ログインが失敗した後にページが読み込まれ、ログインフォームが非表示になり、「レジスタ」フォームが表示される場合です。ユーザーがログインフォームボタンをクリックしたときにのみ、エラーが表示されます。ページがリロードされたときにエラーが発生したフォームを表示したい。子クラスjQueryに基づいてhtml要素を隠す

$(document).ready(function(){ 
    $('#login_form').hide(); 
}); 

これはhelp-blockは、エラーがフォーム

である場合にのみこれは良い動作しますが、ページがロードされると、それはすべてのフォームを非表示に追加されます私のログインフォーム

<form action="/login" method="post" id="login_form"> 
{{csrf_field()}} 

<div class="form-group{{ $errors->has('email') ? ' has-error' : '' }}"> 
<input type="text" name="email" id="login_email" placeholder="Email"/> 
@if ($errors->has('email')) 
<span class="help-block"> 
    <strong>{{ $errors->first('email') }}</strong> 
</span> 
@endif 
</div> 

<div class="form-group{{ $errors->has('password') ? ' has-error' : '' }}"> 
    <input type="password" name="password" id="login_pass" placeholder="Password"/> 
    @if ($errors->has('password')) 
<span class="help-block"> 
    <strong>{{ $errors->first('password') }}</strong> 
</span> 
    @endif 
    </div> 

    <div class="form-group"> 
    <input type="submit" class="btn" id="login_sbt_btn" value="Login"/> 
    </div> 

</form> 

です最初。

var $errorField = $('.has-error');  
if($errorField) {      
    $('form').hide();     
    $errorField.closest('form').show(); 
} else { 
    $('#login_form').hide();    
} 
+0

エラー要素を両方のフォームの外に移動するだけでは(送信ボタンと同じレベル)、なぜでしょうか?lengthプロパティは次のようにチェックする必要があります。 – APAD1

答えて

1

$は、配列のようなオブジェクトを返します。

var $errorField = $('.has-error');  
if($errorField.length != 0) {      
    $('form').hide();     
    $errorField.closest('form').show(); 
} else { 
    $('#login_form').hide();    
} 
+0

@NaveenKumar 'if($ errorField)'は(要素が見つからなかったとしても)常に 'true'になります。 '$'は常にオブジェクトを返します(オブジェクトは決して虚偽ではありません)。 –

関連する問題