使用JavaScript在不使用PostBack（）的情况下从User Control（ascx）设置父页面（aspx）标签文本

Question

I have a requirements to Change ASPX labelText in a User Control (ASCX) Using JavaScript and without postback or partial postback (Update Panel).

Please suggest how to implement this ? Thanks

//EDIT

ASCX markup

<script type="text/javascript" charset="UTF-8">
    function Show(text) {
        Popup.innerHTML = text;
        x = event.clientX + document.body.scrollLeft + 50;
        y = event.clientY + document.body.scrollTop + 20;
        Popup.style.display = "block";
        Popup.style.left = x - Popup.scrollWidth + "px";
        Popup.style.top = y + "px";
    }

    function Hide() {
        Popup.style.display = "none";
    }
</script>

<script type="text/javascript">
    function SaveTargetSign(id) {
        // Here i want to Access Parent Page Label and Set value.
    }
</script>

<table id="table1" width="970px" runat="server" cellpadding="0" cellspacing="0" style="border: solid 1px #D2B48C;">
    <tr>
        <td>
            <table id="tableSignature" width="975px" runat="server" cellpadding="0" cellspacing="0" style="border: solid 0px #D2B48C; background-color: ">
                <tr id="rowStatic" runat="server">
                    <td id="TD1" valign="top" style="width: 165px; border-bottom: solid 1px #D2B48C">
                        <div>
                            <div class="gridview">
                                <div class="outerSVSParent">
                                    <div class="scroll">
                                        <table class="gridtable" cellspacing="0" rules="all" border="1" style="width: 100%;
                                                border-collapse: collapse;">
                                            <tr class="header" style="height: 20px;">
                                                <td scope="col" id="lblDiv" runat="server">
                                                    <asp:Label ID="lblParentTitle" runat="server" Text="Title"></asp:Label>
                                                </td>
                                            </tr>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div style="text-align: center">

                            <table>
                                <tr>
                                    <td>
                                        <asp:Label ID="lblSignId1" runat="server" Text=""></asp:Label>
                                    </td>
                                    <td>
                                        <uc1:ImageControl id="imageCtrl" runat="server" ShowActionButton="False" Height="80px" Width="100px" />
                                    </td>
                                </tr>
                                <tr></tr>
                            </table>

                        </div>
                        <%--                        <div>
                                <asp:Panel ID="pnlTargetSign" runat="server" Height="16px" HorizontalAlign="Center">
                                    <asp:CheckBox ID="cbTargetSign" runat="server" Text="Target Sign" TextAlign="Right" BackColor="White" ForeColor="#333333" BorderColor="#0066FF" BorderStyle="None" />
                                </asp:Panel>
                            </div>--%>

                    </td>
                    <td valign="top" style="border-bottom: solid 1px #D2B48C;">
                        <div style="height: 116px; overflow: scroll; padding-right: 20px;" id="tblDiv" runat="server">
                            <%--  <unisign:unisigngridview id="GridviewChild" autopostback="false" isnestedsvsgridview="True" pagesize="2" allowpaging="true" --%>
                                <UniSign:UniSignGridView ID="GridviewChild" AutoPostback="false" IsNestedSVSGridView="True" Width="805px" AllowSorting="true" runat="server">
                                </UniSign:UniSignGridView>
                        </div>

                    </td>
                </tr>
            </table>
            <%--  <unisign:unisigngridview id="GridviewChild" autopostback="false" isnestedsvsgridview="True" pagesize="2" allowpaging="true" --%>
                <div id="Popup" class="transparent" style="z-index: 200; width: auto; height: auto">
                </div>

                <asp:HiddenField ID="HFSVCurrentSelectedindex" Value="-1" runat="server" />
                <asp:HiddenField ID="HFTargetSign" Value="0" runat="server" />
        </td>
    </tr>
</table>

Server Side code to Trigger JavaScript

  Dim scriptStatic = String.Format("javascript:return SaveTargetSign('{0}');", ststicId)
  rowStatic.Attributes.Add("onclick", scriptStatic)

Parent Page Label Markup

<asp:Label ID="lblTSV" runat="server" BackColor="#F4F4F4" Font-Bold="True" Font-Names="Arial" Font-Size="Small" ForeColor="#666666"></asp:Label>

Answer 1

To give you a example how to talk clientside to any control you can use

document.getElementById('<%=Label.ClientID%>').innerHTML = "Tekst";

The controls gets a different name on clientside thats why you need to use the document.getElementById .

To achieve what you want you can use the below call to javascript from serverside. Use instead of Page.User.Identity.Name the text you want to display

Page.ClientScript.RegisterStartupScript(GetType(), "changeLabelText", string.Format("changeLabelText('{0}');", Page.User.Identity.Name), true);

Which will execute the called script changeLabelText(labelText) on clientside and pass the identity name in this case.

function changeLabelText(labelText){
   document.getElementById('<%=LBLProjectsHeader.ClientID%>').innerHTML = labelText;
}

Hope the example gives you a idea of what you can do if you wanna straight on load of your page change the text on the label.

Edit some controls can be accessed with .value instead of .innerHTML