关于 c#:image in updatepanel 导致整个页面刷新

image in updatepanel causes whole page refresh

我在更新面板中有一个图像控件,在页面加载中我正在设置它的 url。

page_load 中的代码

1
2
string url ="example.com";
Image1.ImageUrl = url;

在 aspx 中的更新面板内

1
 

我在更新面板中也有几个提交按钮,我正在更新按钮点击时的一些 texboxes 和标签。

但是这会导致整个页面刷新。 (滚动条上升。)

如果将图像移到更新面板之外,则不会发生这种情况。
问题是如果我删除更新面板之外的图像,布局根本不起作用。
谁能帮我这个?谢谢。

更新

我意识到这只发生在 Chrome 中。有人有想法吗?

更新 2
在那个页面上,我通过从更新面板中删除 img 解决了这个问题。让布局工作简直是地狱,但它奏效了。

但是我有另一个页面,当用户单击加载更多时,我将在更新面板中添加新的 imgs。同样的交易,显然这次我不能将图像移出更新面板。这是代码。

1
2
3
4
5
6
7
8
9
10
11
12
13
    </asp:ScriptManager>

        <!–Recent Uploads–>
       
            Uploads
           
                <Triggers>
                   
                </Triggers>
                <ContentTemplate>
                   
                </ContentTemplate>
            </asp:UpdatePanel>

后面的代码(上传索引是一个会话变量)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
upload_index += 5;
        for (int i = 0; i < upload_index; i++)
        {
            try
            {
                SSImage img = images[i];
                HyperLink imglink = new HyperLink();
                imglink.NavigateUrl ="/Image.aspx?id=" + img.id;
                imglink.ImageUrl ="/ShowImage.ashx?imgid=" + img.id;
                imglink.ToolTip = img.title;
                imglink.CssClass ="imgupload";
                Control contentpanel = RecentUpload.ContentTemplateContainer;
                contentpanel.Controls.AddAt(contentpanel.Controls.Count 2, imglink);
            }
            catch (ArgumentOutOfRangeException)
            {
                loaduploads.Visible = false;
                break;
            }
        }

更新 3

问题不会发生在静态图像上,而是在我尝试从 showimage.ashx 加载时发生。这是代码。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
<%@ WebHandler Language="C#" Class="ShowImage" %>

using System;
using System.Web;
using System.IO;
using System.Data;
using System.Data.SqlClient;
using System.Configuration;

public class ShowImage : IHttpHandler
{

    public void ProcessRequest(HttpContext context)
    {
        SqlDataReader rdr = null;
        SqlConnection conn = new SqlConnection();
        SqlCommand cmd = new SqlCommand();

        try
        {
            string connStr = ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString;
            conn = new SqlConnection(connStr);

            cmd = new SqlCommand("SELECT Image_data FROM [Image_table] WHERE Image_id =" + context.Request.QueryString["imgID"], conn);
            conn.Open();
            Object result = cmd.ExecuteScalar();
            //if nothing found throw exception
            if (result == null)
            {
                throw new Exception();
            }
            rdr = cmd.ExecuteReader();
            while (rdr.Read())
            {
                context.Response.ContentType ="image/jpg";
                context.Response.BinaryWrite((byte[])rdr["Image_data"]);
            }

            if (rdr != null)
                rdr.Close();
        }
        catch
        {

        }
        finally
        {
            conn.Close();
            conn.Dispose();
        }

    }

    public bool IsReusable
    {
        get
        {
            return false;
        }
    }

}


您应该使用更新面板的异步回发触发器
这是一个例子:

1
 

其中 ‘controlID’ 是可以导致回发的元素的 ID,而 ‘eventname’ 是由定义的控件触发以导致回发的特定事件


在我看来,

You should try to add controls to the body instead of updating the ContentTemplate of the UpdatePanel i.e. Create a Panel control in ContentTemplate and add everything in that and update anything in that Panel not the ContentTemplate.

检查逻辑和 aspx 语法,显示将控件添加到 UpdatePanel > ContentTemplate

中包含的 Panel

ASPX

1
2
3
4
5
6
7
8
9
        <Triggers>
           
        </Triggers>
        <ContentTemplate>
           
                 
            </asp:Panel>
        </ContentTemplate>
    </asp:UpdatePanel>

代码背后

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
    ad_index += 5;
    for (int i = 0; i < upload_index; i++)
    {
        try
        {
            SSImage img = images[i];
            HyperLink imglink = new HyperLink();
            imglink.NavigateUrl ="/Image.aspx?id=" + img.id;
            imglink.ImageUrl ="/ShowImage.ashx?imgid=" + img.id;
            imglink.ToolTip = img.title;
            imglink.CssClass ="imgupload";

            // Commented old code
            //Control contentpanel = RecentUpload.ContentTemplateContainer;
            //contentpanel.Controls.AddAt(contentpanel.Controls.Count – 2, imglink);

            //Add controls to Panel instead of updating the ContentTemplate itself
            pnlMyDynamicContent.Controls.AddAt(pnlMyDynamicContent.Controls.Count 2, imglink);
        }
        catch (ArgumentOutOfRangeException)
        {
            loaduploads.Visible = false;
            break;
        }
    }


添加另一个更新面板并将您的图像标签放入此更新面板,然后将属性”updatemode”设置为”always”。

试试这个,它肯定会解决你的问题。如果不让我知道。


原创文章,作者:ItWorker,如若转载,请注明出处:https://blog.ytso.com/269209.html

(0)
上一篇 2022年6月20日
下一篇 2022年6月20日

相关推荐

发表回复

登录后才能评论