admin管理员组

文章数量:1302406

I am trying to create Div dynamically on the press of button click.

For that i refered this link>> .aspx

and made code on server side(.cs page) as follows>>

public static int i = 0;
    protected void Button1_Click(object sender, EventArgs e)
    {
        i++;
        HtmlGenericControl newControl = new HtmlGenericControl("div");

        newControl.ID = "NEWControl"+i;
        newControl.InnerHtml = "This is a dynamically created HTML server control.";

        PlaceHolder1.Controls.Add(newControl);
    }

This code was giving me just one div each time when i press the button., I wanted to have addition of divs.

On client side using javascript also i tried>>

<body>
    <form id="form1" runat="server">
    <div>

        <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Button" OnClientClick="addDiv();" />

    </div>
    <asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder>
    </form>
</body>
</html>
<script type="text/javascript">
    function addDiv() {
        alert("Control ming in function");
        var r = document.createElement('Div');
        r.style.height = "20px";
        r.style.width = "25px";
        r.appendChild("div");
        alert("Control going out of function");
    }
</script>

Both of these didnt work.

What mistake am i making?

Is there any thing wrong?

I am trying to create Div dynamically on the press of button click.

For that i refered this link>> http://forums.asp/t/1349244.aspx

and made code on server side(.cs page) as follows>>

public static int i = 0;
    protected void Button1_Click(object sender, EventArgs e)
    {
        i++;
        HtmlGenericControl newControl = new HtmlGenericControl("div");

        newControl.ID = "NEWControl"+i;
        newControl.InnerHtml = "This is a dynamically created HTML server control.";

        PlaceHolder1.Controls.Add(newControl);
    }

This code was giving me just one div each time when i press the button., I wanted to have addition of divs.

On client side using javascript also i tried>>

<body>
    <form id="form1" runat="server">
    <div>

        <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Button" OnClientClick="addDiv();" />

    </div>
    <asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder>
    </form>
</body>
</html>
<script type="text/javascript">
    function addDiv() {
        alert("Control ming in function");
        var r = document.createElement('Div');
        r.style.height = "20px";
        r.style.width = "25px";
        r.appendChild("div");
        alert("Control going out of function");
    }
</script>

Both of these didnt work.

What mistake am i making?

Is there any thing wrong?

Share Improve this question asked Mar 21, 2013 at 5:29 user2176240user2176240 7
  • check your page Is it getting refreshed each time? – Prasad Commented Mar 21, 2013 at 5:38
  • yeah it is getting refreshed. why? – user2176240 Commented Mar 21, 2013 at 5:39
  • then each time it will create new!!! it's causing postback – Prasad Commented Mar 21, 2013 at 5:40
  • mag ajax update panel waparun pahu ka? – user2176240 Commented Mar 21, 2013 at 5:40
  • hey, now i have kept my controls in ajax update panel , and page is not getting refreshed, still the same result.@Prasad – user2176240 Commented Mar 21, 2013 at 5:51
 |  Show 2 more ments

3 Answers 3

Reset to default 2

Use this

    public int Index
    {
       get
       {
          if(ViewState["Index"]==null)
          {
             ViewState["Index"]=0;
          }
          else
          {
             ViewState["Index"]=int.Parse(ViewState["Index"].ToString())+1;
          }

          return int.Parse(ViewState["Index"].ToString());    
       }
   }

    protected void Button1_Click(object sender, EventArgs e)
    {
        HtmlGenericControl newControl = new HtmlGenericControl("div");
        newControl.ID = "NEWControl"+Index;
        newControl.InnerHtml = "This is a dynamically created HTML server control.";

        PlaceHolder1.Controls.Add(newControl);
    }

It is giving you one div, cause you are adding one div.
Remember that asp needs you to create all dynamically added controls on very PostBack after that.

If you want two controls you have to add two to the PlaceHolder.

Just use one parent div with some ID(predefined lets say id="dvDynamic") and runat="server"

and then use it the dvDynamic.innerHTML = "<div> /* dynamic div contents */ </div>"

Its the simplest way, as if you are using html element in ASP use dom controls for better generation. Dynamic creation of control will require handled, interface and many things to co-ordinate with that control. As its not predefined by system. you have to create it.

SO choose the DOM element option. that is faster and better :)

I hope this will help :)

本文标签: cDynamic Div creation aspnetStack Overflow