如何使用ScriptManager和updatePanel与ASP.NET中的代码隐藏关联 [英] How to use ScriptManager and updatePanel associate with codebehind in ASP.NET
本文介绍了如何使用ScriptManager和updatePanel与ASP.NET中的代码隐藏关联的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我使用验证码图片创建了网站帐户.当用户单击ImageButton(用于刷新验证码图像的按钮:imbReLoad)时，它将创建一个新的验证码图像，并且我的页面没有从头开始加载.它运行相同的javascript.
我使用了Ajax:脚本管理器和更新"面板，后面有代码，但是当我单击ImageButton imbReLoad刷新验证码图像时，我的页面无法正常工作.
你能帮我吗?
谢谢
:confused:
我的代码如下:
I have site account creation with captcha image. When a user clicks the ImageButton (button is used to refresh captcha image: imbReLoad),it will create new a captcha image and my page is not loaded from scratch. it run same javascript.
I used Ajax: script Manager and Update panel with code behind, but when I clicked on the ImageButton imbReLoad to refresh my captcha image, my page did not work.
can you help me, please?
thanks
:confused:
my code behind:
using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Data.SqlClient;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
using System.Drawing;
using System.Drawing.Drawing2D;
using System.Text;
public partial class _Default : System.Web.UI.Page
{
// code create image capchar
public void TaoAnhCapcha()
{
string[] Fonts = { "Arial Black", "Arial" };
byte bLenght = 6;
string chars = "12345678ABCDEFGHIJKLMNOPQRSTUVWXYZabdeqptmnghr"; ;
Bitmap bmp = new Bitmap(125, 30);
Graphics gr = Graphics.FromImage(bmp);
// chọn kiểu hiển thị của bipmap kiểu gợn sóng
// choose type of bipmap
HatchBrush brush = new HatchBrush(HatchStyle.Wave, Color.White, Color.Wheat);
gr.FillRegion(brush, gr.Clip);
//Lưu chuỗi capcha trong quá trình tạo
StringBuilder strCapCha = new StringBuilder();
Random Rand = new Random();
int x = 1;
for (int i = 0; i < bLenght; i++)
{
// Lấy ký tự ngẫu nhiên từ mảng chars
// get ramdom char
string schar = chars[Rand.Next(chars.Length)].ToString();
strCapCha.Append(schar);
// Tạo font với font ngẫu nhiên chọn từ Fonts
//create font with ramdom font
Font font = new Font(Fonts[Rand.Next(Fonts.Length)], 12, FontStyle.Bold | FontStyle.Italic);
//Lầy kích thước của ký tự
//get the size of char
SizeF size = gr.MeasureString(schar, font);
// Vẽ Ký tự ra ảnh theo thứ tự tăng dần với tọa độ X tăng dần theo i và Y ngẫu nhiên
//draw char to image
gr.DrawString(schar, font, Brushes.Blue, x * 2, Rand.Next(2, 10));
font.Dispose();
x += 10;
}
// Lưu captcha vào session
//save capchar to session
Session["captcha"] = strCapCha.ToString();
//// Lưu ảnh vào thư mục Capcha với tên ảnh dựa theo IP
//save image into folder "hinhtrangtri"
string path = "hinhtrangtri/" + Request.UserHostAddress + ".gif";
bmp.Save(Server.MapPath("") + "/" + path, System.Drawing.Imaging.ImageFormat.Gif);
imgCapcha.ImageUrl = path;
}
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
//call function create image capchar
TaoAnhCapcha();
}
}
// when user click on this image button, it create new a capchar (the same refresh this image capchar)
protected void imbReLoad_Click(object sender, ImageClickEventArgs e)
{
//CreateCaptcha();
//call function create image capchar
TaoAnhCapcha();
}
protected void btnRegistry_Click(object sender, EventArgs e)
{
}
protected void DropEmp_SelectedIndexChanged(object sender, EventArgs e)
{
}
protected void btnCancel_Click(object sender, EventArgs e)
{
}
}
代码页的来源:
code Source of page:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!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>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<style type="text/css">
.style3
{
text-align: center;
}
.style6
{
height: 26px;
}
.sitemap
{
padding: 10px 10px 15px 5px; text-align: center;overflow: auto;
}
</style>
<p class="style3">
</p>
<p class="style3">
<asp:Label ID="lbtb" runat="server" ForeColor="Red" Text="Label"
Visible="False"></asp:Label>
</p>
<table class="style3" style="margin: 10px">
<tr>
<td style="padding-left: 15px" >
<asp:Label ID="Label2" runat="server" Font-Bold="True" ForeColor="#0000CC"
Text="Employee :"></asp:Label></td>
<td>
<asp:DropDownList ID="DropEmp" runat="server" Height="23px" Width="200px"
AutoPostBack="True"
TabIndex="1" onselectedindexchanged="DropEmp_SelectedIndexChanged">
</asp:DropDownList>
<asp:Label ID="lbEmpID" runat="server" Enabled="False" ForeColor="#666699"
Text="Label" Visible="False"></asp:Label>
</td>
</tr>
<tr>
<td style="padding-left: 15px">
<asp:Label ID="Label3" runat="server" Font-Bold="True" ForeColor="#0000CC"
Text="UserName :"></asp:Label>
</td>
<td>
<asp:TextBox ID="txtUserName" runat="server" TabIndex="2" Width="250px"></asp:TextBox>
</td>
</tr>
<tr>
<td style="padding-left: 15px">
<asp:Label ID="Label4" runat="server" Font-Bold="True" ForeColor="#0000CC"
Text="PassWord :"></asp:Label>
</td>
<td>
<asp:TextBox ID="txtPass" runat="server" Width="250px" TabIndex="3"
TextMode="Password"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style6" style="padding-left: 15px">
<asp:Label ID="Label6" runat="server" Font-Bold="True" ForeColor="#0000CC"
Text="RePassWord :"></asp:Label>
</td>
<td class="style6">
<asp:TextBox ID="txtRepassl" runat="server" Width="250px" TabIndex="4"
TextMode="Password"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style6" style="padding-left: 15px">
<asp:Label ID="Label17" runat="server" Font-Bold="True" ForeColor="#0000CC"
Text="Role :"></asp:Label>
</td>
<td class="style6">
<asp:DropDownList ID="DropRole" runat="server" AutoPostBack="True"
Height="23px" Width="150px">
<asp:ListItem Value="E">Employee</asp:ListItem>
<asp:ListItem Value="A">Admin</asp:ListItem>
<asp:ListItem></asp:ListItem>
</asp:DropDownList>
</td>
</tr>
<tr>
<td style="padding-left: 15px">
</td>
<td >
<asp:Image ID="imgCapcha" runat="server" Height="51px" Width="212px" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate >
<asp:ImageButton ID="imbReLoad" runat="server" Height="31px"
ImageUrl="~/hinhtrangtri/refresh.png" OnClick="imbReLoad_Click"
Width="33px" />
</ContentTemplate>
</asp:UpdatePanel>
</td>
</tr>
<tr>
<td style="padding-left: 15px">
<asp:Label ID="Label16" runat="server" Font-Bold="True" ForeColor="#0000CC"
Text="Input Confirm Chars :"></asp:Label>
</td>
<td>
<asp:TextBox ID="txtmap" runat="server" TabIndex="5"></asp:TextBox>
</td>
</tr>
<tr>
<td colspan="2" style="text-align: center">
<asp:Button ID="btnRegistry" runat="server" Font-Bold="True" ForeColor="Blue"
Height="30px" Text="Registry" Width="75px" onclick="btnRegistry_Click"
TabIndex="6" />
<asp:Button ID="btnCancel" runat="server" Font-Bold="True" ForeColor="Blue"
Height="29px" Text="Cancel" onclick="btnCancel_Click" TabIndex="7" />
</td>
</tr>
</table>
<p>
</p>
</div>
</form>
</body>
</html推荐答案
Rearrange your UpdatePanel like following:
Rearrange your UpdatePanel like following:
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Image ID="imgCapcha" runat="server" Height="51px" Width="212px" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="imbReLoad" />
</Triggers>
</asp:UpdatePanel>
<asp:ImageButton ID="imbReLoad" runat="server" Height="31px" ImageUrl="~/hinhtrangtri/refresh.png"
OnClick="imbReLoad_Click" Width="33px" />
Replace your TaoAnhCapcha():
Replace your TaoAnhCapcha():
public void TaoAnhCapcha()
{
string[] Fonts = { "Arial Black", "Arial" };
byte bLenght = 6;
string chars = "12345678ABCDEFGHIJKLMNOPQRSTUVWXYZabdeqptmnghr"; ;
Bitmap bmp = new Bitmap(125, 30);
Graphics gr = Graphics.FromImage(bmp);
HatchBrush brush = new HatchBrush(HatchStyle.Wave, Color.White, Color.Wheat);
gr.FillRegion(brush, gr.Clip);
StringBuilder strCapCha = new StringBuilder();
Random Rand = new Random();
int x = 1;
for (int i = 0; i < bLenght; i++)
{
string schar = chars[Rand.Next(chars.Length)].ToString();
strCapCha.Append(schar);
Font font = new Font(Fonts[Rand.Next(Fonts.Length)], 12, FontStyle.Bold | FontStyle.Italic);
SizeF size = gr.MeasureString(schar, font);
gr.DrawString(schar, font, Brushes.Blue, x * 2, Rand.Next(2, 10));
font.Dispose();
x += 10;
}
//save capchar to session
Session["captcha"] = strCapCha.ToString();
//save image into folder "hinhtrangtri"
if (Session["path"] != null)
{
System.IO.File.Delete(Server.MapPath("") + "/" + Session["path"].ToString());
}
string path = "hinhtrangtri/" + Request.UserHostAddress + Rand.Next(100) + ".gif";
bmp.Save(Server.MapPath("") + "/" + path, System.Drawing.Imaging.ImageFormat.Gif);
imgCapcha.ImageUrl = path;
Session["path"] = path;
}
======================
Working?
======================
Working?
Hi
Move this....
<asp:Image ID="imgCapcha" runat="server" Height="51px" Width="212px"/>
inside the content template in the update panel.
The image is not refreshing because of the client side caching.
If you try
string path = "hinhtrangtri/" + Request.UserHostAddress +Rand.Next(100).ToString()+ ".gif";
it will work. But it generate lot of images.
Try clear the cache before update the image.
Hi
Move this....
<asp:Image ID="imgCapcha" runat="server" Height="51px" Width="212px" />
inside the content template in the update panel.
The image is not refreshing because of the client side caching.
If you try
string path = "hinhtrangtri/" + Request.UserHostAddress +Rand.Next(100).ToString()+ ".gif";
it will work. But it generate lot of images.
Try clear the cache before update the image.
Hello,
There is a famous browser "trick" for image refresh w/o page postback.
I guess it''s pretty common now because I see lots of posts on this method.
This way you can avoid generating lot of images.
替换
Hello,
There is a famous browser "trick" for image refresh w/o page postback.
I guess it''s pretty common now because I see lots of posts on this method.
This way you can avoid generating lot of images.
Replace
imgCapcha.ImageUrl = path;
与
with
imgCapcha.ImageUrl = path + "?t="+DateTime.Now.Ticks.ToString();
It should do.
you still have to move this
It should do.
you still have to move this
<asp:Image ID="imgCapcha" runat="server" Height="51px" Width="212px" />
to inside the content template in the update panel.
Happy coding~ :laugh:
to inside the content template in the update panel.
Happy coding~ :laugh:
这篇关于如何使用ScriptManager和updatePanel与ASP.NET中的代码隐藏关联的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
