Programmatically Accessing Html Control Created in ASP.NET

Question

Hello there. I have created a new div inside another div in asp.net. Now I want to use the innerhtml property of that newly created div. I can't find a way..

This is what im doing in my .aspx page..

      <asp:ScriptManager ID="ScriptManager1" runat="server">
      </asp:ScriptManager>
      <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
            <div id="forNewEmployee" runat="server"></div>
        </ContentTemplate>
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="link" EventName="click" />
        </Triggers>
      </asp:UpdatePanel>

     <div class="addMore">
      <asp:Button ID="link"  CssClass="label"  runat="server" Text="Add More - Image" 
          onclick="link_Click" />
     </div>

and in codebehind file..

protected void link_Click(object sender, EventArgs e)
{
    if (clickCheck != 0)
    {
        // access the newly generated div 'forNewEmployee' + specific id and call its innerHtml Method?
        System.Web.UI.HtmlControls.HtmlControl div = (System.Web.UI.HtmlControls.HtmlControl)ScriptManager1.FindControl("forNewEmployee" + clickCheck);

    }
    else {
        this.forNewEmployee.InnerHtml = newRow();        
    }
}

I have a function in which I'm building the string to introduce new elements inside the forNewEmployee div. This is how it is defined..

protected string newRow() {
    // check for click
    clickCheck++;

    // check for new row
    countForEmployee++;

    // building our new row
    rowString.AppendLine("<label for='empName" + countForEmployee.ToString() + "'>Your Employee Name: <span>(required)</span></label>");
    rowString.AppendLine("<input id='empName" + countForEmployee.ToString() + "' class='registrationformEmployeeText' />");
    rowString.AppendLine("</div>");

    rowString.AppendLine("<div id='forNewEmployee" + countForEmployee.ToString() + "' name='forNewEmployee" + countForEmployee.ToString() + "' runat='server'></div>");

    return rowString.ToString();
}

You can consider using `asp:Panel` instead of `div` which renders almost the same and is more friendly to use in code behind. — Episodex, Jan 20 '12 at 14:44
how do I fetch the new div created in newRow() and call its innerHtml method? — Muhammad Usman, Jan 20 '12 at 16:10

score 0 · Answer 1 · answered Jan 20 '12 at 14:46

0

I'm not entirely sure you can do it with div but sure you can do it with asp:Panel:

this.forNewEmployee.Controls.Add(new Literal(newRow());

answered Jan 20 '12 at 14:46

Episodex

4,479
3
41
58

But the question is still the same how do I get fetch new div having id='forNewEmployee+the-number-of-times-newRow()-was-called' created in newRow() function. The thing is I want to clone the entire row but with different ids. For example IF i do not create new div in newRow function and add newRow in previous div/panel, it replaces the entire html but don't appends the new row inside forNewEmployee div.. – Muhammad Usman Jan 20 '12 at 16:08

score 0 · Answer 2 · answered Jan 20 '12 at 16:51

The easiest thing would be to use the asp .net panel, and create and add asp .net controls (even if they are literal controls).

So basically your NewRow function will be:

protected Panel newRow() { 
   // check for click 
   clickCheck++; 

   // check for new row 
   countForEmployee++; 

   // building our new row 
    Panel pnl = new Panel();
    pnl.Controls.Add(new Literal("<label for='empName" + countForEmployee.ToString() + "'>Your Employee    Name: <span>(required)</span></label>"));
    pnl.Controls.Add(new Literal("<input id='empName" + countForEmployee.ToString() + "' class='registrationformEmployeeText' />"));

    Panel forNewEmployee = new Panel();
    forNewEmployee.ID = "forNewEmployee" + countForEmployee.ToString();

    pnl.Controls.Add(forNewEmployee);

    return pnl;

}

This way, you will be able to do a FindControl with Control ID that you specified.

Programmatically Accessing Html Control Created in ASP.NET

2 Answers2