简体   繁体   English

在转发器中使用按钮 onclick 事件上的 javascript 导致更新面板中的完整回发

[英]using javascript on button onclick event in repeater causing full postback in updatepanel

I have tested buttons inside the repeater in the update panel.我已经测试了更新面板中中继器内的按钮。 If you add asyncpostback <Trigger></Trigger> for buttons you're getting an error.如果您为按钮添加 asyncpostback <Trigger></Trigger> ,则会出现错误。 Button couldn't be found.找不到按钮。

Well, I am using two linkbutton inside repeater.好吧,我在中继器内使用了两个链接按钮。 i added javascript code on OnClick="__doPostback(linkbutton1, '');"我在OnClick="__doPostback(linkbutton1, '');"上添加了 javascript 代码it's working without fullpostback.它在没有完整回发的情况下工作。 Button is clicking and i am showing message.按钮正在点击,我正在显示消息。

It's working without problem.它工作没有问题。 Not facing with FullPostBack problem.不面临 FullPostBack 问题。

<asp:LinkButton runat="server" ID="linkbutton" OnClientClick="__doPostback(linkbutton1.UniqueID, '');" />

I just want to use function not directly code inside OnClick and problem has started.我只想使用 function 而不是直接在 OnClick 中编码,问题已经开始。

Example:例子:

function postback(){
__doPostback(linkbutton1.UniqueID, '');
}

ASP.NET Code: ASP.NET 代码:

<asp:UpdatePanel ID="update_buttons" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="false">
    <ContentTemplate>
      <asp:Repeater  ID="repeaterb" runat="server">
        <ItemTemplate>
          <asp:LinkButton runat="server" ID="linkbutton" OnClientClick="return postback();" />
          <asp:LinkButton runat="server" ID="linkbutton1" OnClick="linkbutton1_Click"/>
        </ItemTemplate>
      </asp:Repeater>
    </ContentTemplate>
</asp:UpdatePanel>

Code Behind:代码隐藏:

Page.ClientScript.RegisterStartupScript(this.GetType(), "postback", "postback()", true);

You using return postback() in onclient click, but that routine has to return true or false.您在 onclient click 中使用 return postback(),但该例程必须返回 true 或 false。 If true, then server side button code and "partial" post-back occurs.如果为真,则发生服务器端按钮代码和“部分”回发。

Remember, a plane jane standard asp.net button in a update panel DOES cause what we call a partial post-back (even the page load event fires).请记住,更新面板中的 plane jane standard asp.net 按钮确实会导致我们称之为部分回发(甚至触发页面加载事件)。 So, I don't see any particular difference between using a server side asp.net button, and that of using a OnClientClick which does a post-back also!!!所以,我没有看到使用服务器端 asp.net 按钮和使用 OnClientClick 之间有什么特别的区别,它也执行回发!!! - they both should do the same thing! - 他们都应该做同样的事情!

