防止图像按钮执行回发答案

【问题标题】：Prevent Image button from doing PostBack防止图像按钮执行回发
【发布时间】：2016-03-02 09:42:11
【问题描述】：

我在asp.net 网站上工作，我有Imagebutton 在点击事件上调用c# 函数。我想阻止这个图像按钮创建一个 postBack。

我已经尝试添加

OnClientClick="return false;" 和 UseSubmitBehavior="false"

但这对我不起作用。

你有解决办法吗？

我尝试通过客户端函数调用服务器函数，如下所示，但我的代码似乎有问题：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/json2/20130526/json2.min.js"></script>


<script  type="text/javascript">
            $('#excelImageButton').click(function funcall() {

        $.ajax(
            {

                type: "POST",
                url: "BerthOccupancyForm.aspx/GridToExcel",
                data: "{}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",

            });

        return false;
    });

</script>

enter image description here

这是后面的代码：

[WebMethod()]   
public static void GridToExcel(GridView berthGridView, GridView recap)
{
    if (berthGridView.Rows.Count > 0)
    {
        HttpContext.Current.Response.Clear();
        HttpContext.Current.Response.AddHeader("content-disposition", "attachment; filename=BerthOccupancy.xls");
        HttpContext.Current.Response.ContentType = "text/csv";
        StringWriter sw = new StringWriter();
        HtmlTextWriter htw = new HtmlTextWriter(sw);
        berthGridView.RenderControl(htw);

        if (RT == "Year To Date")
        {
            foreach (GridView gv in Code)
            {
                gv.RenderControl(htw);
            }
        }
        else
        {
            recap.RenderControl(htw);

        }

        HttpContext.Current.Response.Write(sw.ToString());
        HttpContext.Current.Response.End();
    }
}

谢谢

【问题讨论】：

你在page_load 上写过服务器端的那个按钮吗？还显示 ImageButton 的完整 aspx
如果是网络表单，您必须在服务器端控件上处理回发。其他方式你不能调用 OnClick-Function。但是你仍然可以切换到 AJAX 或者只是将 ImageButton 替换为简单的图像并调用调用 Web 方法的 JS 代码（这基本上是执行 AJAX 类操作的另一种方式）
@coder 我也确实在页面加载中写了它，但它对我不起作用。
@Lorin 我尝试使用 WebMethod。但是，它要求该方法是静态的，并且我在该方法中遇到错误。你有例子吗？
@MaiShibuya 是的，它应该是静态的。这是一种有点过时的方式来做到这一点。但它仍然有效。查看这两页：stackoverflow.com/questions/6928533/…c-sharpcorner.com/UploadFile/dacca2/…

标签： c# asp.net

【解决方案1】：

首先，您不能将gridview 传递给webmethod。

如果您真的想将网格导出到 excel，请使用客户端库从表格标记生成 excel，或者进行部分回发并生成 excel 并写入响应。

查看此plunker 以在 javascript 中导出到 excel。

【讨论】：

【解决方案2】：

谢谢大家的建议。我能够以这种方式解决它。

我添加了一个具有静态列表和静态字符串的静态类。我在 WebForm 中调用这个类。这种方式在 PostBack 期间保留 GridViews 的数据

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Data;
using System.Web.UI.WebControls;
/// <summary>
/// Summary description for Global
/// </summary>
public static class Global
{

    public static List<GridView> GridViewList = new List<GridView>();
    public static string ReportType = "";
}

以下 C# 函数使用静态类中的数据导出到 excel。

public  void GridToExcel()
{
    if (berthOccupancyDataGridView.Rows.Count > 0)
    {
        Response.Clear();
        //HttpContext.Current.Response.Buffer = true;
        Response.AddHeader("content-disposition", "attachment; filename=BerthOccupancy.xls");
        //HttpContext.Current.Response.Charset = "";
        Response.ContentType = "text/csv";

        StringWriter sw = new StringWriter();
        HtmlTextWriter htw = new HtmlTextWriter(sw);
        berthOccupancyDataGridView.RenderControl(htw);

        if (Global.ReportType == "Year To Date")
        {
            foreach (GridView gv in Global.GridViewList)
            {
                gv.RenderControl(htw);
            }
        }
        else if(Global.ReportType == "Monthly")
        {
            recapGridView.RenderControl(htw);

        }

        Response.Write(sw.ToString());
        Response.End();
    }
}

【讨论】：