How to pass values from SP UI Modal Dialog back to the server side code upon button click event

Question

I have a click event on a button that opens a sp ui modal dialog page. and returns a specific value from a text area on that page. I was able to open the page in the modal dialog and able to return the values from the text area back to the parent page, but my issue is I was not able to pass these values back to the code behind. I tried to use the hidden field. It seems to be working but the problem is upon first click event of the button, the values are not returned and when I tried to debug it, the whole event is being executed first so the values are always empty on first click.

Is there another way that I can pass the values back to the code behind?

Here is the code behind of the button:

 protected void btn_Click(object sender, EventArgs e)
    {
        //popup modal window for comment is loaded.
        ClientScriptManager cs = Page.ClientScript;
        StringBuilder scriptToExecute = new StringBuilder();
          scriptToExecute.Append("ExecuteOrDelayUntilScriptLoaded(OpenCommentForm,'sp.js');");
        cs.RegisterStartupScript(this.GetType(), "PopUpCommentScript", scriptToExecute.ToString(), true);

        string hiddenField1Val = HiddenField1.Value.ToString();
        string hiddenField2Val = HiddenField2.Value.ToString();

    }

Here is the js:

function OpenCommentForm() {
var dialogOptions = SP.UI.$create_DialogOptions();
dialogOptions.url = "/_layouts/commentform.aspx"; // URL of the Page
dialogOptions.width = 600; // Width of the Dialog
dialogOptions.height = 400; // Height of the Dialog
dialogOptions.title = "Comment Form";
dialogOptions.args = null;
dialogOptions.allowMaximize = false;
dialogOptions.dialogReturnValueCallback = Function.createDelegate(null, CloseCallback); // Function to capture dialog closed event
SP.UI.ModalDialog.showModalDialog(dialogOptions); // Open the Dialog
}


function CloseCallback(strReturnValue, comment) {

    if (strReturnValue == 1) // Perform action on Ok.
    {

        var hiddenResult =   $("[id$='ctl00_PlaceHolderMain_HiddenField1']").val(strReturnValue);
        var hiddenComment = $("[id$='ctl00_PlaceHolderMain_HiddenField2']").val(comment);

     }
}

Thank you very much for the help in advance.

Answer 1

If you really need to send the result of the modal dialog to the server side code of the calling page then you can use Client-Callback see Client-Callback Implementation (C#) Example and put the javascript call of the server callback in the CloseCallback.

There is no need for your server side btn_Click as this happens when the button is clicked and should just call OpenCommentForm client side.

Answer 2

I was able to achieved this using a different way, and it works fine so far. I know its not the best way but it works fine with me.

I updated the server button click event, and removed the attachment of the script and replaced it with OnClientClick event that calls the JS function that calls the modal window.

ASP button definition in aspx:

<asp:Button runat="server" ID="btnPrevStatus" Text="Previous Status" Height="40px" Font-Name="Arial,Verdana,sans-serif"  />

Instantiate OnClientClick event on page load code behind:

string previousBtn = "javascript:return OpenCommentForm('{0}');";
            btnPrevStatus.OnClientClick = string.Format(previousBtn, hiddenPreviousButton.ClientID);

I created another link button, which is hidden and there I set the server OnClick server event. This link button is triggered in the callback function, refer to the line EVAL.

APS Link Button Definition in aspx:

<asp:LinkButton runat="server" ID="hiddenPreviousButton" Text="Previous Status"  Height="40px" style="display:none;" Font-Name="Arial,Verdana,sans-serif" OnClick="btnPrevStatus_Click" />

JS:

function CloseCallback(strReturnValue, comment) {

if (strReturnValue == 1) // Perform action on Ok.
{
    var hiddenResult = $("[id$='ctl00_PlaceHolderMain_HiddenField1']");
    var hiddenComment = $("[id$='ctl00_PlaceHolderMain_HiddenField2']");


    if (hiddenResult != null) {
        hiddenResult.value = comment;
        hiddenComment.value = $("[id$='ctl00_PlaceHolderMain_HiddenField2']");
        $("[id$='ctl00_PlaceHolderMain_HiddenField1']").val(strReturnValue)
        $("[id$='ctl00_PlaceHolderMain_HiddenField1']").val(strReturnValue)
    }
    //execute the btn click server event
    var controlToRefresh = "[id$='" + globalID + "']";

    eval($(controlToRefresh).attr("href"));
}
}