Setting Value of Label Client Side

Question

I have a web page that has a Folder Picker pop up. It allows the user the select a folder on the website, and then track changes to its contents.

I need to pass the value from the pop-up, which is returned to me in JavaScript, and pass that to a server side method.

AJAX is not available for this, as I'm working with SharePoint.

I get the data I need from a callback in JavaScript, but if I try to set $(control).text(), this doesn't work.

Can I set the value of a label (rendered as a span) somehow and pass that back onClick?

Current working Code:

$('.tile').on("click", ".LibraryPickerInitiator", function () {
    var hiddenField = $(this).siblings('[type=hidden]');
    var callback = $.proxy(function (s) { this.val(s); }, hiddenField);
    LaunchPickerTreeDialog('CbqPickerSelectListTitle', 'CbqPickerSelectListText', 'websLists', '', '/', '', '', '', '/_layouts/images/smt_icon.gif', '', callback, '', '');
});

Markup:

<div id="WebSettings" class="WebSettings" runat="server">
    <div class="LibraryPickerInitiator">Pick a Library</div>
    <asp:HiddenField ID="HiddenField1" runat="server" />
    <asp:Label ID="TreePickerLabel" CssClass="PickerPlaceHolder" runat="server" Text="No List Selected"></asp:Label>
    <asp:Button ID="SubmitList" runat="server" Text="Get List Data" onclick="SubmitList_Click" />
</div>

Event:

protected void SubmitList_Click(object sender, EventArgs e)
{
    string pickerData = HiddenField1.Value;
}

Answer 1

I see no reason you cannot, I would use $.proxy when creating the callback to ensure a proper scope:

var callback = $.proxy(function (s) {
    this.html(s); 
}, sisterLabel);

If you add a hidden input to the markup you could change you client code something like this:

var sibs = $(this).siblings();

var callback = $.proxy(function (s) {
    this.label.html(s); // set label text
    this.hidden.val(s); // set hidden field val
}, { label: sibs.filter('span'), hidden: sibs.filter(':input:hidden') });