Post Back and Javascript

Discussion in 'ASP .Net' started by voidinutah@gmail.com, Nov 3, 2008.

  1. Guest

    Hello,

    I'm new to .NET and was trying to find a solution for having a button
    control do a post back then execute a javascript function.

    When the button is clicked a post back occurs to save the user data,
    after that a javascript function is called to load a new video. If it
    wasn't for the video, then I would have used panel controls to hide/
    show the content. We are using swfobject to load a series of videos on
    the same page, and breaking it out into separate pages is not an
    option unfortunately.

    Thanks for any help.
    Marc
     
    , Nov 3, 2008
    #1
    1. Advertising

  2. Guest

    On Nov 3, 9:51 am, "Mark Rae [MVP]" <> wrote:
    > <> wrote in message
    >
    > news:...
    >
    > > I'm new to .NET and was trying to find a solution for having a button
    > > control do a post back then execute a javascript function.

    >
    > <head>
    >     <script type="text/javascript">
    >         function myFunction()
    >         {
    >             // code goes here
    >         }
    >     </script>
    > </head>
    > <body>
    >     <form ID="MyForm" runat="server">
    >         <asp:Button ID="MyButton" runat="server" Text="Click"
    > OnClick="MyButton_Click" />
    >     </form>
    > </body>
    >
    > protected void MyButton_Click(object sender, EventArgs e)
    > {
    >     if (IsPostBack)
    >     {
    >         // postback code goes here
    >
    >         ClientScript.RegisterStartupScript(this.GetType(), "postBack",
    > "myFunction();", true);
    >     }
    >
    > }
    >
    > --
    > Mark Rae
    > ASP.NET MVPhttp://www.markrae.net


    Thanks for your help Mark! With the code you provided, I was able to
    test a few things. The issue I was having was that the button was in
    an update panel. Since it was in an update panel, the code wasn't
    working. Once I removed the update panel it worked fine. But the issue
    I have now is that the video starts playing again since the entire
    page is posting back.

    With the multiple videos page, I can add a hidden field to handle
    which video to play.

    But on the page I've been working on, there is only one video. After
    the video plays the continue button is enabled. The user clicks the
    button, the data needs to be saved, then a modal window opens with
    some text. The video in the background needs to stay at the end
    position. But with removing the update panel, and the entire page
    posting back, the video is starting again. Any ideas for this
    scenario?

    Thanks again!
    Marc
     
    , Nov 3, 2008
    #2
    1. Advertising

  3. Guest

    On Nov 3, 12:44 pm, "Mark Rae [MVP]" <> wrote:
    > <> wrote in message
    >
    > news:...
    >
    > > Any ideas for this scenario?

    >
    > Not without seeing your code...
    >
    > --
    > Mark Rae
    > ASP.NET MVPhttp://www.markrae.net


    Here is the aspx page. There's a master page that I did not include,
    so if you need a stripped down version of the aspx, let me know.

    ----------------------------------------
    BEGIN of aspx
    ----------------------------------------
    <%@ page language="VB" masterpagefile="~/dir_user_interface/
    dir_master_page/DashboardMaster.master"
    autoeventwireup="false" codefile="default.aspx.vb"
    inherits="mod_10_20_10_070_default" %>

    <asp:Content ID="conHead" ContentPlaceHolderID="cphDashboardHead"
    Runat="Server">

    <script src="../../dir_script/swfobject.js" type="text/
    javascript"></script>
    <script type="text/javascript">

    function video_complete() {
    if ($get('<%= btnContinueButton_1.ClientID %>').className
    == "Visible") {
    btn_Continue = $get('<%= btnContinueButton_1.ClientID
    %>');
    btn_Continue.disabled = false;
    }
    }

    function endOfStepModal() {
    var theBehavior = $find("EndOfStepOpenBehavior");
    var theAnimation = theBehavior.get_OnClickBehavior();
    theAnimation.play();
    }

    </script>

    </asp:Content>
    <asp:Content ID="conModal" ContentPlaceHolderID="cphDashboardModal"
    Runat="Server">
    <asp:panel id="pnlEndOfStepController" runat="server"
    cssclass="Hidden">
    </asp:panel>
    <asp:panel id="pnlEndOfStepModal" runat="server" cssclass="Modal
    EndOfStepModal Hidden">
    <div class="MediumModal">
    <div class="ModalHeader">
    Congratulations, you have completed Step 1.
    </div>
    <div class="ModalScroll">
    Your progress has been saved to your Journal. You can
    review your journal at any time by
    selecting the "My Journal" link under the RESOURCES
    section of your profile.
    <br />
    <br />
    <h3>Would you like to stop for now, or continue to
    Step 2?</h3>
    </div>
    <%--<asp:button id="btn_logout" runat="server"
    text="Logout" />--%>
    <asp:button id="btnContinueButton_2" runat="server"
    text="Continue" />
    </div>
    </asp:panel>
    <%--path conflict open animation--%>
    <cc1:animationextender id="aeEndOfStepOpen" runat="server"
    targetcontrolid="pnlEndOfStepController"
    behaviorid="EndOfStepOpenBehavior">
    <animations>
    <OnClick>
    <Sequence>
    <StyleAction AnimationTarget="pnlBlockAll"
    Attribute="display" Value="block"/>
    <StyleAction AnimationTarget="pnlEndOfStepModal"
    Attribute="display" Value="block"/>
    <Parallel AnimationTarget="pnlEndOfStepModal"
    Duration=".2" Fps="25">
    <Resize Width="532" Height="400" />
    <Move Horizontal="114" Vertical="117" />
    </Parallel>
    </Sequence>
    </OnClick>
    </animations>
    </cc1:animationextender>
    <%--END path conflict open animation--%>
    <%--path conflict close animation--%>
    <cc1:animationextender id="aePathConflictClose" runat="server"
    targetcontrolid="btnContinueButton_2">
    <animations>
    <OnClick>
    <Sequence>
    <Parallel AnimationTarget="pnlEndOfStepModal"
    Duration=".2" Fps="25">
    <Resize Width="1" Height="1" />
    <Move Horizontal="-114" Vertical="-117" />
    </Parallel>
    <StyleAction AnimationTarget="pnlBlockAll"
    Attribute="display" Value="none"/>
    <StyleAction AnimationTarget="pnlEndOfStepModal"
    Attribute="display" Value="none"/>
    </Sequence>
    </OnClick>
    </animations>
    </cc1:animationextender>
    <%--END path conflict close animation--%>
    </asp:Content>
    <asp:Content ID="conContent"
    ContentPlaceHolderID="cphDashboardContent" Runat="Server">
    <asp:updatepanel id="udp_pageContent" runat="server">
    <contenttemplate>

    <div id="FlashContent">
    Please download the flash player.
    </div>
    <script type="text/javascript">
    var so = new SWFObject("../../dir_flash/demo1b/
    demo1b.swf", "Intro", "640", "480", "8", "#ffffff");
    so.addParam("wmode", "transparent");
    so.write("FlashContent");
    </script>

    </contenttemplate>
    </asp:updatepanel>
    </asp:Content>
    <asp:content id="ConButton" contentplaceholderid="cphDashboardButton"
    runat="Server">
    <asp:updatepanel id="upd_continue_buttons" runat="server">
    <contenttemplate>

    <asp:button id="btnContinueButton_1" runat="server"
    text="Continue" Enabled="false" CssClass="Visible" />

    </contenttemplate>
    </asp:updatepanel>
    </asp:content>
    ----------------------------------------
    END of aspx
    ----------------------------------------

    ----------------------------------------
    BEGIN of vb code behind
    ----------------------------------------
    Partial Class mod_10_20_10_070_default
    Inherits System.Web.UI.Page

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As
    System.EventArgs) Handles Me.Load

    If IsPostBack = False Then

    End If

    End Sub

    Protected Sub btnContinueButton_1_Click(ByVal sender As Object,
    ByVal e As System.EventArgs) Handles btnContinueButton_1.Click

    'might require saving user data

    'open modal
    ClientScript.RegisterStartupScript(Me.GetType(), "postBack",
    "endOfStepModal();", True)

    End Sub

    Protected Sub btnContinueButton_2_Click(ByVal sender As Object,
    ByVal e As System.EventArgs) Handles btnContinueButton_2.Click

    Response.Redirect("~/page2/")

    End Sub

    End Class
    ----------------------------------------
    END of vb code behind
    ----------------------------------------

    Any suggestions you might have are greatly appreciated.

    Thanks,
    Marc
     
    , Nov 3, 2008
    #3
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. PH
    Replies:
    1
    Views:
    12,484
    Eugene Jenihov
    Dec 16, 2003
  2. Joby
    Replies:
    0
    Views:
    1,662
  3. thomson

    JavaScript On Post Back

    thomson, May 26, 2005, in forum: ASP .Net
    Replies:
    1
    Views:
    1,396
  4. =?Utf-8?B?RGF2aWQgVGlsbWFu?=

    adding javascript after post back

    =?Utf-8?B?RGF2aWQgVGlsbWFu?=, Aug 1, 2005, in forum: ASP .Net
    Replies:
    2
    Views:
    4,124
    Eliyahu Goldin
    Aug 1, 2005
  5. =?Utf-8?B?Z29yaWxsYQ==?=
    Replies:
    1
    Views:
    818
    Masudur
    May 25, 2007
Loading...

Share This Page