基础的async = false解决方法

时间:2015-08-01 21:27:02

标签: jquery ajax zurb-foundation

我希望摆脱async = false但我似乎找不到合适的工作

$(document).foundation({
  abide : {
    validators: {
      checkUser: function(el, required, parent) {
        var result = $.ajax({ 
          type: "GET", 
          url: "../functions/checkUsername.php",
          data:{
            'username': el.value
          }, 
          async: false 
        }).responseText;
        return eval(result);
      }
    }
  }
});

FYI:checkUsername.php返回true或false

我尝试了几种不同的方法,但似乎无法找到修改此功能的最佳方法。

1 个答案:

答案 0 :(得分:0)

这就是我最终想出来的最终结果。第一部分是在检查失败时将字段标记为无效的功能。第二个允许您通过php或您正在使用的任何内容检查您的数据库。

第一个函数还允许您发送一个字符串,以便您可以更改错误框中的消息集,以防您拥有设置的格式,而不是显示覆盖每个案例的大型消息。

我的php脚本返回1或0. 1表示用户名可用0如果不是。

$(function(){   
    // Mark Invalid for Username Checks
    $.fn.markInvalid = function(text) {
        $(this).filter(":input").each(function(i, el) {
            console.log($(this).val());
            var input = $(el);
            var container = input.closest(".row");    
            var label = container.find("label");    
            var error = container.find(".form-error");
            label.addClass("is-invalid-label");
            input.attr("data-invalid", "").addClass('is-invalid-input');
            if(text){ error.text(text).addClass('is-visible'); }
        });
    };

    $("#usrnme").on("valid.zf.abide", function(e){
        $.post( "checkUsername.php", {'username': $('#usrnme').val()}, function( data ) {
            if(data!=1){ $(e.target).markInvalid('The username you entered is already taken.'); }
            else{ $('#changeUSR').html('The username must only contain lowercase letters or numbers.'); }
        });
    });
});

HTML代码

<div>
    <label class="label">Username</label>
    <input type="text" name="username" id="username" >
    <span id="changeUSR" class="form-error">The username must only contain lowercase letters or numbers.</span>
</div>