Save Modal Dialog Field Value to Refresh Page DIV

SharePoint Asked by AurumPotabile on December 22, 2020

I found a couple great functions that allow me to programmatically call up a modal edit form, and they work very well. What I’m looking for is a way to update a div on the calling page with the contents of the modal form’s UserNote field once I click the Submit button.

function displayProgInfo(progId) {
  var options = SP.UI.$create_DialogOptions();
  options.resizable = 1;
  options.scroll = 1;
  options.title = "Update Program Information";
  options.url = "/address/_layouts/listform.aspx?PageType=6&ListId={[ListID]}&ID=" + progId;
  options.dialogReturnValueCallback = Function.createDelegate(null, CloseCallback);

function CloseCallback(result, target) {
  if (result != 0) {
    window.parent.location.href = window.location.href;
    // Replace the note after clicking save in the modal dialog
    htmlBuilder = "<div id='noteField'>" + [contents of UserNote field] + "</div>";

The hangup right now is how to capture and save the contents of the UserNote field before the form closes. The articles and questions I’ve found so far don’t offer me much that I understand; can anyone provide an answer that helps in this situation?

One Answer

On your edit form, you need to add the onclick handler for your Submit button and pass UserNote field's value as an argument.


var userNoteFieldValue =  encodeURIComponent(document.getElementById(userNoteFieldId).value);
<input type="button" value="Submit" class="button" href="javascript:void(0);" onclick="SP.UI.ModalDialog.commonModalDialogClose(SP.UI.DialogResult.OK, {userNoteFieldArg: '" + userNoteFieldValue + "'});" />    

then on CloseCallback function, you can access the passed in argument(s).

CloseCallback = function(result, args) {
        if (result == SP.UI.DialogResult.OK) {
            document.getElementById("noteField").innerHTML = " " + decodeURIComponent(args.userNoteFieldArg);
        if (result == SP.UI.DialogResult.cancel) {
            // Run Cancel Code

Alternate method:

function CloseCallback(result, args) {
    if (result == SP.UI.DialogResult.OK) {
        getListItemById(progId, 'YourListName')
    if (result == SP.UI.DialogResult.cancel) {
        // Run Cancel Code

function getListItemById(progId, listName) {
    var context = new SP.ClientContext.get_current();
    //var context = new SP.ClientContext('/siteUrlHere');
    var web = context.get_web();
    var list = web.get_lists().getByTitle(listName);
    var item = list.getItemById(progId);
    context.load(item, 'myUserNoteField');
        function () {
            var userNoteField = item.get_item('myUserNoteField');

        }, function (sender, args) {
            alert('Request failed. ' + args.get_message() + 'n' + args.get_stackTrace());

Answered by Aveenav on December 22, 2020

Add your own answers!

Related Questions

Add QuickLinks Webpart by using pnp powershell

1  Asked on October 26, 2021 by abdelkader_ak


Reading configuration at runtime

1  Asked on October 25, 2021 by milind


what went wrong with my sharepoint server deployment?

0  Asked on October 25, 2021 by sharepointadmin


Ask a Question

Get help from others!

© 2022 All rights reserved. Sites we Love: PCI Database, MenuIva, UKBizDB, Menu Kuliner, Sharing RPP