jQuery и ASP.NET Custom Validator

Question

Я пытаюсь изучить jQuery, и мне пришло в голову, что существующий JS на некоторых моих сайтах можно заменить всего несколькими строками кода jQuery. В следующем коде я пытаюсь установить значение настраиваемого валидатора, выполнив вызов AJAX. Первый блок кода не работает должным образом, тогда как второй блок работает нормально. Целый «если он не сломался, не исправим» ответ не поможет, я действительно хочу изучить jQuery. Для записи я разместил предупреждения в коде, и они оба вернули тот же результат, только один из них устанавливает аргументы, а другой - не по какой-то причине.

Почему этот код не работает:

function CheckForUserName(sender, args) 
{ 
    args.IsValid = true; 

    var url = "/somepage.aspx"; 

    MakeCall(url, function(txt) { 
    if (txt == "false") { 
     args.IsValid = false; 
    } 
    }); 
} 

function MakeCall(url,callback) { 
    $.ajax({ 
     url: url, 
     dataType: "text", 
     success: callback 
    }); 
} 

этот код работы:

function CheckForUserName(sender, args) 
{ 
     args.IsValid = true; 

     var call = MakeCall(); 
     if (call == "false") 
     { 
      args.IsValid = false; 
     } 

} 

function MakeCall() 
{ 
    var xmlHttp; 
    var validation=true; 

    xmlHttp=GetXmlHttpObject(); 
    if (xmlHttp==null) 
    { 
     alert ("Your browser does not support AJAX!"); 
     return; 
    } 

    var url="/somepage.aspx"; 
    xmlHttp.onreadystatechange=function() 
    { 
     if (xmlHttp.readyState==4) 
     { 
      if (xmlHttp.status==200) 
      { 
       return xmlHttp.responseText; 
      } 
      else 
      { 
       alert(xmlHttp.status); 
      } 
     } 
    }; 
    xmlHttp.open("GET",url,false); 
    xmlHttp.send(null); 
    return xmlHttp.responseText; 
} 

function GetXmlHttpObject() 
{ 
var xmlHttp=null; 
try 
    { 
    // Firefox, Opera 8.0+, Safari 
    xmlHttp=new XMLHttpRequest(); 
    } 
catch (e) 
    { 
    // Internet Explorer 
    try 
    { 
    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); 
    } 
    catch (e) 
    { 
    xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    } 
return xmlHttp; 
} 

Answer 1

Для того, чтобы заставить его работать, необходимо указать параметр асинхронной как ложное:

function MakeCall(url,callback) { 
    $.ajax({ 
     async: false, 
     url: url, 
     dataType: "text", 
     success: callback 
    }); 
} 

Answer 2

Это работает fyi .. игнорировать мои пользовательские функции пространства имен JavaScript, но вы должны получить концепцию.

<script type="text/javascript"> 
     function VerifyCustomerNumber(s, a) { 
      var r = ProcessCustomerNumber(a.Value); 
      a.IsValid = r; 
     } 
     function ProcessCustomerNumber(n) { 
      var u = '/Services/WebServices/Customer.asmx/CountByCustomerNumber'; 
      var d = '{"Number": "' + n + '"}'; 
      $j.ajax({ 
       type: "POST", 
       contentType: "application/json; charset=utf-8", 
       url: u, 
       cache: false, 
       async: false, 
       data: d, 
       dataType: "json", 
       success: function(r) { 
        var v = Data.JS.Ajax.ParseJSON(r); 
        return v; 
       } 
      }); 
     } 
    </script> 

Answer 3

Только для справки. Имеет пользовательский валидатор, который позволяет использовать вызовы AJAX, но является сложным. Here - статья о проблеме.

В принципе, нужно сделать следующее:

1. Say "Invalid!" немедленно.
2. Показать сообщение «обработка ...» вместо вашего «недействительного» сообщения.
3. Начните свой длительный процесс, AKA запросите AJAX.
4. Как только ваш запрос завершается, замените ClientValidationFunction на фиктивную функцию.
5. Сбросить исходное сообщение.
6. Обновить состояние проверки.
7. Сброс исходной функции проверки, но только при изменении утвержденного элемента управления.

Вот конечная функция, которая выполняет задачу (взятый из статьи):

//Create our respond functions... 
var Respond_True = function (sender, args) { args.IsValid = true; }; 
var Respond_False = function (sender, args) { args.IsValid = false; }; 

function AjaxValidator(sender, args, ajaxSettings){ 
    args.IsValid = false; 

    //This is a reference to our validator control 
    var $sender = $(sender); 

    //Save the original message, color and validation function to restore them later. 
    var originalMessage = $sender.text(); 
    var originalColor = $sender.css("color"); 
    var originalFunction = sender.clientvalidationfunction; 
    var validatedControl = $("#" + sender.controltovalidate); 

    //Change the error message for a friendlier one. 
    $sender.text("Checking...").css({ color: "black" }); 

    var setRespondFunction = function (respondFunction) { 
     sender.clientvalidationfunction = respondFunction; 

     //Reconstitute original styles. 
     $sender.text(originalMessage).css({ color: originalColor }); 

     //Re-validate our control 
     ValidatorValidate(sender, null, null); 
     ValidatorUpdateIsValid(); 

     var onChange = function(){ 
      //Reset the original validation function 
      sender.clientvalidationfunction = originalFunction; 
      //Re-validate to ensure the original validation function gets called 
      ValidatorValidate(sender, null, null); 
      ValidatorUpdateIsValid(); 
      //Ensure the validation function is called just once. 
      validatedControl.unbind("change", onChange); 
     }; 
     validatedControl.on("change", onChange); 
    } 

    var originalSuccessFunction = ajaxSettings.success; 
    //Start the AJAX call.. 
    $.ajax($.extend(ajaxSettings, { 
     success: function(data){ 
      setRespondFunction(originalSuccessFunction(data) ? "Respond_True" : "Respond_False"); 
     } 
    })); 
} 

А вот использование пример:

function MyJavascriptValidationFunctionName(sender, args){ 
    AjaxValidator(sender, args, { 
     url: ..., 
     type: ..., 
     data: ..., 
     success: function(data){ 
      return /*True or false*/; 
     } 
    }); 
}