CODEWITHSUNDEEP
javascriptc#jqueryasp.net
Sarah Chaygani
Sarah Chaygani

Reputation: 49

How to make a TextAarea inside a Repeater shows on the click of a Button using JavaScript?

I'm trying to make A textarea inside a Repeater shows up on the click of a button (the button is also inside the same Repeater along with the Textarea)

function ShowTextArea()
    {
        var rpt = document.getElementById("<%= Repeater1.ClientID%>");
        var inputs = rpt.getElementsByTagName("input");
        for (var i = 0; i < inputs.length; i++)
        {
            if (inputs[i].click())
            {
                $("#txtcmt2").show();
            }
        }
    }

this is the Repeater:

<asp:Repeater ID="Repeater1" runat="server" DataSourceID="comment" OnItemDataBound="Repeater1_ItemDataBound" OnItemCreated="Repeater1_ItemCreated">
                <ItemTemplate>
                    <asp:ImageButton ID="ImageButton1" ImageUrl="Icons/profile-user.png" CssClass="btn btn-default" runat="server" /><label><%#Eval("FullName") %></label>
                    <div runat="server" class="form-control">
                        <%#Eval("Commentaire") %>
                    </div>
                    <asp:HiddenField ID="HiddenField1" runat="server" Value=' <%# Eval("CodeCommentaire") %> ' />
                    <asp:ImageButton ID="spambtn" CssClass="btn btn-default" ImageUrl="Icons/warning.png" runat="server" />
                    <input id="rplybtn" Class="btn btn-info" type="button" onclick="ShowTextArea();" value="Reply" />
                    <textarea id="txtcmt2"  cols="50" rows="4" class="form-control" style="visibility:hidden" runat="server"></textarea>
                    <asp:Repeater ID="Repeater2" runat="server">
                        <ItemTemplate>
                            <asp:ImageButton ID="Imagsous" ImageUrl="Icons/profile-user.png" CssClass="btn btn-default" runat="server" /><label><%#Eval("FullName") %></label>
                            <div id="souscmt" ><%#Eval("Commentaire_sous") %></div>
                        </ItemTemplate>
                    </asp:Repeater>
                </ItemTemplate>
            </asp:Repeater>

Upvotes: 1

Views: 123

Answers (1)

gmiley
gmiley

Reputation: 6604

If you are going to have multiple blocks of this, I would change the javascript to this:

function ShowTextArea(clientId)
    {
        var rpt = document.getElementById(clientId);
        var inputs = rpt.getElementsByTagName("input");
        for (var i = 0; i < inputs.length; i++)
        {
            if (inputs[i].click())
            {
                $("#txtcmt2").show();
            }
        }
    }

Then in the <asp:ImageButton /> tag, add an onClick="ShowTextArea('<%= Repeater1.ClientId %>');". You may want to change the Rpeater1 to use whatever variable you are using within the loop, i.e. currentRepeater if you are doing something like:

foreach(var currentRepeater in RepeaterCollection)
{
   // repeater block write code...
}

Or you could reference the textarea directly from the onClick event:

<asp:ImageButton ID="Imagsous" ImageUrl="..." onClick="$('txtcmt2').show();" />

Upvotes: 1

Related Questions