Client Side Confirmation on DataGrid "Delete" LinkButton

Discussion in 'ASP .Net' started by =?Utf-8?B?QWxleCBNYWdoZW4=?=, May 2, 2006.

  1. I have a DataGrid control with a LinkButton command column that deletes the
    row. What I want to do is set it up so that there's a client-side Confirm
    alert BEFORE the actual Delete command gets called on the server-side. That's
    easy to do with normal buttons, etc. as follows...

    <asp:Button ID="ConfirmBtn" Text="ConfimMe!"
    OnClientClick="if(!confirm('Are you sure?'))return false;"
    OnClick="ConfirmBtnClickHandler" Runat="server" />

    But OnClientClick, etc. are not supported for the DataGrid LinkButton. So
    how could I do this?

    Alex
     
    =?Utf-8?B?QWxleCBNYWdoZW4=?=, May 2, 2006
    #1
    1. Advertising

  2. You can always add it by code:
    ConfirmBtn.Attributes.Add ("onclick", "if (! confirm('Are you sure?'))
    return false;");

    - Steve

    "Alex Maghen" wrote:

    > I have a DataGrid control with a LinkButton command column that deletes the
    > row. What I want to do is set it up so that there's a client-side Confirm
    > alert BEFORE the actual Delete command gets called on the server-side. That's
    > easy to do with normal buttons, etc. as follows...
    >
    > <asp:Button ID="ConfirmBtn" Text="ConfimMe!"
    > OnClientClick="if(!confirm('Are you sure?'))return false;"
    > OnClick="ConfirmBtnClickHandler" Runat="server" />
    >
    > But OnClientClick, etc. are not supported for the DataGrid LinkButton. So
    > how could I do this?
    >
    > Alex
     
    =?Utf-8?B?U3RldmUgR29vZHllYXI=?=, May 2, 2006
    #2
    1. Advertising

  3. Hi Alex,

    For such scenario, as Steve has mentioned, we may need to use code to
    programmatically add the client script for the button. Also, are you using
    the built-in button column in DataGrid as below?

    <asp:ButtonColumn ButtonType="linkButton" ></asp:ButtonColumn>

    If so, it'll be very hard to reference the actual button object at runtime
    (so as to custimze it) because the button id is autogenerated and it's
    unsafe to locate sub controls through control index. I think you can
    consider use template column instead of built-in column for such scenario.
    And in VS IDE's designview , it provide the wizard for us to convert a
    button column to a template column. For example, the above link button
    column can be converted to the below template column:(I add the id for the
    link button so that we can referece it later):

    =========
    <asp:TemplateColumn>
    <ItemTemplate>
    <asp:LinkButton ID="lbDelete" runat="server"
    CausesValidation="false" CommandName="" Text="Delete"></asp:LinkButton>
    </ItemTemplate>
    </asp:TemplateColumn>
    ==============

    Then, in DataGrid's ItemdataBound event, we can use the following code to
    locate the linkbutton and add client-sdie script behavior for it:

    protected void DataGrid1_ItemCreated(object sender, DataGridItemEventArgs e)
    {
    if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType ==
    ListItemType.AlternatingItem)
    {
    LinkButton lb = e.Item.FindControl("lbDelete") as LinkButton;

    lb.OnClientClick = "if(!confirm('are you sure to delete this
    item?')){return false;}";

    }
    }


    Hope this helps. If there is anything I missed, please feel free to post
    here.

    Regards,

    Steven Cheng
    Microsoft Online Community Support


    ==================================================

    When responding to posts, please "Reply to Group" via your newsreader so
    that others may learn and benefit from your issue.

    ==================================================


    This posting is provided "AS IS" with no warranties, and confers no rights.



    Get Secure! www.microsoft.com/security
    (This posting is provided "AS IS", with no warranties, and confers no
    rights.)
     
    Steven Cheng[MSFT], May 2, 2006
    #3
  4. G-d, you're good!!! Now just one question remains about this... In the sample
    you gave, everything works but I don't know how to actually create a
    server-side function that reacts to this TemplateColumn LinkButton. In your
    example below, do I just add an OnClick handler to the <asp:LinkButton /> ?

    Alex


    "Steven Cheng[MSFT]" wrote:

    > Hi Alex,
    >
    > For such scenario, as Steve has mentioned, we may need to use code to
    > programmatically add the client script for the button. Also, are you using
    > the built-in button column in DataGrid as below?
    >
    > <asp:ButtonColumn ButtonType="linkButton" ></asp:ButtonColumn>
    >
    > If so, it'll be very hard to reference the actual button object at runtime
    > (so as to custimze it) because the button id is autogenerated and it's
    > unsafe to locate sub controls through control index. I think you can
    > consider use template column instead of built-in column for such scenario.
    > And in VS IDE's designview , it provide the wizard for us to convert a
    > button column to a template column. For example, the above link button
    > column can be converted to the below template column:(I add the id for the
    > link button so that we can referece it later):
    >
    > =========
    > <asp:TemplateColumn>
    > <ItemTemplate>
    > <asp:LinkButton ID="lbDelete" runat="server"
    > CausesValidation="false" CommandName="" Text="Delete"></asp:LinkButton>
    > </ItemTemplate>
    > </asp:TemplateColumn>
    > ==============
    >
    > Then, in DataGrid's ItemdataBound event, we can use the following code to
    > locate the linkbutton and add client-sdie script behavior for it:
    >
    > protected void DataGrid1_ItemCreated(object sender, DataGridItemEventArgs e)
    > {
    > if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType ==
    > ListItemType.AlternatingItem)
    > {
    > LinkButton lb = e.Item.FindControl("lbDelete") as LinkButton;
    >
    > lb.OnClientClick = "if(!confirm('are you sure to delete this
    > item?')){return false;}";
    >
    > }
    > }
    >
    >
    > Hope this helps. If there is anything I missed, please feel free to post
    > here.
    >
    > Regards,
    >
    > Steven Cheng
    > Microsoft Online Community Support
    >
    >
    > ==================================================
    >
    > When responding to posts, please "Reply to Group" via your newsreader so
    > that others may learn and benefit from your issue.
    >
    > ==================================================
    >
    >
    > This posting is provided "AS IS" with no warranties, and confers no rights.
    >
    >
    >
    > Get Secure! www.microsoft.com/security
    > (This posting is provided "AS IS", with no warranties, and confers no
    > rights.)
    >
    >
     
    =?Utf-8?B?QWxleCBNYWdoZW4=?=, May 2, 2006
    #4
  5. So I tried adding an OnClick to the LinkButton in your example below and I
    *do* get the event back. But here's the problem - I want to be able to
    extract the data from the row of the LinkButton that was actually called but
    the prototype for a LinkButton seems to deliver an EventArgs parameter as
    opposed to a DataGridCommandEventArgs parameter. So how to I get the data out
    of the row that was actually clicked?

    "Steven Cheng[MSFT]" wrote:

    > Hi Alex,
    >
    > For such scenario, as Steve has mentioned, we may need to use code to
    > programmatically add the client script for the button. Also, are you using
    > the built-in button column in DataGrid as below?
    >
    > <asp:ButtonColumn ButtonType="linkButton" ></asp:ButtonColumn>
    >
    > If so, it'll be very hard to reference the actual button object at runtime
    > (so as to custimze it) because the button id is autogenerated and it's
    > unsafe to locate sub controls through control index. I think you can
    > consider use template column instead of built-in column for such scenario.
    > And in VS IDE's designview , it provide the wizard for us to convert a
    > button column to a template column. For example, the above link button
    > column can be converted to the below template column:(I add the id for the
    > link button so that we can referece it later):
    >
    > =========
    > <asp:TemplateColumn>
    > <ItemTemplate>
    > <asp:LinkButton ID="lbDelete" runat="server"
    > CausesValidation="false" CommandName="" Text="Delete"></asp:LinkButton>
    > </ItemTemplate>
    > </asp:TemplateColumn>
    > ==============
    >
    > Then, in DataGrid's ItemdataBound event, we can use the following code to
    > locate the linkbutton and add client-sdie script behavior for it:
    >
    > protected void DataGrid1_ItemCreated(object sender, DataGridItemEventArgs e)
    > {
    > if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType ==
    > ListItemType.AlternatingItem)
    > {
    > LinkButton lb = e.Item.FindControl("lbDelete") as LinkButton;
    >
    > lb.OnClientClick = "if(!confirm('are you sure to delete this
    > item?')){return false;}";
    >
    > }
    > }
    >
    >
    > Hope this helps. If there is anything I missed, please feel free to post
    > here.
    >
    > Regards,
    >
    > Steven Cheng
    > Microsoft Online Community Support
    >
    >
    > ==================================================
    >
    > When responding to posts, please "Reply to Group" via your newsreader so
    > that others may learn and benefit from your issue.
    >
    > ==================================================
    >
    >
    > This posting is provided "AS IS" with no warranties, and confers no rights.
    >
    >
    >
    > Get Secure! www.microsoft.com/security
    > (This posting is provided "AS IS", with no warranties, and confers no
    > rights.)
    >
    >
     
    =?Utf-8?B?QWxleCBNYWdoZW4=?=, May 2, 2006
    #5
  6. Thanks for your response Alex,

    Actually, for push button or linkbutton in DataGrid or Gridview, their
    postback event will be mapped to the ItemCommand event (or RowCommand for
    GridView) by the "CommandName" attribute. For example, for our link button
    in the DataGrid template column, we can add the "Delete" value for the
    "CommandName" attribute as below:

    =======================
    <asp:TemplateColumn>
    <ItemTemplate>
    <asp:LinkButton ID="lbDelete" runat="server"
    CausesValidation="false" CommandName="Delete"
    Text="Delete"></asp:LinkButton>
    </ItemTemplate>
    </asp:TemplateColumn>
    ===========================

    Then, in the DataGrid's "ItemCommand" event, we can can handle the
    linkbutton postback as below:

    =======================
    protected void DataGrid1_ItemCommand(object source,
    DataGridCommandEventArgs e)
    {
    if (e.CommandName == "Delete")
    {
    Response.Write("<br/>" + e.CommandName + ": " +
    e.Item.ItemIndex);
    }
    }
    ==========================

    Hope this helps.

    Regards,

    Steven Cheng
    Microsoft Online Community Support


    ==================================================

    When responding to posts, please "Reply to Group" via your newsreader so
    that others may learn and benefit from your issue.

    ==================================================


    This posting is provided "AS IS" with no warranties, and confers no rights.



    Get Secure! www.microsoft.com/security
    (This posting is provided "AS IS", with no warranties, and confers no
    rights.)
     
    Steven Cheng[MSFT], May 3, 2006
    #6
  7. Is there ANYTHING you don't know? :)
    Thanks!

    Alex

    "Steven Cheng[MSFT]" wrote:

    > Thanks for your response Alex,
    >
    > Actually, for push button or linkbutton in DataGrid or Gridview, their
    > postback event will be mapped to the ItemCommand event (or RowCommand for
    > GridView) by the "CommandName" attribute. For example, for our link button
    > in the DataGrid template column, we can add the "Delete" value for the
    > "CommandName" attribute as below:
    >
    > =======================
    > <asp:TemplateColumn>
    > <ItemTemplate>
    > <asp:LinkButton ID="lbDelete" runat="server"
    > CausesValidation="false" CommandName="Delete"
    > Text="Delete"></asp:LinkButton>
    > </ItemTemplate>
    > </asp:TemplateColumn>
    > ===========================
    >
    > Then, in the DataGrid's "ItemCommand" event, we can can handle the
    > linkbutton postback as below:
    >
    > =======================
    > protected void DataGrid1_ItemCommand(object source,
    > DataGridCommandEventArgs e)
    > {
    > if (e.CommandName == "Delete")
    > {
    > Response.Write("<br/>" + e.CommandName + ": " +
    > e.Item.ItemIndex);
    > }
    > }
    > ==========================
    >
    > Hope this helps.
    >
    > Regards,
    >
    > Steven Cheng
    > Microsoft Online Community Support
    >
    >
    > ==================================================
    >
    > When responding to posts, please "Reply to Group" via your newsreader so
    > that others may learn and benefit from your issue.
    >
    > ==================================================
    >
    >
    > This posting is provided "AS IS" with no warranties, and confers no rights.
    >
    >
    >
    > Get Secure! www.microsoft.com/security
    > (This posting is provided "AS IS", with no warranties, and confers no
    > rights.)
    >
    >
    >
    >
    >
    >
    >
    >
    >
    >
    >
     
    =?Utf-8?B?QWxleCBNYWdoZW4=?=, May 3, 2006
    #7
  8. Thanks for your response Alex,

    Sure, the more we've learnt, the more we'll find that we don't know.
    Anyway, if there is anything we can help on ASP.NET developing , please
    feel free to post here.

    Regards,

    Steven Cheng
    Microsoft Online Community Support


    ==================================================

    When responding to posts, please "Reply to Group" via your newsreader so
    that others may learn and benefit from your issue.

    ==================================================


    This posting is provided "AS IS" with no warranties, and confers no rights.



    Get Secure! www.microsoft.com/security
    (This posting is provided "AS IS", with no warranties, and confers no
    rights.)
     
    Steven Cheng[MSFT], May 4, 2006
    #8
  9. =?Utf-8?B?QWxleCBNYWdoZW4=?=

    AcesHidden

    Joined:
    Nov 23, 2010
    Messages:
    1
    Actually...

    While Steven's solution will work, I found this to be easier.

    Code:
    <asp:TemplateColumn>
        <ItemTemplate>
            <asp:Button ID="Delete" CommandName="Delete" Text="Delete" runat="server" OnClientClick="return confirm('Are you sure you want to permanently delete this item?')" />
        </ItemTemplate>
    </asp:TemplateColumn>
    
    There is no server side code involved and you can get an actual button instead of a link. :D
     
    AcesHidden, Nov 23, 2010
    #9
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Gönen EREN

    linkbutton: confirmation with javascript

    Gönen EREN, Aug 12, 2003, in forum: ASP .Net
    Replies:
    1
    Views:
    996
    Natty Gur
    Aug 13, 2003
  2. Shaul Feldman
    Replies:
    0
    Views:
    868
    Shaul Feldman
    Apr 16, 2004
  3. Replies:
    2
    Views:
    509
  4. Replies:
    1
    Views:
    730
    Norman Yuan
    Mar 22, 2007
  5. ASMJ
    Replies:
    0
    Views:
    216
Loading...

Share This Page