custom templatefield using ASP.NET Gridview

Question

Hi,

I can figure out a couple of hack ways of doing this,...but no really neat ".NET" way.

I am displaying a table of data using Gridview...one of the columns is dedicated to displaying the status of a boolean variable. The spec I am trying to meet is to have a "On" and "Off" button in the column representing this variable....and clicking ON would change the variable to 1 in my database,...and clicking OFF would change it to 0 etc.

I usually deal with php but I'm guessing this can somehow be done in a clean fashion using the templatefield...but,..i don't know how, which is why i'm asking :)

any tips would be appreciated. Andrew

Answer 1

Something like this should get what you're after.

ASPX Side:

<templateField>
  <itemtemplate>
    <asp:button runat="server" id="myButton" Text='<%# Response.Write(IIF(Eval("MyBool"),"Off", "On")) %>' CommandName='<%# Response.Write(IIF(Eval("MyBool"),"TurnOff", "TurnOn")) %>' CommandArgument='<%# Eval("MyRowIdentifier") %>' />
  </itemTemplate>
</templateField>

code behind:

protected sub Row_itemCommand (ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewCommandEventArgs) Handles MyGrid.RowCommand
   Dim btn As Button =e.Item.FindControl("myButton")
   Select case e.CommandName 
      case "TurnOff"
        MyTurnOffFunction(e.CommandArgument)
        btn.Text = "Off"
        btn.CommandName="TurnOn"
      Case "TurnOn"
        MyTurnOnFunction(e.CommandArgument)
        btn.Text = "On"
        btn.CommandName="TurnOff"
    End Select

End Sub

Answer 2

You are right about the template field:

  <asp:GridView ID="GridView1" runat="server" onrowcommand="GridView1_RowCommand">
    <Columns>
        <asp:TemplateField>
            <ItemTemplate>
                <asp:Image ID="img_on" Visible='<%# (bool) Eval("FieldBoolean") %>' runat="server" ImageUrl="GreenLight.jpg" />
                <asp:Image ID="img_off" Visible='<%# !(bool) Eval("FieldBoolean") %>' runat="server" ImageUrl="RedLight.jpg" />
            </ItemTemplate>
            <EditItemTemplate>
             <asp:button ID="btn_switch" runat="server" Text='<%# Response.Write( (bool) Eval("FieldBoolean") ?  "Off" : "On")) %>' CommandName="switch"
              CommandArgument='<%# Eval("FieldBoolean") %>' />

            </EditItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>




protected void GridView1_RowCommand(object sender, GridViewCommandEventArgs e)
        {
            if (e.CommandArgument == "switch")
            {
                UpdateValue(!bool.Parse((string) e.CommandArgument));
            }
        }

Answer 3

Page

<ItemTemplate>
    <asp:ImageButton id="OnButton" runat="server" OnClick="ToggleButtons" visible="True"/>
    <asp:ImageButton id="OffButton" runat="server"OnClick="ToggleButtons" visible="False" />
</ItemTemplate>

Code Behind

protected void ToggleButtons(object sender, EventArgs e)
{
    if (OnButton.visible) 
    {
        OnButton.visible = false;
        OnButton.visible = true;
    } else {
        OnButton.visible = true;
        OnButton.visible = false;
    }
    DoWork(OnButton.visible);
}

Answer 4

I think you can do something like this:

<Columns>
  <asp:TemplateField>
    <ItemTemplate>
      <asp:ImageButton ID="btnEliminar" runat="server" 
         ImageUrl=<%# ((bool) Eval("condition"))? "yes.png":"no.png" %>
         OnClick="btnEliminar_Click"  
      />
    </ItemTemplate>
  </asp:TemplateField>
</columns>

On the image OnClick event you should update your database, according some logic you must evaluate.