テキストボックスでMVC.NETのフォーカスイベントが失われました

Question

MVCプロジェクトで作業していますが、フォーカスが失われたテキストボックスで問題が発生しています。 最初に私は4つのテキストボックスフィールドがあります。最初のテキストボックスに従業員の名前を渡す必要がありますが、このテキストボックスはフォーカスイベントを失ったため、Employeeのすべてのレコードがデータベースに格納されていますテキストボックスに名前を渡して「保存」ボタンをクリックすると、レコードがデータベースに存在するかどうかをチェックするために呼び出される最初のテキストボックスイベントが存在しない場合、レコードを保存するためにもう一度ボタンをリクルートする必要があります。 その場合、私はボタンを2回クリックする必要があります。

あなたの考えを助けてください。ユーザーが2回クリックしないようにしてください。

おかげ

Answer 1

私はあなたが仕事をするためにjQueryのAJAXを使用して、と言うでしょう。 テキストボックスのフォーカスが失われると、コントローラーのアクションにajax getコールが実行され、DBがチェックされ、ユーザー名が既に存在するかどうかのステータスが返されます。

のjQuery：

$(document).ready(function() { 
$("#UserName").focusout(function() { 
    var username = $("#UserName").val(); 
    var fullurl = '/User/UserNameCheck?username=' + username; 
    if (username.length > 0) { 
     $.ajax({ 
      url: fullurl, 
      type: 'GET', 
      dataType: 'json', 
      contentType: 'application/json; charset=utf-8', 
      //data: username, 
      success: function (data) { 
       if (data == 'UserNotPresent') { 
        $("#username_NotPresent_lbl").show(); 
       } 
       else if (data == 'UserPresent') { 
        $("#username_Present_lbl").show(); 
       } 
       else { 
        $("#failed_check_lbl").show(); 
       } 
      }, 
      error: function (e) { 
       $("#failed_check_lbl").show(); 
      } 
     }); 
    } 
}); 

$("#UserName").focus(function() { 
    $("#username_NotPresent_lbl").hide(); 
    $("#username_Present_lbl").hide(); 
    $('#failed_check_lbl').hide(); 
}); }); 

コントローラのアクション：

[AllowAnonymous] 
    [HttpGet] 
    public JsonResult UserNameCheck(string username) 
    {    
     Users loggedInUser = db.Users.FirstOrDefault(x => x.UserName == username); 
     if (loggedInUser != null) 
     { 
      return Json("UserPresent", JsonRequestBehavior.AllowGet); 
     } 
     else 
     { 
      return Json("UserNotPresent", JsonRequestBehavior.AllowGet); 
     } 
    } 

ビュー：

<div class="form-group"> 
     @Html.LabelFor(model => model.UserName, new {@class = "control-label col-md-2" }) 
     <div class="col-md-10"> 
      @Html.EditorFor(model => model.UserName) 
      @Html.ValidationMessageFor(model => model.UserName) 
      @Html.Label("Sorry this user name is already in use", new {id="username_Present_lbl", @class ="ErrorLbl"}) 
      @Html.Label("User name available for use", new {id="username_NotPresent_lbl", @class ="SuccesLbl"}) 
      @Html.Label("Failed to validate the user name", new {id="failed_check_lbl", @class ="FailedCheckLbl"})     
     </div> 
    </div>