CODEWITHSUNDEEP
jqueryasp.netvb.netvb.net-2010
User7291
User7291

Reputation: 1115

unable to open jquery dialog on a linkbutton click

note that i'm using asp.net with vb.net

jquery:

$("#create")
.button().click(function () {
$("#dialog-form").dialog("open");
});

$("#LinkButton3").click(function () {
        $("#dialog-form").dialog("open");
        return false;
    });

asp:

<asp:TemplateField HeaderText="Edit">
    <ItemTemplate> 
        <asp:LinkButton ID="LinkButton3" runat="server">LinkButton</asp:LinkButton>
    <a href="#" class="table-actions-button ic-table-edit" id="create"></a>
     </ItemTemplate> 
</asp:TemplateField>

the dialog opens for the a tag but does not open for the linkbutton can anyone tell me why my code is not working?

Upvotes: 1

Views: 1228

Answers (5)

sangram parmar
sangram parmar

Reputation: 8726

Replace you link button with this

<asp:LinkButton ClientIDMode="Static" ID="LinkButton3" runat="server">LinkButton</asp:LinkButton>

see this:

ClientIDMode="Static"

Upvotes: 0

nrsharma
nrsharma

Reputation: 2562

LinkButton is server side asp.net controls which causes postback. Another point is you are not using the correct id of the control it's changed. Try with $('#<%=LinkButton3.ClientID%>').

Upvotes: 0

SarathSprakash
SarathSprakash

Reputation: 4624

Try this

Add UseSubmitBehavior="false" to your asp link button

your html

<asp:TemplateField HeaderText="Edit">
    <ItemTemplate> 
        <asp:LinkButton ID="LinkButton3" runat="server" UseSubmitBehavior="false">LinkButton</asp:LinkButton>
    <a href="#" class="table-actions-button ic-table-edit" id="create"></a>
     </ItemTemplate> 
</asp:TemplateField>

Upvotes: 0

4b0
4b0

Reputation: 22323

Use ClientID to get server control in jquery like this.

  var create= "#<%=create.ClientID%>";
    $(create).on('click', function() { 
      $("#dialog-form").dialog("open");
    });

Don't forget to include js file and js code inside document.ready .

Upvotes: 0

Adil
Adil

Reputation: 148110

The id of linkbutton on client side would be different so use the ClientID to bind the event. Also put binding code indocument.ready. Assign a class to linkbutton and use class selector to bind event.

Html

<asp:TemplateField HeaderText="Edit">
    <ItemTemplate> 
        <asp:LinkButton ID="LinkButton3" runat="server" class="someclass">LinkButton</asp:LinkButton>    <a href="#" class="table-actions-button ic-table-edit" id="create"></a>
     </ItemTemplate> 
</asp:TemplateField>

Javascript

$('.someclass').click(function () {
    $("#dialog-form").dialog("open");
    return false;
});

If you need to use id for select then use attribute selector with starts with wild card.

$('[id=^LinkButton3]').click(function () {
    $("#dialog-form").dialog("open");
    return false;
});

Upvotes: 1

Related Questions