Dynamically update a html element value based on h1

Question

Right, I have a problem which I am struggling to get my head around.

On an aspx master page (procedure.master.aspx) I have the following element:

<Tags>
    <wbc:Tag Value="234"></wbc:Tag>
</Tags>

what I want to be able to do is change the VALUE of this depending on the page content (procedures.aspx which calls the master) ie if H1 contains "FOO" then Tag Value="BAR" etc.

The TAG value is sent to a stored procedure returning XML based on the content of the page.

Not a javascript GURU so open to any suggestions with Javascript (not JQuery) or VB.net.

Answer 1

If you would not mind doing this on the server, use the code below. It worked for me:

In your HTML add the following:

   <h1 runat="server" id="header1">Foo</h1>
    <div runat="server" id="tag1"></div>

and in the code behind page load:

        If header1.InnerText = "Foo" Then
            tag1.InnerText = "BAR"
        Else
            tag1.InnerText = ""
        End If

or (for the sake of clarity)

In your HTML add the following:

   <h1 runat="server" id="header1">Foo</h1>
   <Tags>
       <wbc:Tag Value="234" runat="server" id="tag1"></wbc:Tag>
   </Tags>

and in the code behind page load:

        If header1.InnerText = "Foo" Then
            tag1.Value= "BAR"
        Else
            tag1.Value= ""
        End If

Answer 2

The following snippet should work if you have jQuery. This code also assumes you give your wbc:Tag element an id, in this case "myElement".

$(document).ready(function(){
    var text = $("h1#elementName").text();
    if (text == "FOO");
        $("#myElement").attr("Value", "BAR");
});

As you can see, this will read the content of the H1 element on load. Is that what you wanted? Or can the content of the element be changed dynamically?