Sharepoint: nascondere campi nei form tramite javascript
Pubblicato da Davide, Aggiornato giovedì 19 novembre 2009 1 Commento »
Tutto inizia da questo interminabile quanto esaustivo articolo: utilizzare un javascript per nascondere i campi nel form di inserimento (NewForm.aspx) oppure dal form di visualizzazione (DispForm.aspx) di una lista Sharepoint.
L’utilità? Lasciare ai soli amministratori la possibilità di editing di determinati campi.
Questo il codice di base proposto:
<script language="javascript" type="text/javascript">
_spBodyOnLoadFunctionNames.push("avvioControlli");
function avvioControlli() {
hideFields();
}
function findacontrol(FieldName) {
var arr = document.getElementsByTagName("!");
// get all comments
for (var i=0;i < arr.length; i++ )
{
// now match the field name
if (arr[i].innerHTML.indexOf(FieldName) > 0)
{ return arr[i]; }
}
}
function hideFields() {
var control = findacontrol("Stato");
control.parentNode.parentNode.style.display="none";
control = findacontrol("Comments");
control.parentNode.parentNode.style.display="none";
}
</script>
Dove si mette? Appena soto al PlaceHolderMain, nella pagina NewForm.aspx della relativa lista, tramite Sharepoint Designer: una figura vale più di mille parole. Dopo aver aperto l’albero della lista su Sharepoint Designer, è sufficiente editare il codice della pagina.
L’approccio è perfetto e geniale, il javascript non fa altro che ricercare nel documento i commenti per poi oscurare tramite una proprietà CSS la visualizzazione. Ci sono però alcuni difetti su questo codice: piace a internet explorer e non agli altri browser.
Ecco allora come modificarlo per renderlo compatibile con i vari Firefox, Chrome e compagnia bella:
<script language="javascript" type="text/javascript">
_spBodyOnLoadFunctionNames.push("avvioControlli");
function avvioControlli() {
hideFields();
}
function findacontrol(FieldName) {
//se browser Internet Explorer cerco i commenti
if (navigator.userAgent.indexOf("MSIE")!=-1) {
var arr = document.getElementsByTagName("!");
// get all comments
for (var i=0;i < arr.length; i++ )
{
// now match the field name
if (arr[i].innerHTML.indexOf(FieldName) > 0)
{ return arr[i]; }
}
}
//se browser diverso da Internet Explorer cerco i titoletti
else {
var arr = document.getElementsByTagName("H3");
// get all comments
for (var i=0;i < arr.length; i++ )
{
// now match the field name
if (arr[i].innerHTML.indexOf(FieldName) > 0)
{ return arr[i]; }
}
}
}
function hideFields() {
var control = findacontrol("Stato");
control.parentNode.parentNode.style.display="none";
var control = findacontrol("Comments");
control.parentNode.parentNode.style.display="none";
}
</script>
Se poi volessi piazzare da qualche parte un pulsantino per far riapparire questi campi, magari solo per determinati utenti, sarà sufficiente creare questa funzione:
function showFields() {
var control = findacontrol("Stato");
control.parentNode.parentNode.style.display="block";
var control = findacontrol("Comments");
control.parentNode.parentNode.style.display="block";
}
Buona personalizzazione!
1 Commento »
Puoi lasciare un tuo commento, oppure fare un trackback dal tuo sito.
Lascia il tuo commento
1
Matteo - Pubblicato il 19 01 2011 alle 10:13
Niente male!
Soluzione efficacissima :)