1 Replies - 4153 Views - Last Post: 12 February 2014 - 09:09 AM Rate Topic: -----

#1 raelkun00   User is offline

  • D.I.C Head

Reputation: 1
  • View blog
  • Posts: 99
  • Joined: 01-October 12

How to invoke Javascrip on ImageButton click.ASP.NET

Posted 06 February 2014 - 06:37 PM

Right now I am using image to invoke the Javascript. I am using this to show the nested gridview when I click the image. What I want is to use ImageButton in Invoking the JQuery.

Here is my code:
<asp:TemplateField>
                                    <ItemTemplate>
                                        
                                        <img alt = "" style="cursor: pointer" src="images/plus.png" />
                                            <asp:Panel ID="pnlOrders" runat="server" Style="display: none">
                                                <asp:GridView ID="gvItems" runat="server" AutoGenerateColumns="false" CssClass = "ChildGrid">
                                                    <Columns>
                                                       <asp:TemplateField>
                                                         <ItemTemplate>
                                                            <asp:CheckBox  ID="chkSelectItems" runat="server"/>
                                                         </ItemTemplate>
                                                       </asp:TemplateField>
                                                       <asp:TemplateField>
                                                            <ItemTemplate>
                                                                <asp:ImageButton ID="deleteButtonItem" runat="server" CommandName="DeleteItem" ImageUrl="~/Resources/Icons/Delete16.png"
                                                OnClientClick="return confirm('Are you sure you want to delete this user?');" />
                                                            </ItemTemplate>
                                                            <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
                                                        </asp:TemplateField>
                                                        <asp:BoundField ItemStyle-width="200px" DataField="Item" HeaderText="Item No." />
                                                        <asp:BoundField ItemStyle-Width="200px" DataField="Qty" HeaderText="Quantity" />
                                                        <asp:BoundField ItemStyle-Width="200px" DataField="Description" HeaderText="Description" />
                                                        <asp:BoundField ItemStyle-Width="200px" DataField="ModelNumber" HeaderText="Model No." />
                                                        <asp:BoundField ItemStyle-Width="200px" DataField="SerialNumber" HeaderText="Serial No." />
                                                        
                                                        
                                                    </Columns>
                                                 </asp:GridView>
                                            </asp:Panel>
                                     </ItemTemplate>



This is my jquery function
 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
    $("[src*=plus]").live("click", function () {
        $(this).closest("tr").after("<tr><td></td><td colspan = '999'>" + $(this).next().html() + "</td></tr>")
        $(this).attr("ImageUrl", "images/minus.png");
    });
    $("[src*=minus]").live("click", function () {
        $(this).attr("ImageUrl", "images/plus.png");
        $(this).closest("tr").next().remove();
    });
</script>



Is This A Good Question/Topic? 0
  • +

Replies To: How to invoke Javascrip on ImageButton click.ASP.NET

#2 TheAKB   User is offline

  • D.I.C Head
  • member icon

Reputation: 2
  • View blog
  • Posts: 63
  • Joined: 11-November 08

Re: How to invoke Javascrip on ImageButton click.ASP.NET

Posted 12 February 2014 - 09:09 AM

The simplest way to do this would be to use the On Click event.

In your script tags create your jQuery function for instance
function multiply(x,y) {
     return (x * y);
}


Then in the onclick simply use the function name.

I think what your trying to do is have it purely from the JQuery, if you want to do it that way then you need to bind the id with they key press.

$('#searchText').bind('keypress', function(e) {
            if (e.keyCode == 13) {
                $('#search').click(); // Raise a click event on #search element
            }
        });


I personally think you are over complicating it for yourself.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1