Question

I can get both the Javascript and the C# function to work just fine.

However, my Javascript function runs before the C#.

How do I get it to run after the C# function??

Here is my code:

<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:MultiView ID="MultiView1" runat="server" ActiveViewIndex="0">
<asp:View ID="View1" runat="server">
<div id="div2" style="height:70px; width:auto; text-align:center;">
<p><b>This is A View!!!</b></p>
  <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</div>

<div id="div1">
    <asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" 
        OnClientClick="javascript:Highlit()" />
</div>
</asp:View>
</asp:MultiView>

<script type="text/javascript">

function Highlit() 
{
 $("#div2").effect("highlight", {}, 10000);
}
</script>

 </ContentTemplate>
 </asp:UpdatePanel>

Code behind:

namespace jQuery_Highlight.jQuery_Highlight
{
public partial class jQuery_HighlightUserControl : UserControl
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }

    protected void Button1_Click(object sender, EventArgs e)
    {
        Label1.Text = "Changed";
    }
   }
}

Here is the code reflecting changes from the answers:

Code behind

namespace jQuery_Highlight.jQuery_Highlight
{
public partial class jQuery_HighlightUserControl : UserControl
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }

    protected void Button1_Click(object sender, EventArgs e)
    {
        Label1.Text = "Changed";
        ScriptManager.RegisterStartupScript(this, this.GetType(), "TEST", "Highlit();", true);
    }
   }
   }




 <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

 <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
 <ContentTemplate>
 <asp:MultiView ID="MultiView1" runat="server" ActiveViewIndex="0">
 <asp:View ID="View1" runat="server">
 <div id="div2" style="height:70px; width:auto; text-align:center;">
 <p><b>This is A View!!!</b></p>
 <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
 </div>

 <div id="div1">
  <asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
 </div>
 </asp:View>
 </asp:MultiView>

 </ContentTemplate>
 </asp:UpdatePanel>

<script type="text/javascript">

function Highlit() {
    $("#div2").effect("highlight", { color: "#9499FC" }, 10000);
}
</script>

Answer 1

The only way to get the javascript to run after is to add a script reference in your Button1_Click event.

Example Code for standard postback:

protected void Button1_Click(object sender, EventArgs e)
{
    Label1.Text = "Changed";
    Page.ClientScript.RegisterStartupScript(this.GetType(), "PostButton1_ClickScript", "Highlit();", true);
}

As noted by others, be sure to remove your OnClientClick event. Also, consider moving your “Highlit” script outside of the update panel.

Additionally, since you are in an update panel, you will need to use the following example code for a Partial Postback:

protected void Button1_Click(object sender, EventArgs e)
{
    Label1.Text = "Changed";
    ScriptManager.RegisterStartupScript(this, this.GetType(), "PostButton1_ClickScript", "Highlit();", true);
}