Set SharePoint form field show, hide or read-only using JavaScript

Sometimes from validation point of view we need to hide, visible or read only SharePoint List from fields.This blog will give us idea about how to do that using JavaScript.

·         Set SharePoint form field read-only:

<script type ="text/javascript">

function SetReadOnly()

{

var elements=document.getElementById('ctl00_m_g_adee8cfa_dbff_48bf_b75c_ae50351ebbf7_ff21_ctl00_ctl00_TextField');

elements.readOnly=true;

}

_spBodyOnLoadFunctionNames.push("SetReadOnly()");

</script>

·         Hide SharePoint form field:

$("# ColumnID").hide();

·         Show SharePoint form field:

$("#ColumnID").show();

Remark: Here "ColumnID" is id for that particular column specify in <tr> tag on SharePoint form  

Eg. <tr id=”ColumnID”>

Example:

·         show and hide SharePoint form field base on dropdown value change in sharepoint

<script type="text/javascript">

_spBodyOnLoadFunctionNames.push("ourFunctionName");

function ourFunctionName()

{

$("Select[Title='Type']").change(function () {

var val=$("Select[Title='Type']").val();

if(val=="Pre")

{

$("#Post").hide();

$("#Pre").show();

}

else if(val=="Post")

{

$("#Post").show();

$("#Pre").hide();

}

});

}

</script>