防止gridview中的按钮使用javascript回发 [英] prevent button inside a gridview to postback using javascript

问题描述

我有使用模板的gridview，模板中有两个按钮.这是我的gridview代码:

i have gridview that uses template and i have two buttons inside the template. Here is my code for gridview:

      <asp:GridView ID="gvtransaction" runat="server" AutoGenerateColumns="False" Width="60%">
            <Columns>
                <asp:TemplateField HeaderText="">
                    <ItemTemplate>
                        <asp:Label ID="lblid" runat="server" Text='<%# Bind("id") %>' Visible="false"></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Consumer">
                    <ItemTemplate>
                        <asp:Label ID="lblfirstname" runat="server" Text='<%# Bind("FirstName") %>'></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Name">
                    <ItemTemplate>
                        <asp:Label ID="lbllastname" runat="server" Text='<%# Bind("LastName") %>'></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Amount">
                    <ItemTemplate>
                        <asp:Label ID="lblamount" runat="server" Text='<%# Bind("Amount") %>'></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="">
                    <ItemTemplate>
                        <asp:Label ID="lblcurrencyID" runat="server" Text='<%# Bind("CurrencyID") %>' Visible="false"></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Account Name">
                    <ItemTemplate>
                        <asp:Label ID="lblcurrencyname" runat="server" Text='<%# Bind("CurrencyName") %>'></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Status">
                    <ItemTemplate>
                        <asp:Label ID="lblstatus" runat="server" Text='<%# Bind("Status") %>'></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="DateCreated">
                    <ItemTemplate>
                        <asp:Label ID="lbldatecreated" runat="server" Text='<%# Bind("DateCreated") %>'></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>

                <asp:TemplateField HeaderText="">
                    <ItemTemplate>
                        <asp:Button ID="btnApprove" runat="server" Text="Approve" CommandName="Select" OnClick="btnApprove_Click" />
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="">
                    <ItemTemplate>
                        <asp:Button ID="btnReject" runat="server" Text="Reject" CommandName="Select" OnClick="btnReject_Click" />
                    </ItemTemplate>
                </asp:TemplateField>
            </Columns>
        </asp:GridView>

现在我要发生的是防止按钮(如果单击两次)回发.如果用户第二次单击该按钮，则当该行的状态字段不等于待处理状态时，它不应回发.我如何使用jquery做到这一点?我不知道如何编码.我读过的一些文章建议我应该使用AJAX(我不知道如何编码AJAX)... 请帮忙.

now what i want to happen is to prevent the button (if clicked twice ) to postback. If the user clicks the button for the second time, it shouldn't post back when it sees that the status field of the row is not equal to pending. How can i do this using jquery.? I have no idea on how to code this. Some articles that i've read suggests that i should use AJAX (i dont know how to code AJAX)... please help..

推荐答案

单击按钮时，您可以在javascript中添加加载程序 css

When button click you can add a loader throught javascript css

.loader 
{    
position:   fixed;
z-index:    1000;
top:        0;
left:       0;
height:     100%;
width:      100%;
-moz-opacity:0.6; /* Mozilla */
opacity: 0.6; /* CSS3 */
-ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=40)'; /* first!*/
filter: alpha(opacity=40); /* second!*/    
background: #C0C0C0
            url('../images/Loader.gif')    
            50% 50%              
            no-repeat
 }

html

<div id="mask" class="loader">
</div>

jQuery onload

jquery onload

 $('#mask').css('display', 'none');

按下按钮时的jQuery

jquery on button press

$('#mask').css('display', 'block');

完成点击程序后

$('#mask').css('display', 'none');

通过这种方式，用户将单击一次.完成程序后，只需按一下即可.

With this way user will click once. After procedure finsished will press it only.

这篇关于防止gridview中的按钮使用javascript回发的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！