[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 224
  • Last Modified:

Retrieving an ID from a dynamically created control?

I am building an HTML Table dynamically to show records. It's essentially a grid of data. The first cell of each row contains a checkbox which is dynamically created the same time the table is. This checkbox is used to select the record for editing. My question is, how can I check when a checkbox is checked so I can retrieve a record. I'm using VB.Net but thinking Javascript would work. I'm just not real good with Javascript.

Thanks,
0
BlakeMcKenna
Asked:
BlakeMcKenna
  • 2
  • 2
1 Solution
 
ExpertHelp79Commented:
Option 1
<asp:GridView ID="GridView1" runat="server" AllowPaging="True" 
   AllowSorting="True" AutoGenerateColumns="False" DataKeyNames="PersonID" 
   DataSourceID="mySource" Width="366px" CellPadding="4" 
   ForeColor="#333333" GridLines="None">
 <Columns>
   <asp:CommandField ShowSelectButton="True" />
   <asp:BoundField DataField="PersonID" HeaderText="PersonID" 
         InsertVisible="False" ReadOnly="True" SortExpression="PersonID" />
   <asp:BoundField DataField="Name" HeaderText="Name" 
                                       SortExpression="Name" />
   <asp:TemplateField HeaderText="Select">
    <ItemTemplate>
       <asp:CheckBox ID="chkSelect" runat="server" />
    </ItemTemplate>
    <HeaderTemplate>
    </HeaderTemplate>
   </asp:TemplateField>

 </Columns>

 <FooterStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
 <RowStyle BackColor="#FFFBD6" ForeColor="#333333" />
 <PagerStyle BackColor="#FFCC66" ForeColor="#333333" 
                           HorizontalAlign="Center" />
 <SelectedRowStyle BackColor="#FFCC66" Font-Bold="True" ForeColor="Navy" />
 <HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
 <AlternatingRowStyle BackColor="White" />
</asp:GridView>

+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

Now in the button click event, write this code:

 Collapse
// StringBuilder object

StringBuilder str = new StringBuilder();

// Select the checkboxes from the GridView control

for (int i = 0; i < GridView1.Rows.Count; i++)
{
  GridViewRow row = GridView1.Rows[i];
  bool isChecked = ((CheckBox) row.FindControl("chkSelect")).Checked;

  if (isChecked)
  {
    // Column 2 is the name column

    str.Append(GridView1.Rows[i].Cells[2].Text);
  }
}

// prints out the result

Response.Write(str.ToString());

Open in new window

<HeaderTemplate>
  <input id="chkAll" onclick="javascript:SelectAllCheckboxes(this);" 
              runat="server" type="checkbox" />
</HeaderTemplate>
SelectAllCheckboxes JavaScript method:

 Collapse
<script language="javascript">

 function SelectAllCheckboxes(spanChk){

   // Added as ASPX uses SPAN for checkbox

   var oItem = spanChk.children;
   var theBox= (spanChk.type=="checkbox") ? 
        spanChk : spanChk.children.item[0];
   xState=theBox.checked;
   elm=theBox.form.elements;

   for(i=0;i<elm.length;i++)
     if(elm[i].type=="checkbox" && 
              elm[i].id!=theBox.id)
     {
       //elm[i].click();

       if(elm[i].checked!=xState)
         elm[i].click();
       //elm[i].checked=xState;

     }
 }
</script>

Open in new window

0
 
ExpertHelp79Commented:
option 2:
protected void GridView_RowDataBound(object sender, GridViewRowEventArgs e)
{
  CheckBox c = e.Row.Cells[4].FindControl("YourCheckboxId");
  if(c != null && e.Row.DataItem["sFixed_f"] == true)
  {
    c.Checked = true;
  }
}

Open in new window

0
 
cslimrunCommented:
The following will trigger a post back with the id of the record:
Since you are dynamically creating the checkbox - make sure to set the value (DB_ID below) to the correct database id.

ASPX:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript">
        function EnterEditMode(id) {
            //Do something here to enter edit mode - assuming a postback
            __doPostBack('FakePostBackButton', id);
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <table>
            <tr>
                <td>
                    <input type="checkbox" value="DB_ID" onclick="EnterEditMode(this.value)" />
                </td>
            </tr>
            ...
        </table>        
        <asp:Button ID="FakePostBackButton" runat="server" OnClick="ServerPostBackHandler" style="display: none;" />
    </div>    
    </form>
</body>
</html>

Open in new window


CS:
void FakePostBackButton_Click(object sender, EventArgs e)
{
    //Get ID passed in as argumnet of __doPostBack
    int id = Convert.ToInt32(Request["__EVENTARGUMENT"]);

    //Lookup record
    ...
}

Open in new window

0
 
BlakeMcKennaAuthor Commented:
None of these proposed solutions are viable.
0
 
cslimrunCommented:
You should probably come up with a solution more viable than dynamically generating HTML then.... lol
0

Featured Post

Get free NFR key for Veeam Availability Suite 9.5

Veeam is happy to provide a free NFR license (1 year, 2 sockets) to all certified IT Pros. The license allows for the non-production use of Veeam Availability Suite v9.5 in your home lab, without any feature limitations. It works for both VMware and Hyper-V environments

  • 2
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now