2016-05-06 7 views
-1

ユーザー名が既に存在し、BSアラートを表示すると、onchangeをチェックする登録フォームがあります。これをチェックする関数はAjaxを使用します。私の以前の質問への答えは、私のコードがAjax関数でコールバックを使用するように改善されました。今私は、一般的なAjaxリクエストを持ってfalse値は無視されます

function checkBestaandeGebruikersnaam(result) { 
if(result == "1") { 
    document.getElementById("message").innerHTML = '<div class="alert alert-warning"><a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a><strong>Let op!</strong> Die gebruikersnaam is al bezet, kies een andere gebruikersnaam.</div>'; 
    return false; 
} 
else { 
    document.getElementById("message").innerHTML = ''; 
} 
} 

HTML::

onchange="callAjax('gebruikersnaam', document.getElementById('gebruikersnaam').value, checkBestaandeGebruikersnaam)" 

JavaScriptの主な機能:

function callAjax(arg1, arg2, callback){ 
var request = new XMLHttpRequest(); 

request.onreadystatechange = function() { 
    if(request.readyState === 4 && request.status === 200) { 
     callback(request.responseText); 
    } else { 
     document.getElementById("message").innerHTML = 'An error occurred during your request: ' + request.status + ' ' + request.statusText; 
    } 
    } 
request.open("POST", "core/functions/checkBestaandeGebruikersnaam.php", true); 
request.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
request.send(arg1+"="+arg2);  
} 

JavaScriptのコールバック関数だから今は、次のコードを持っています私はそれを別のパラメータを与えることによって再利用することができます。だから、ありがとう。コールバック機能を正しく使用しているかどうか確認できますか?

今、私が本当に望むのは、フォームが送信されるときに、checkBestaandeGebruikersnaam()ファンクションを再利用することです。私は、次のコードを持っている:

HTML:

<form action="register.php" onsubmit="return validate()" name="registerForm" method="post" class="col-md-10 col-md-offset-1 col-xs-12 col-xs-offset-0"> 

はJavaScript:

function validate() { 
var errMsgHolder = document.getElementById("message"); 
if(checkPassword() === false) { 
    errMsgHolder.innerHTML = 
      '<div class="alert alert-warning"><a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a><strong>Let op!</strong> Kies een wachtwoord van minimaal 3 en maximaal 30 tekens.</div>'; 
      return false; 
} else if(checkPasswordsMatch() === false){ 
    errMsgHolder.innerHTML = 
      '<div class="alert alert-warning"><a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a><strong>Let op!</strong> Wachtwoorden komen niet overeen.</div>'; 
      return false; 
} else if(checkBestaandeGebruikersnaam() === false){ 
    errMsgHolder.innerHTML = 
      '<div class="alert alert-warning"><a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a><strong>Let op!</strong> Die gebruikersnaam is al bezet, kies een andere gebruikersnaam.</div>'; 
      return false; 
} 

機能checkPassword()checkPasswordsMatch()のAjaxを使用すると、彼らは機能validate()以内に期待どおりに動作しません。しかし、私がcheckBestaandeGebruikersnaam()のために関数validate()をテストすると、うまくいきません。 falseの値は無視され、フォームが送信されます。私は、コールバック関数の使用は、これを解決する必要があると思ったが、明らかに私はまだ間違って何かをやっている。私に教えて、あなたの時間を感謝してください。

+0

http://www.sitepoint.com/javascript-truthy-falsy/) –

答えて

1

を段階的に起こっていただきましたのは評価してみましょう:

validate()機能は、任意のパラメータを渡さずcheckBestaandeGebruikersnaam()を呼び出します。

checkBestaandeGebruikersnaam()の内部では、resultの値は定義されていません。elseブロックが実行され、何も返されません。

validate()では、チェックcheckBestaandeGebruikersnaam() === falsefalseと評価されます。

validate()はfalseを返さないため、これはjavascriptでフォームを送信します。

+0

ご理解いただきありがとうございます。 –

0

私のソリューションを投稿すると、おそらく他の初心者に役立つでしょう。

私は、を変数checkBGで評価することに決めました。その値はcheckBestaandeGebruikersnaam()の 'result'から得られるはずです。checkBGが他の機能に利用可能であるべきであるので、しかし、私はこのように、varキーワードを使用しないことによってそれグローバル変数製:

function checkBestaandeGebruikersnaam(result) { 
checkBG = result; 
if(checkBG == "1") { 
    document.getElementById("message").innerHTML = '<div class="alert alert-warning"><a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a><strong>Let op!</strong> Die gebruikersnaam is al bezet, kies een andere gebruikersnaam.</div>'; 
} 
else { 
    document.getElementById("message").innerHTML = ''; 
} 
} 

をその後、私は私のvalidate()機能で条件としてその変数checkBGを使用:

function validate() { 
var errMsgHolder = document.getElementById("message"); 
if(checkPassword() === false) { 
    errMsgHolder.innerHTML = 
      '<div class="alert alert-warning"><a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a><strong>Let op!</strong> Kies een wachtwoord van minimaal 3 en maximaal 30 tekens.</div>'; 
      return false; 
} else if(checkPasswordsMatch() === false){ 
    errMsgHolder.innerHTML = 
      '<div class="alert alert-warning"><a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a><strong>Let op!</strong> Wachtwoorden komen niet overeen.</div>'; 
      return false; 
} else if(checkBG == "1"){ 
    errMsgHolder.innerHTML = 
      '<div class="alert alert-warning"><a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a><strong>Let op!</strong> Die gebruikersnaam is al bezet, kies een andere gebruikersnaam.</div>'; 
      return false; 
} 
} 

これは実際に働き、拷問の時間は最終的にトリオフをもたらしました!私を助けてくれたKashifにもう一度感謝します。

関連する問題