JQuery+Asp.net MVC實現使用者名稱重名查詢
之前寫過一篇Post用Ajax查詢使用者名稱是否重名,這次我們用JQuery的外掛validate來實現,更加簡單,相比之前用xmlhttprequest來說,不用考慮瀏覽器相容的問題,這也是使用是Jquery這個輕量級框架的特點之一。
此處用的是ASP.NET MVC RC,aspx程式碼如下:
cs
<!--
Code highlighting produced by Actipro CodeHighlighter (freeware)
http://www.CodeHighlighter.com/
--> ///
/// FormDemoController
///
/// Author : PetterLiu 2009-1-12 17:20 DEV-LIUJUNYUAN
public class FormDemoController : Controller
{
public JsonResult IsLoginAvailable(string login)
{
//TODO: Do the validation
JsonResult result = new JsonResult();
if (login == "Petter")
result.Data = false;
else
result.Data = true;
return result;
}
}
此處用的是ASP.NET MVC RC,aspx程式碼如下:
@ Page Language="C#" AutoEventWireup="true" CodeBehind="TestValidation1.aspx.cs" Inherits="DemoMVCForm.Views.FormDemo.TestValidation1" %>
DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Demotitle>
<script src="http://www.cnblogs.com/Scripts/jquery-1.2.6.min.js" type="text/javascript">script>
<script src="http://www.cnblogs.com/Scripts/jquery.validate.js" type="text/javascript">script>
<script type="text/javascript">
$(document).ready(function() {
$("#form-sign-up").validate({
rules: {
login: {
required: true,
//here invoke related action
remote: ''
}
},
messages: {
login: {
required: "請輸入使用者名稱",
remote: jQuery.format("{0} 已經有人用了")
}
},
// set this class to error-labels to indicate valid fields
success: function(label) {
// set as text for IE
label.html(" ").addClass("checked");
}
});
});
script>
head>
<body>
<form action="Register", "FormDemo")%>" method="post" id="form-sign-up">
<h1>Demo表單h1>
<table id="inputArea">
<tr>
<td>使用者名稱 (試試輸入 Petter):td>
<td><input type="text" name="login" id="login" />td>
tr>
<tr>
<td colspan="2" align="center"><br /><input type="submit" />td>
tr>
table>
form>
body>
html>
DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Demotitle>
<script src="http://www.cnblogs.com/Scripts/jquery-1.2.6.min.js" type="text/javascript">script>
<script src="http://www.cnblogs.com/Scripts/jquery.validate.js" type="text/javascript">script>
<script type="text/javascript">
$(document).ready(function() {
$("#form-sign-up").validate({
rules: {
login: {
required: true,
//here invoke related action
remote: ''
}
},
messages: {
login: {
required: "請輸入使用者名稱",
remote: jQuery.format("{0} 已經有人用了")
}
},
// set this class to error-labels to indicate valid fields
success: function(label) {
// set as text for IE
label.html(" ").addClass("checked");
}
});
});
script>
head>
<body>
<form action="Register", "FormDemo")%>" method="post" id="form-sign-up">
<h1>Demo表單h1>
<table id="inputArea">
<tr>
<td>使用者名稱 (試試輸入 Petter):td>
<td><input type="text" name="login" id="login" />td>
tr>
<tr>
<td colspan="2" align="center"><br /><input type="submit" />td>
tr>
table>
form>
body>
html>
Asp.net MVC支援Json,所有返回Json的結果,直接使用是JsonResult,看程式碼cs,很簡單:


<!--
Code highlighting produced by Actipro CodeHighlighter (freeware)
http://www.CodeHighlighter.com/
--> ///
/// FormDemoController
///
///
public class FormDemoController : Controller
{
public JsonResult IsLoginAvailable(string login)
{
//TODO: Do the validation
JsonResult result = new JsonResult();
if (login == "Petter")
result.Data = false;
else
result.Data = true;
return result;
}
}
來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/12639172/viewspace-545674/,如需轉載,請註明出處,否則將追究法律責任。
相關文章
- mysql之查詢使用者名稱MySql
- 根據使用者名稱和密碼查詢使用者密碼
- mybatis入門程式:mybatis根據使用者名稱稱模糊查詢使用者資訊MyBatis
- Linux裝置名稱的查詢Linux
- 商城-使用者註冊-根據使用者名稱和密碼查詢使用者密碼
- 揭秘PostgreSQL:如何查詢表欄位名稱SQL
- 檢查使用者名稱是否使用介面
- Vue檢查使用者名稱是否使用Vue
- ABAP 根據使用者名稱查姓名
- Java+Ajax實現使用者名稱重複檢驗Java
- Laravel 實現使用者名稱 + 郵箱 + 手機號登入Laravel
- C# 根據前臺傳入實體名稱,動態查詢資料C#
- 17.django新增檢查使用者名稱和手機號數量介面+vue檢查使用者名稱,手機號是否重複DjangoVue
- 查詢 Linux 發行版名稱、版本和核心詳細資訊Linux
- c++11-17 模板核心知識(十三)—— 名稱查詢與ADLC++
- SSH:hiberate實現資料的查詢(單查詢和全查詢)
- html+JS+php實現簡單的註冊使用者名稱驗證HTMLJSPHP
- github修改使用者名稱Github
- 海量使用者註冊整合布隆過濾器實現使用者名稱唯一功能過濾器
- python 使用者註冊使用者名稱Python
- WordPress使用者名稱能改幾次?附更改使用者名稱4種方法
- 查詢指定使用者的unique,primary索引名/鍵值索引
- indexdb實現分頁查詢Index
- python實現查詢糾錯Python
- mysql多表查詢如何實現MySql
- 折半查詢(C++實現)C++
- win10怎麼改使用者名稱_win10如何更改使用者名稱Win10
- Laravel Query Builder 複雜查詢案例:子查詢實現分割槽查詢 partition byLaravelUI
- Git使用者名稱郵箱配置Git
- DIY 實現 ThinkPHP 核心框架(四)名稱空間PHP框架
- day53:django:URL別名/反向解析&URL分發&名稱空間&ORM多表操作修改/查詢DjangoORM
- 通過jquery.cookie.js實現記住使用者名稱、密碼登入功能jQueryCookieJS密碼
- 修改 Ubuntu 系統使用者名稱和登入名Ubuntu
- Linux中實現根據scaffold名稱從fasta檔案中提取資料(scaffold名稱長)LinuxAST
- git配置使用者名稱和郵箱 git設定使用者名稱郵箱有什麼用Git
- PHP 實現二分查詢PHP
- [Hive]Hive實現抽樣查詢Hive
- jeefast實現科目成績查詢AST
- 查詢賬單功能的實現