Click here to Skip to main content
15,896,359 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
Hi guys i need a help here, i have a button that is cloning a div, but after a few seconds the cloned div is disappearing

ASP.NET
<b>HTML Code:</b>
<pre lang="Javascript">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
   <ContentTemplate>
      <div class="panel-body" style="overflow: auto; height: 659px;">
        <div class="personalInfo">
          <table class="tableOverride table-responsive">
            <tr>
              <th>Mobile Number:
              </th>
              <td>
                <asp:TextBox ID="txtBoxMobileNum" runat="server" CssClass="form-controlOverride"></asp:TextBox>
              </td>
            </tr>
            <tr>
              <th>Home Number:
              </th>
              <td>
                <asp:TextBox ID="txtBoxHomeNum" runat="server" CssClass="form-controlOverride"></asp:TextBox>
              </td>
            </tr>
            <tr>
              <th>Personal Email:
              </th>
              <td>
                <asp:TextBox ID="txtBoxPersonalEmail" runat="server" CssClass="form-controlOverride"></asp:TextBox>
              </td>
            </tr>
          </table>
        </div>

        <div>
          <div class="text-center">
            <button id="clonePersonalInfo" class="btn btn-default" style="height: 30px; text-decoration: underline;">Add Contact Information</button>
          </div>
          <div class="pull-left">
            <asp:Button ID="btnSavePersonalInfo" runat="server" Text="Save" Width="100px" Height="30px" CssClass="btn btn-primary" />
          </div>
        </div>
    </ContentTemplate>
</asp:UpdatePanel>
</pre>


What I have tried:

jquery Code:
JavaScript
$(document).ready(function () {
    $('#clonePersonalInfo').click(function () {
        $('div.personalInfo').after(function () {
            return $(this).clone();
        });
    });
});
Posted
Updated 5-May-16 20:23pm
Comments
Sergey Alexandrovich Kryukov 5-May-16 16:02pm    
jQuery cannot appear or disappear, especially in seconds. This is just a library. :-)
Something is disappearing only if you program it this way. I'm not sure you show all relevant code.
—SA
ZurdoDev 5-May-16 16:28pm    
You need to debug it and provide more info. Not sure how we can help. What does "disappearing" mean here?

1 solution

< button > always submits (thus going to the server and refreshing the page). This will (ofcourse) remove your added element.

To solve this, return false from the click handler like this:

JavaScript
$(document).ready(function () {
    $('#clonePersonalInfo').click(function () {
        $('div.personalInfo').after(function () {
            return $(this).clone();
        });

        return false;
    });
});


If this helps, please mark this as an answer. Thank you.
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900