Foundation Abide with AJAX function

Question

I have been trying to create a check user system to prevent duplicates. The code below returns true or false correctly but for some reason it is not triggering the error class system to display the error.

JavaScript

$(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 result;
        }
    }
}
});

The PHP script checks the username and returns true or false.

If anyone knows what I am doing wrong I will be grateful.

Does your script literally prints true/false? You are getting a string that it will always be true unless it's an empty string. `'false'` is not false. — MinusFour, Aug 01 '15 at 18:50

score 0 · Accepted Answer · answered Aug 01 '15 at 18:40

0

The call to $.ajax() returns a promise because it's non blocking. I don't think that Abide handles promises: maybe it just expects true or false, and since your result can be coerced to true (it's neither null nor undefined) it thinks user input is valid.

answered Aug 01 '15 at 18:40

Raffaele

20,627
6
47
86

Try to manually [trigger the change event in the XHR callback](http://stackoverflow.com/a/27507025/315306) – Raffaele Aug 01 '15 at 18:44
I fixed it by running result through eval(); – James Aug 01 '15 at 19:19

Foundation Abide with AJAX function

1 Answers1