Save Javascript Value Using C# Async Postback

Question

I have an Asp TextBox called txt_edit_content whose value is being copyed and manipulated using a JavaScript Wysiwyg. The formatted text is stored in a JavaScript variable that I can access like so:

var data = CKEDITOR.instances.<%=txt_edit_content.ClientID%>.getData();

What I'm attempting to do is send that value back to the server. So, I have registered the following JavaScript function with the Sys.WebForms.PageRequestManager

function BeginRequestHandler(sender, args) {
    try{
        var data = CKEDITOR.instances.<%=txt_edit_content.ClientID%>.getData();
        console.log("Textbox Before: " + $('#<%=txt_edit_content.ClientID%>').val());
        console.log("    Javascript: " + data);
        $('#<%=txt_edit_content.ClientID%>').val(data);
        console.log(" Textbox After: " + $('#<%=txt_edit_content.ClientID%>').val());
    } catch (err) {
        console.log("Error:" + err.message);
    }
}

And registering it like so:

var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_beginRequest(BeginRequestHandler);

The JavaScript console output before the POST is made looks like so:

Textbox Before: 1234 
    Javascript: <p>1234567</p> 
 Textbox After: <p>1234567</p>

The issue I'm running into is that the value, even though it is being changed on page, isn't being sent to the server. However the 'Textbox Before' value is being sent. How can I get the value out of my JavaScript and into my code?

Edit: I can get this code to work using a PostBackTrigger but not AsyncPostBackTrigger on the 'Save' button. However, I need (would like) to use the AsyncPostBackTrigger on the 'Save' button.

The Sharp Ninja · Accepted Answer · 2015-12-07 23:17:18Z

1

Use an update panel and wrap a Hidden field in it. Then in your handler, set the value of the hidden field.

function BeginRequestHandler(sender, args) {
    try{
        var data = CKEDITOR.instances.<%=txt_edit_content.ClientID%>.getData();
        console.log("Textbox Before: " + $('#<%=txt_edit_content.ClientID%>').val());
        console.log("    Javascript: " + data);
        $('#<%=txt_edit_content.ClientID%>').val(data);
        console.log(" Textbox After: " + $('#<%=txt_edit_content.ClientID%>').val());
        $('#<%=hidValue.ClientID%>').val(data);

    } catch (err) {
        console.log("Error:" + err.message);
    }
}

Now in your code behind you can get the value of hidValue.

answered Dec 7, 2015 at 23:17

The Sharp Ninja

1,0519 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Chris Stillwell Over a year ago

Actually, this doesn't work, it has the same issue as before.

The Sharp Ninja Over a year ago

Are you saying that hidValue has the same value as the old text box value?

Chris Stillwell Over a year ago

The value doesn't get sent to the server. If I have<asp:HiddenField ID="hidValue" runat="server" /> and use the JavaScript $('#<%=hidValue.ClientID%>').val(data); the value sent to the server is blank. It is as if the page is tracking values separately.

Chris Stillwell Over a year ago

However this will work on if the 'Save' button is on a PostBackTrigger instead of an AsyncPostBackTrigger

Chris Stillwell · Accepted Answer · 2015-12-08 19:37:32Z

0

I was able to get it to work without using another field or having to add a handler to the PageRequestManager

By creating the following JavaScript function

function SaveWysiwig() {
    try{
        var data = CKEDITOR.instances.<%=txt_edit_content.ClientID%>.getData();
        $('#<%=txt_edit_content.ClientID%>').val(data);
    } catch (err) {
        console.log("Error:" + err.message);
    }
}

Then calling it through my save button like so:

<asp:LinkButton ID="savePage" runat="server" Text="Save" OnClientClick="SaveWysiwig();" OnClick="SavePage" />

I was able to get the JavaScript value stored in my textbox then pulled with my code-behind.

answered Dec 8, 2015 at 19:37

Chris Stillwell

10.6k10 gold badges74 silver badges82 bronze badges

Collectives™ on Stack Overflow

Save Javascript Value Using C# Async Postback

2 Answers 2

4 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related