0

I'm trying to set a field in a list's edit form with a value after the user clicks "Save." Here's the catch: I don't want the field to be editable by the user (only JavaScript should set its value).

So first, I tried setting the field's "readonly" attribute. Didn't work - after saving the form, I find out that the value didn't take. So I think, "maybe SharePoint ignores saving read-only fields." Instead, I add styling to set its "display" to "none." I find out that this gives the same result as above.

I also tried adding a span, setting its positioning to "absolute", and giving it a solid background color, and increasing the z index so that it would cover up the field. No luck - still didn't save the value when I clicked "Save."

I even tried overriding the "PreSaveAction" function to make the field visible afterwards, but that didn't work either.

Unfortunately, it seems the only way for this to work is to allow the field to be completely visible and completely editable by the user, for the entire lifespan of the page, because when I tried that, it worked fine.

Is there something I'm missing?


EDIT: I forgot to mention that this list has a 2010 workflow that runs when an item is edited.

3
  • You can use hidden field and save the data using workflow or you can use calculated column to achieve the same...What will be saved in your hidden field? Is there any business logic behind that? Jun 3, 2019 at 14:00
  • @Ganesh I'm getting the value from a separate list, in a different site. Normally I would use a workflow, but by the time the workflow fires, the hidden field is empty (because saving the list item didn't save the field's value).
    – Clark
    Jun 3, 2019 at 14:08
  • I always use .attr('disabled', 'disabled'). It works for me. Jun 4, 2019 at 7:20

2 Answers 2

0

It seems you are doing something wrong, below works perfectly with pure javascript. Tried just now.

First I tried with Google chrome developer console, after page is loaded, ran below 2

document.getElementById("ReadOnlyField_30c913e4-d726-4ce2-996a-626d8ff43e24_$TextField").disabled = "disabled";
document.getElementById("ReadOnlyField_30c913e4-d726-4ce2-996a-626d8ff43e24_$TextField").value = "[email protected]"

Clicked on Save, went again to list view and i can see my value updated.

enter image description here

Now to make it dynamic, added script editor webpart on New form, kept the zone index of webpart to 2 so that it is displayed below form webpart

<script type="text/javascript">

document.addEventListener('DOMContentLoaded', fn, false);

function fn(){
document.getElementById("ReadOnlyField_30c913e4-d726-4ce2-996a-626d8ff43e24_$TextField").disabled = "disabled";
document.getElementById("ReadOnlyField_30c913e4-d726-4ce2-996a-626d8ff43e24_$TextField").value = "[email protected]"
}

</script>

Loaded the form again, below is screenshot of form

enter image description here

Click save and go back to list view... it has saved readonly field.

enter image description here

0

You can turn off Read-only while editing the filed and set it back to read only after editing.

The demo for your reference:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript">

$(document).ready(function()
{
//Set the Field to Read only and change its background colour
$("input[title='Column1']").attr("readonly","true").css('background-color','#F6F6F6');
//You can disable the field also:  $("input[Title='Metrics ID']").attr("disabled", "disabled");
});

 function PreSaveAction()
{
  $("input[title='Column1']").attr("readonly","false");
  $("input[title='Column1']").val('new value');
  $("input[title='Column1']").attr("readonly","true");
  return true;

}

</script>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.