Dynamic Javascript not working in Update Panel

[majidkorai]

Hi All,

I am working on an application where i have got, a content page within a Master Page. I have placed a gridview on the page. This gridview has three fields, one of them is TemplateFied, a BoundFiled and a CommandField, along with paging enabled in the gridview.

In the template field i am creating a dynamic javascript on RowDataBound.

I wanted to place this gridview in Update panel so that it doesnot re-loads when command is clicked or page is changed.

I placed a scriptmanager and an update panel, and placed the grid in it. Now my command field works only once and not more, and same is true for the javascript, it doesnt gets initilized.

Can any one help me!

[Frinavale]

How are you registering the dynamic JavaScript?

-Frinny

[majidkorai]

Actually i am displaying songs within gridview, with a music player in the templateField that needs javascript to work. I am fetching playlist out of an xml file and bind the grid to that xml. I have got a long list of songs. thats why i have enabled paging on the gridview. And there is also a buttonField "Add to play list". When i place this grid within UpdatePanel, for the first page its all fine. When i go to next page Using GridView COmman, Musc player vanishes. Surely a postback occurs and javascript doesnt execute. The same is the case when i click on buttonField.

See this here is my html for Gridview:

<asp:GridView ID="gvSongs" runat="server" AutoGenerateColumns="False" 
        HorizontalAlign="Center" onrowcommand="gvSongs_RowCommand" 
        onrowdatabound="gvSongs_RowDataBound" Width="100%" DataKeyNames="id" 
    AllowPaging="True" onpageindexchanging="gvSongs_PageIndexChanging">
           <PagerSettings Mode="NextPreviousFirstLast" />
           <Columns>
               <asp:TemplateField></asp:TemplateField>
               <asp:BoundField DataField="Title" HeaderText="Title" />
               <asp:ButtonField CommandName="Add" Text="Add to Playlist" />
           </Columns>
           <PagerStyle HorizontalAlign="Center" VerticalAlign="Middle" />
       </asp:GridView>

And Here is the RowDataBound Method, where my dynamic Javascript is being created:

 protected void gvSongs_RowDataBound(object sender, System.Web.UI.WebControls.GridViewRowEventArgs e)
        {
            if (e.Row.DataItem != null)
            {
                Song song = (Song)e.Row.DataItem;
                e.Row.Cells[0].Text = "<p id=\"" + song.Id + "\">Song could not be played</p> <script type=\"text/javascript\">AudioPlayer.embed(\"" + song.Id + "\", {soundFile: \"" + song.Src + "\", titles: \"" + song.Title + "\" });</script>";
            }
        }

I am adding javascript for audio player like dis on my Master page:

<script type="text/javascript" src="http://mydomain.com/audio-player/audio-player.js"></script>  
         <script type="text/javascript">  
             AudioPlayer.setup("http://mydomain.com/audio-player/player.swf", {  
                 width: 290  
             });  
         </script>

[Frinavale]

I'm not sure how the GridView, the play list, and the player interact with one another.

But, by the sounds of it, I think you want to place the GridView into it's own UpdatePanel so that paging through the options happens asynchronously.

You may have a problem though when you click the "add to playlist" button.
I'm not sure how you are adding the items to the play list or how the play list and the player are tied together....so my suggestion may not be feasible for you.



-Frinny

[majidkorai]

Hey frinney look at rowdatabound. Thats is how i am setting music player for invidual songs in row, then there is song title and finally add to play list button.

i have called the javascript file in my master page. as you can see and then using it in my gridview, and it work fine.

I dont have any confusion in adding songs to play list. Every thing is working fine.
But the problem occurs when i place my datagrid in UpdatePanel, that i dont want it to flicker or reload when user clicks on add to playlist or moves to next page. Now after placing it in update panel on first page load evrything comes fine. when i click on add to playlist button, or move to next page button, then javascript stops working and my music player vanishes.

Actually its a facebook application.
Here is the link, http://apps.facebook.com/musicforu/Default.aspx?

[Frinavale]

I can't check out that link right now and probably wont be able to check it out until Sunday night at the earliest.

But, you know how you're adding the script in your MasterPage?
Use the ScriptManager to register this script instead.

There are functions that let you do this dynamically or you can do it right in the ScriptManger's <scripts> section.

Essentially you want to register that script with the page every postback (asynchronous postback or not) or else this script will stop working.

[majidkorai]

great!
This worked!
I used ScriptManager to register my Javascript blocks and it really worked.

Thanks brother.