CODEWITHSUNDEEP
c#javascriptasp.netupdatepanel
Tapas Bose
Tapas Bose

Reputation: 29806

ASP:UpdatePanel - Add JavaScript on Button Click

I have a asp:UpdatePanel with a asp:Button and a asp:TextBox:

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
        <asp:Button runat="server" Text="Click" ID="button" onclick="button_Click"/>
        <asp:TextBox runat="server" Title="Text" ID="text" Style="margin-top: 50px;" />
    </ContentTemplate>
</asp:UpdatePanel>

And the button_Click method is:

protected void button_Click(object sender, EventArgs e) {
    text.Attributes.Add("title", "Box");
    ClientScript.RegisterClientScriptBlock(typeof(ScriptManager), "Tooltify", "tooltipfy();", true);
}

tooltify() is a javascript function.

var tooltipfy = function () {
    alert('');
    $('[title]').qtip({
        style: {
            tip: {
                corner: true,
                width: 10,
                height: 5
            },
            classes: 'ui-tooltip-rounded ui-tooltip-shadow ui-tooltip-tipsy'
        },
        position: {
            my: 'bottom left',
            at: 'top right',
            adjust: {
                x: -10,
                y: 0
            }
        },
        events: {
            show: function (event, api) {
                $('.ui-tooltip-content').addClass('ui-tooltip-center');
            }
        },
        show: {
            effect: function (offset) {
                $(this).show("slide", { direction: "up" }, 500);
            }
        },
        hide: {
            effect: function (offset) {
                $(this).hide("explode", 500);
            }
        }
    });
}

The problem is the function is not executing.

How can I call JavaScript function while using asp:UpdatePanel?

Upvotes: 2

Views: 7053

Answers (3)

Koby Douek
Koby Douek

Reputation: 16675

using ClientScript.RegisterClientScriptBlock is not good practice. If your Javascript function (tooltipfy) should update some controls, you should place these controls under your asp:UpdatePanel and update them in your code behind like this:

someDiv.Style.Add("display", "inline");
someDiv.InnerHtml = Text;
otherControl.Style.Add("display", "block");

Upvotes: 0

Raymond Morphy
Raymond Morphy

Reputation: 2526

You should use ScriptManger when using UpdatePanel.

protected void button_Click(object sender, EventArgs e) {

    ScriptManager.RegisterClientScriptBlock(this, this.GetType(),"Tooltify", "tooltipfy();", true);
}

Upvotes: 4

Koen
Koen

Reputation: 2571

I'm not in the possibility to test it now, but according to this blog you should get it to work with ScriptManager.RegisterStartupScript.

Upvotes: 2

Related Questions