Resolved Updating a Div using c#

Molari51

Member
Joined
Jan 20, 2021
Messages
10
Programming Experience
3-5
Many thanks for all your help with the previous thread with XML and Virtual Folders in IIS

2 Questions if I may

1. I have the following inside my DotNet Webform - HTML
HTML:
        <div id="MediaPlayer">
            <table>
                <tr>        
            <td><img alt="spacer" src="graphics/spacer.gif" style="width: 30px; height: 5px" /></td>
            <td class="vtop"><div id="MyTest" runat="server" class="player" data-wimpyPlayer data-skin="wimpy_7.81/wimpy.skins/cool-eq-Robs.tsv" data-startUpText="Welcome" data-media="MusicFavourites/SimpleMinds.xml"></div>       </td>
        </tr>
    </table>
using C# I'm trying to amend the part - /SimpleMinds.xml" to /All.xml"

Have written the following to retrieve the Div into a textbox as a test
C#:
        System.IO.StringWriter sw = new System.IO.StringWriter();
        System.Web.UI.HtmlTextWriter h = new System.Web.UI.HtmlTextWriter(sw);
        MyTest.RenderControl(h);
        txtMsg.Text = sw.GetStringBuilder().ToString();
Is there a way to update the HTML Div statement above using C#

2. An additional anomaly. I've had to put the code above outside the UpdatePanel because when I refresh an element on the page the player disappears altogether, Is there a way to reload the player without executing all the other code

Many thanks for your help
 
Last edited by a moderator:
Solution
Cracked it
MyTest.Attributes.Add("data-media", "MusicFavourites/" + ddlFavFolders.SelectedItem.Text);

I even got my MP3 player within the UpdatePanels
Presumably you are asking about WebForms and not Blazor. In WebForms, you cannot update a <div> because the C# code is running on the server, but the <div> is being displayed on the web browser running on the client. The only way to do the update, is to send new data to the client. That's basically what the UpdatePanel does, it keeps on getting new data from the server to present on the client.

Anyway, stepping away from that meta question about page lifetimes and getting into the weeds with your specific question, is that <div> in your OP hardcoded? Shouldn't you be using something like:
C#:
<div id="MyTest"
     runat="server"
     class="player"
     data-wimpyPlayer data-skin="wimpy_7.81/wimpy.skins/cool-eq-Robs.tsv"
     data-startUpText="Welcome"
     data-media="<%= MyPlaylistVariable %>">
</div>
where MyPlaylistVariable contains the string that you want to send to the client.
 
Presumably you are asking about WebForms and not Blazor. In WebForms, you cannot update a <div> because the C# code is running on the server, but the <div> is being displayed on the web browser running on the client. The only way to do the update, is to send new data to the client. That's basically what the UpdatePanel does, it keeps on getting new data from the server to present on the client.

Anyway, stepping away from that meta question about page lifetimes and getting into the weeds with your specific question, is that <div> in your OP hardcoded? Shouldn't you be using something like:
C#:
<div id="MyTest"
     runat="server"
     class="player"
     data-wimpyPlayer data-skin="wimpy_7.81/wimpy.skins/cool-eq-Robs.tsv"
     data-startUpText="Welcome"
     data-media="<%= MyPlaylistVariable %>">
</div>
where MyPlaylistVariable contains the string that you want to send to the client.
Evening
It is a webform, how would I pass the string MyPlaylistVariable to the client

Many thanks[/icode]
 
Last edited by a moderator:
Whatever the value of the variable is will be returned to the client when they next get the page from the server.

The more interesting question is how do you get the client to automatically request the page, or part of the page. For part of the page you use the UpdatePanel, but it seems like you've limited your usage of that.
 
Whatever the value of the variable is will be returned to the client when they next get the page from the server.

The more interesting question is how do you get the client to automatically request the page, or part of the page. For part of the page you use the UpdatePanel, but it seems like you've limited your usage of that.
The steps are as follows

1. When the page loads it automatically retrieves all available mp3's in a gridview
2. You select the favourite folder from the dropdown to assign your tracks to, these are retrieved from the database
3. In the gridview from step 1 you select the appropriate track and press the button in the desired grid row, this saves the path to the SQL Server database
4. Pressing the button View and Write XML - This loads the tracks contained within the favourites list at step 3 refreshing the gridview, it then iterates through the grid building the xml format

I was then hoping to have another ASP button so that when pressed it would take the TEXT value of the favouritse dropdown and use that as the value for MyPlaylistVariable, the page would refresh loading the new xml value into the variable

The other issue I have (as you have outlined above) is that all the HTML code is contained within an UpdatePanel, it all works perfectly. The Player as outlined at the top of this post is contained outside the UpdatePanel, it's a freeware player, when the player is put inside the UpdatePanel, when an ASP event executes the player disappears, when I refresh the page it re-appears but all ASP elements are reset

Hope the above helps
 
I'm sorry. I've pretty much abandoned WebForms like the way I have abandoned Entity Framework. When I used to work with WebForms, it was clunky as hell trying to make a desktop programming paradigm fit into the web client-server paradigm. Hopefully someone more invested in WebForms can help. All I can tell you at this point is that it looks like you skipped a few steps in your journey to learn WebForms and now you seem to be missing some fundamentals like how to render a page with a variable in it, or like how the ASP.NET page lifetime works.
 
After trawling the net and reading a few books came up with the following

Thought I'd have a go at jQuery, this is my first attempt, have written the following,

<script>
function ChangePlaylist ()
{
var selected= "MusicFavourites/" + $(ddlFavFolders).val();
$("#MyTest").attr("data-media",selected)
};
</script>

From an ASP Button added the following C# code after my call to save the xml file
ScriptManager.RegisterStartupScript(this.Page, this.GetType(), "script", "ChangePlaylist();", true);
 
Cracked it
MyTest.Attributes.Add("data-media", "MusicFavourites/" + ddlFavFolders.SelectedItem.Text);

I even got my MP3 player within the UpdatePanels
 
Solution
Back
Top Bottom