1

私は機能を持っています：

function validateForm() {
    var result = ''
    $.get(
        '/auth_validate_username/', 
        { 'result': result }, 
        function(data) {
            if (data!=='') {
                // make function validateForm return false
            }
        }
    );
};

getリクエストの上の機能に適用される私の状態で何かをする方法があるかどうか知りたいです。

私が正確にやりたいことは、get リクエストで条件が満たされた場合、関数validateForm()が false を返すことです。

それを達成する方法はありますか？

編集：これが私が試したことです

js:

   var validateResult;    

   $('#but_id').click(function(event){

    validateForm().done(function(){       

     if(!validateResult)
         event.preventDefault();
   });
   })

  function validateForm() {
    var result = ''

   return $.get(
     '/auth_validate_username/', 
     { 'result': result }, 
     function(data) {
        if(data!==''){

      validateResult = false;
     }
     }
     );    
    };

html:

 <form  method="post" onsubmit="return validateForm();">

    <input id='username' type="text" name="username"/>

<button type="submit" id='but_id'>Submit</button>

     </form>
4

4 に答える 4

2

次のようなことをしようとしていると思います：

if (validateForm()) {
    doSomething();
}
else {
    displayError();
}

代わりに、次のようにします。

function validateForm(){
  //...
  $.get(
    '/auth_validate_username/', 
    { 'result': result }, 
    success: function(data) {
      doSomething();
    },
    error: function(data) {
      displayError();
    }
  );
}

サーバーがそれに応じて応答することを確認するだけです。200つまり、サーバーはへのすべてのリクエストに対して成功したレスポンスを生成するべきではありません/auth_validate_username。

$.getの省略形です$.ajax()。コールバックの詳細については、ドキュメントを参照してください。

あなたのコメントごとに！

function doSomething(data, textStatus, jqXHR) {
  $('form').submit();
}
function displayError(jqXHR, textStatus, errorThrown){ ... }
function validateForm(event){
  $.ajax(
    url: '/auth_validate_username/',
    data: {"result": result},
    success: doSomething,
    error: displayError
  );
  return false; // prevent default form submit
}
$('form').submit(validateForm);

これが最初からあなたの目標であったことを知っていればよかったのに。

于 2012-12-21T10:09:55.570 に答える
0

同期呼び出しを使用すると、ajax 呼び出しを開始するときに「async: false」で必要なものを実装できます。Chromeコンソールで試して動作します。

function validateForm() {
  var result = ''
  var retval=true;

  $.ajax(
    '/auth_validate_username/', 
    {
      async: false,
      data: { 'result': result }
    }
  ).done(function ( data ){
    if(data !== ''){
      retval = false;
    }
  });
  return retval;
};
于 2012-12-21T10:10:15.103 に答える
0

関数呼び出しで done を使用してみてください。

htmlで

<input type ="button" id="yourButtonId" value="submit" />

JavaScriptで 

var validateResult;    

$('#yourButtonId').click(function(event){

   validateForm().done(function(){       
         //your code      
         if(!validateResult)
             event.preventDefault();
    });
})

function validateForm() {
  var result = ''

  return $.get(
    '/auth_validate_username/', 
    { 'result': result }, 
    function(data) {
        if(data!==''){
    // make function validateForm return false
          validateResult = false;
    }
    }
  );    
};
于 2012-12-21T10:03:59.440 に答える
0

関数が完了すると、ajax が完了します。したがって、あなたが探していることを行う方法はありません。デザインを再配置するか、get の成功関数からフォームを送信します。

これが回避策での私のクレイジーなアプローチです

var validating = false;
var safeSubmit = false;
function validateForm()
{
 validating = true;
 $("#formElementId").ajaxStop(function () {
  if( !validating ) return;
  if( safeSubmit ) $(this).submit();
  validating = false;
  $(this).unbind("ajaxStop");
 });
 var result = ''
 $.get(
    '/auth_validate_username/', 
    { 'result': result }, 
    function(data) {
        if (data!=='') {
            // make function validateForm return false
        }else{
          safeSubmit = true;
          //this could also simply be
          //$("#formElementId").submit();
        }
    }
 );
 return false;
}
于 2012-12-21T10:07:38.933 に答える