这是我的Jquery代码:
$(document).ready(function () {
onfocus();
$(".on_off_checkbox").iphoneStyle();
$('.tip a ').tipsy({gravity: 'sw'});
$('#login').show().animate({ opacity: 1 }, 2000);
$('.logo').show().animate({ opacity: 1,top: '30%'}, 800,function(){
$('.logo').show().delay(1200).animate({ opacity: 1,top: '0%' }, 300,function(){
$('.formLogin').animate({ opacity: 1,left: '0' }, 300);
$('.userbox').animate({ opacity: 0 }, 200).hide();
});
})
});
$('.userload').click(function(e){
$('.formLogin').animate({ opacity: 1,left: '0' }, 300);
$('.userbox').animate({ opacity: 0 }, 200,function(){
$('.userbox').hide();
});
});
$('#but_login').click(function(e){
if($('#username_id').val() == "" || $('#password').val() == "")
{
showError("Please Input Username / Password");
$('.inner').jrumble({ x: 4,y: 0,rotation: 0 });
$('.inner').trigger('startRumble');
setTimeout('$(".inner").trigger("stopRumble")',500);
setTimeout('hideTop()',5000);
return false;
}
hideTop();
loading('Checking',1);
setTimeout( "unloading()", 2000 );
setTimeout( "Login()", 2500 );
});
function Login(){
$("#login").animate({ opacity: 1,top: '49%' }, 200,function(){
$('.userbox').show().animate({ opacity: 1 }, 500);
$("#login").animate({ opacity: 0,top: '60%' }, 500,function(){
$(this).fadeOut(200,function(){
$(".text_success").slideDown();
$("#successLogin").animate({opacity: 1,height: "200px"},500);
});
})
})
//setTimeout( "window.location.href='dashboard.html'", 3000 );
}
$('#alertMessage').click(function(){
hideTop();
});
function showError(str){
$('#alertMessage').addClass('error').html(str).stop(true,true).show().animate({ opacity: 1,right: '0'}, 500);
}
function showSuccess(str){
$('#alertMessage').removeClass('error').html(str).stop(true,true).show().animate({ opacity: 1,right: '0'}, 500);
}
function onfocus(){
if($(window).width()>480) {
$('.tip input').tipsy({ trigger: 'focus', gravity: 'w' ,live: true});
}else{
$('.tip input').tipsy("hide");
}
}
function hideTop(){
$('#alertMessage').animate({ opacity: 0,right: '-20'}, 500,function(){ $(this).hide(); });
}
function loading(name,overlay) {
$('body').append('<div id="overlay"></div><div id="preloader">'+name+'..</div>');
if(overlay==1){
$('#overlay').css('opacity',0.1).fadeIn(function(){ $('#preloader').fadeIn(); });
return false;
}
$('#preloader').fadeIn();
}
function unloading() {
$('#preloader').fadeOut('fast',function(){ $('#overlay').fadeOut(); });
}
这是我的ASP.net代码:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class index : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
}
这是HTML:
<div class="formLogin">
<div class="tip">
<input name="username" type="text" id="username_id" title="Username" />
</div>
<div class="tip">
<input name="password" type="password" id="password" title="Password" />
</div>
<div class="loginButton">
<div style="float:left; margin-left:-9px;">
<input type="checkbox" id="on_off" name="remember" class="on_off_checkbox" value="1" />
<span class="f_help">Remember me</span>
</div>
<div style="float:right; padding:3px 0; margin-right:-12px;">
<div>
<ul class="uibutton-group">
<li><a class="uibutton normal" href="#" id="but_login" >Login</a></li>
<li><a class="uibutton normal" href="#" id="forgetpass">forgetpass</a></li>
</ul>
</div>
</div>
<div class="clear"></div>
</div>
</div>
我是ASP.net的新手,我有客户端验证工作,以确保用户名或密码不是空白。我无能为力的是如何添加服务器端验证。
我来自经典asp的强大背景,并且正在向ASP.net迈进。我知道基本知识,比如我需要检查用户名和密码是否为空,如果是,则返回错误。
我的but_login上是否需要runat = server?如何附加一些后端asp.net代码,以便在单击它链接时处理服务器代码?
提前致谢。
答案 0 :(得分:1)
我认为最好的方法是将典型的html输入替换为这样的asp输入并使用客户端ID模式静态,这样你就不必在jquery中替换id
它可以像这样
<asp:TextBox name="username" type="text" id="username_id" title="Username" ClientIDMode="Static" runat="server"></asp:TextBox>
<asp:TextBox name="password" type="password" id="password" title="Password" ClientIDMode="Static" runat="server"></asp:TextBox>
<asp:Label ID="Label1" runat="server" Text=""></asp:Label>
和背后的代码
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class index : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (username_id.Text == "" || password.Text == "")
{
Label1.Text = "Error";
}
else
{
////
}
}
}
答案 1 :(得分:0)
内置的ASP.NET验证控件自动提供客户端和服务器端功能。您可能需要考虑使用这些控件重写验证。
这是一个教程/概述:
http://msdn.microsoft.com/en-us/library/debza5t0.aspx
修改强>
如果您无法使用内置验证,则基本上需要将所有JavaScript验证移植到Page_Load
事件。
<script runat=server">
void Page_Load(object sender, EventArgs e)
{
string error = ValidatePage();
if(String.IsNullOrEmpty(error))
{
//validation passed, do something
}
else
{
//validation failed. output error message
//via Response.Write or a Label control
//Response.Write(error);
//or
//Label1.Text = error;
}
}
string ValidatePage()
{
//validate your elements here.
string username = Request.Form["username"];
if(String.IsNullOrEmpty(username))
{
return "Username required";
}
//etc...
}
</script>
答案 2 :(得分:0)
为了访问服务器上的控件,控件需要具有runat =“server”属性。但是,如果这样做,这将更改控件的客户端ID。有几种方法可以解决这个问题
另一种选择是使用ASP.NET验证器控件,如RegularExpressionValidator和RequiredFieldValidator。