MVC4でajaxコールを作成する方法

Question

MVC4を初めて使用しています。私はログイン名の検証を作成する必要があります。文字列を書き込んだ後、テキストボックスを終了すると、文字列が利用可能かどうかが表示されます。コードの表示がある

：

@{ 
    ViewBag.Title = "Home Page"; 
} 
@section featured { 
    <section class="featured"> 
     <div class="content-wrapper"> 
      @Html.TextBox("textbox1") 
      @Html.TextBox("txtTest") 
     </div> 
    </section> 
} 
@section scripts{ 
    <script type="text/javascript"> 
     $(document).ready(function(){ 
      $('#textbox1').blur(function(){ 
       alert("a"); 
      }); 
     }); 
    </script> 
} 

今alert("a")の代わりに、私は、アクションを呼び出す必要があります。そのアクションにはデータベースチェックが含まれます。

コントローラコード：

public class HomeController : Controller 
    { 
     public ActionResult Index() 
    { 
     ViewBag.Message = "Modify this template to jump-start your ASP.NET MVC application."; 

     return View(); 
    } 
     public ActionResult SearchUser() 
     { 
      string ExistsCheck; 
      SqlConnection con = new SqlConnection(ConfigurationManager.AppSettings["conn"].ToString()); 
      SqlDataAdapter da = new SqlDataAdapter(); 
      SqlCommand cmd = new SqlCommand(); 
      DataTable dt = new DataTable(); 
      cmd = new SqlCommand("sp_UserName_Exist_tbl_UserDetails", con); 
      cmd.CommandType = CommandType.StoredProcedure; 
      cmd.Parameters.AddWithValue("@UserName", Request.Form["textbox1"]); 
      da.SelectCommand = cmd; 
      da.Fill(dt); 
      if (dt != null && dt.Rows.Count > 0 && dt.Rows[0][0].ToString().ToLower() == "exists") 
      { 
       ExistsCheck = "Exists"; 
      } 
      else 
      { 
       ExistsCheck = "Available"; 
      } 
      return View(); 
     } 
    } 

今、私の質問は、このSearchUser()アクションを呼び出すと、我々はTextBox1テキストボックスから出て行くときに、同じページにそれを表示する方法です。

ご提案ください。私がORM（Entity FrameworkのかNHibernateの）を使用することをお勧めします

Answer 1

はJavaScript

@{ 
    ViewBag.Title = "Home Page"; 
} 
@section featured { 
    <section class="featured"> 
     <div class="content-wrapper"> 
      <table> 
       <tr> 
        <td> 
         @Html.TextBox("textbox1") 
        </td> 
        <td> 
         <div id="regTitle"></div> 
        </td> 
       </tr> 
       <tr> 
        <td colspan="2"> 
         @Html.TextBox("txtTest") 
        </td> 
       </tr> 
      </table> 
     </div> 

    </section> 
} 
@section scripts{ 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $('#textbox1').blur(function() { 
      var params = { userName: $(this).val() }; 
      $.ajax({ 
       url: "Home/SearchUser", 
       type: "get", 
       data: { userName: $("#textbox1").val() }, 
       success: function (response, textStatus, jqXHR) { 
        if (response.IsExisting) { 
         // User name is existing already, you can display a message to the user 
         $("#regTitle").html("Already Exists") 
        } 
        else { 
         // User name is not existing 
         $("#regTitle").html("Available") 
        } 
       }, 
       error: function (jqXHR, textStatus, errorThrown) { 
        alert("error"); 
       }, 
       // callback handler that will be called on completion 
       // which means, either on success or error 
       complete: function() { 
        } 
      }); 
     }); 
    }); 
</script> 
} 

コントローラ方法

using System; 
using System.Collections.Generic; 
using System.Configuration; 
using System.Data; 
using System.Data.SqlClient; 
using System.Linq; 
using System.Web; 
using System.Web.Mvc; 

namespace Mvc4_Ajax.Controllers 
{ 
    public class HomeController : Controller 
    { 
     public ActionResult Index() 
     { 
      ViewBag.Message = "Modify this template to jump-start your ASP.NET MVC application."; 

      return View(); 
     } 

     public ActionResult About() 
     { 
      ViewBag.Message = "Your app description page."; 

      return View(); 
     } 

     public ActionResult Contact() 
     { 
      ViewBag.Message = "Your contact page."; 

      return View(); 
     } 
     [HttpGet] 
     public ActionResult SearchUser(string userName) 
     { 
      SqlConnection con = new SqlConnection(ConfigurationManager.AppSettings["conn"].ToString()); 
      SqlDataAdapter da = new SqlDataAdapter(); 
      SqlCommand cmd = new SqlCommand(); 
      DataTable dt = new DataTable(); 
      cmd = new SqlCommand("sp_UserName_Exist_tbl_UserDetails", con); 
      cmd.CommandType = CommandType.StoredProcedure; 
      cmd.Parameters.AddWithValue("@UserName", userName); 
      da.SelectCommand = cmd; 
      da.Fill(dt); 
      var isExisting = dt != null && dt.Rows.Count > 0 && dt.Rows[0][0].ToString().ToLower() == "exists"; 
      return Json(new { IsExisting = isExisting }, JsonRequestBehavior.AllowGet);    
     } 
    } 
} 

• は、あなたがしている場合でも、SQLインジェクションを用心しますストアドプロシージャを使用： http://www.troyhunt.com/2012/12/stored-procedures-and-orms-wont-save.html

Answer 2

あなたは車輪を改革しています。 MVCはこれを実現するインターフェイス（IClientValidatable）を提供します。ほとんどすべてのMVCフォームの検証は、プロパティ属性（[必須]サーバー側とクライアント側の控えめな検証付き）、IClientValidatable（クライアント側）、IValidatable（サーバー側）の組み合わせで実現できます。完全な検証の例を次に示します。MVC3 - Custom Client-Side Validation with Unobtrusive Ajax - a Complete Example