Make Read-Only fields in SharePoint List Forms using Javascript

Here is the code to make SharePoint list fields read-only like below screen:

Make Read-Only fields in SharePoint List Forms using Javascript

Make Read-Only fields in SharePoint List Forms using JavaScript:

Open your list form (NewForm.aspx or EditForm.aspx) in SharePoint Designer, paste the below code after: <asp:Content id=”Content1″ runat=”Server” contentplaceholderid=”PlaceHolderMain”>

<script type="text/javascript">
_spBodyOnLoadFunctionNames.push("makeProjectIdReadOnly()");

function makeProjectIdReadOnly() {
	document.getElementById('ctl00_PlaceHolderMain_g_f64398c9_7481_4633_ada6_b227977f9884_ff1_1_ctl00_ctl00_TextField').blur();
	document.getElementById('ctl00_PlaceHolderMain_g_f64398c9_7481_4633_ada6_b227977f9884_ff1_1_ctl00_ctl00_TextField').readOnly=-1;
	document.getElementById('ctl00_PlaceHolderMain_g_f64398c9_7481_4633_ada6_b227977f9884_ff1_1_ctl00_ctl00_TextField').className="Read-Only";
}
</script>
<style type="text/css">
.Read-Only {
	BACKGROUND-COLOR: #f0f5f7
}
</style>

Salaudeen Rajack

Salaudeen Rajack - Information Technology Expert with Two-decades of hands-on experience, specializing in SharePoint, PowerShell, Microsoft 365, and related products. He has held various positions including SharePoint Architect, Administrator, Developer and consultant, has helped many organizations to implement and optimize SharePoint solutions. Known for his deep technical expertise, He's passionate about sharing the knowledge and insights to help others, through the real-world articles!

2 thoughts on “Make Read-Only fields in SharePoint List Forms using Javascript

  • I’m a noob, and i don’t see this code to paste behind
    “Paste this code after: ”

    Reply

Leave a Reply

Your email address will not be published. Required fields are marked *