Note sure what the line of code about running a client script by injecting a client side script (register script - not sure what that has to do with this question? (somewhat confusing). You can have one button run both client side code and server side code combined into one button as I show below.请注意通过注入客户端脚本确定有关运行客户端脚本的代码行(注册脚本 - 不确定与此问题有什么关系?(有点令人困惑)。您可以通过一个按钮同时运行客户端代码和服务器如下所示,侧代码合并为一个按钮。

So, for the OnClientClick button, you would/could do this:因此,对于 OnClientClick 按钮,您可以/可以这样做:

<asp:LinkButton runat="server" ID="linkbutton" OnClientClick="postback();return false;" />

So, if the OnClientClick returns true - then the update panel postback WILL ocurr.因此,如果 OnClientClick 返回 true - 那么更新面板回发将会发生。

And if OnClientClick returns false - the the update panal postback will NOT occur.如果 OnClientClick 返回 false - 将不会发生更新面板回发。

So, lets drop in a test button, and run some server side code:因此,让我们放入一个测试按钮,并运行一些服务器端代码:

So, we now have this:所以,我们现在有这个:

  <asp:UpdatePanel ID="update_buttons" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="false">
    <ContentTemplate>
      <asp:Repeater  ID="repeaterb" runat="server">
        <ItemTemplate>

          <asp:TextBox ID="HotelName" runat="server" Text = '<%# Eval("HotelName") %>' ></asp:TextBox>
            <br />
          <asp:LinkButton runat="server" ID="linkbutton" OnClientClick="return postback();" Text="Link button"/>
            <br />
          <asp:LinkButton runat="server" ID="linkbutton1" OnClick="linkbutton1_Click" Text="Link btn 1" />
            <br />

            <asp:Button ID="Button1" runat="server" Text="Server Test button"
                onclick="Button1_Click"/>
            <div style="clear:both;height:15px"></div>
        </ItemTemplate>
      </asp:Repeater>
    </ContentTemplate>
  </asp:UpdatePanel>

So the button click servre side code could be this:所以按钮点击服务器端代码可能是这样的:

    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
            LoadMyRepeater();
    }

    void LoadMyRepeater()
    {
        using (SqlCommand cmdSQL = new SqlCommand("SELECT * from tblHotels WHERE ID = 23",
                                  new SqlConnection(Properties.Settings.Default.TEST3)))
        {
            cmdSQL.Connection.Open();
            repeaterb.DataSource = cmdSQL.ExecuteReader();
            repeaterb.DataBind();
        }
    }
    protected void Button1_Click(object sender, EventArgs e)
    {
        Button MyButton = (Button)sender;
        RepeaterItem rRow = (RepeaterItem)MyButton.Parent;

        Debug.WriteLine("Row click Index = " + rRow.ItemIndex.ToString());
        Debug.WriteLine("Hotel Name = " + ((TextBox)rRow.FindControl("HotelName")).Text);

    }

So we see this:所以我们看到这个:

在此处输入图像描述

And clicking on that button, we get this:然后点击那个按钮,我们得到这个:

Output window: Output window:

Row click Index = 0
Hotel Name = Ramada Lodge

Now, we can add a on-click click code stub to that simple button.现在,我们可以向那个简单的按钮添加一个单击代码存根。 and we can thus have both client side code + server side code run for that one button click.因此,我们可以为单击一个按钮同时运行客户端代码和服务器端代码。

And we can even conditional have that button code run by having the OnClientClick code run.我们甚至可以通过运行 OnClientClick 代码来有条件地运行该按钮代码。

The button could become this:按钮可以变成这样:

      <asp:Button ID="Button1" runat="server" Text="Server Test button"
                onclick="Button1_Click"
                OnClientClick="return myprompt();"/>

and

  <script>
        function myprompt() {
            return confirm("Do you really want to run server code?");

        }
    </script>

And then when you click on that button you get this:然后当你点击那个按钮时,你会得到这个:

在此处输入图像描述

So, now if you click ok, server side code for button runs, but if you hit cancel, then the server side code button does not run.所以,现在如果你点击确定,按钮的服务器端代码就会运行,但是如果你点击取消,那么服务器端代码按钮就不会运行。

But, be careful with prompts.但是,请注意提示。 If you use a jQuery dialog, toast message routine?如果您使用 jQuery 对话框,toast 消息例程?

Those routines do NOT wait, and you have to change that code a bit, since it runs async, and most jquery dialogs and message boxes do NOT wait, and hence you can't conditional prompt the user that way (I can post how you can do this if you wish).这些例程不会等待,并且您必须稍微更改该代码,因为它运行异步,并且大多数 jquery 对话框和消息框不会等待,因此您不能以这种方式有条件地提示用户(我可以发布您的方式如果您愿意,可以这样做)。

So, it not clear if you just want to drop in, + use a standard asp.net button, but ONLY call client side code?所以,不清楚你是否只是想加入,+使用标准的 asp.net 按钮,但只调用客户端代码?

As noted, then make sure the expression returns false.如前所述,然后确保表达式返回 false。 or as noted, use:或者如前所述,使用:

 OnClientClick="postback();return false;"

I

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM