Using jquery to align the radio buttons in survey horizontally in SharePoint 2010 survey list.
Pre-requisites:
We need the following jquery libraries:
1) jquery-1.7.2.min.js
2) jquery.SPServices-0.7.1a.min.js
Download the above jquery libraries & save them in your site.
Open the Survey NewForm.aspx page in browser & add the following script in the CEWP.
<script type="text/javascript" src="LocationPath/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="LocationPath/jquery.SPServices-0.7.1a.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$().SPServices.SPArrangeChoices({
columnName:"Radio Button",
perRow:3
});
$().SPServices.SPArrangeChoices({
columnName:"Radio Button 2",
perRow:5
});
});
</script>
<script type="text/javascript" src="LocationPath/jquery.SPServices-0.7.1a.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$().SPServices.SPArrangeChoices({
columnName:"Radio Button",
perRow:3
});
$().SPServices.SPArrangeChoices({
columnName:"Radio Button 2",
perRow:5
});
});
</script>
Script for Hiding Show Graphical summary and Show all responses Links in overview.aspx
<script type="text/javascript">
_spBodyOnLoadFunctionNames.push("hideanchor");
_spBodyOnLoadFunctionNames.push("changeiMageblank");
_spBodyOnLoadFunctionNames.push("changeiMageblank1");
function hideanchor()
{
var anchort= document.getElementById("diidSurveyResults");
var anchort1= document.getElementById("diidResultsByUser");
anchort.style.display = 'none';
anchort1.style.display = 'none';
}
function changeiMageblank()
{
var inputs = document.getElementsByTagName("img");
for(i = 0; i<inputs.length; i++)
{
if(inputs[i].getAttribute("src").indexOf("/_layouts/images/rect.gif") != -1)
{
inputs[i].parentNode.removeChild(inputs[i]);
}
}
}
function changeiMageblank1()
{
var inputs = document.getElementsByTagName("img");
for(i = 0; i<inputs.length; i++)
{
if(inputs[i].getAttribute("src").indexOf("/_layouts/images/rect.gif")!= -1)
{
inputs[i].parentNode.removeChild(inputs[i]);
}
}
}
_spBodyOnLoadFunctionNames.push("hideanchor");
_spBodyOnLoadFunctionNames.push("changeiMageblank");
_spBodyOnLoadFunctionNames.push("changeiMageblank1");
function hideanchor()
{
var anchort= document.getElementById("diidSurveyResults");
var anchort1= document.getElementById("diidResultsByUser");
anchort.style.display = 'none';
anchort1.style.display = 'none';
}
function changeiMageblank()
{
var inputs = document.getElementsByTagName("img");
for(i = 0; i<inputs.length; i++)
{
if(inputs[i].getAttribute("src").indexOf("/_layouts/images/rect.gif") != -1)
{
inputs[i].parentNode.removeChild(inputs[i]);
}
}
}
function changeiMageblank1()
{
var inputs = document.getElementsByTagName("img");
for(i = 0; i<inputs.length; i++)
{
if(inputs[i].getAttribute("src").indexOf("/_layouts/images/rect.gif")!= -1)
{
inputs[i].parentNode.removeChild(inputs[i]);
}
}
}
</script>
Script to hide the Actions & Settings Menu in Survey toolbar
<script>
function HideDiv(name) {
var div = document.getElementsByTagName('div');
for (var i = 0; i < div.length; i++) {
var str = div[i].id;
if (str.indexOf(name) >= 0) {
var viewInExplorer = div[i];
if (viewInExplorer != null) {
if (viewInExplorer.parentNode != null)
viewInExplorer.parentNode.removeChild(viewInExplorer);
}
}
}
}
HideDiv("ListActionsMenu");
HideDiv("ListSettingsMenu");
</script>
Hide the Questions in Graphical summary of survey list
<script src="/sites/......./Jquery/jquery.SPServices-0.7.1a.min.js" type="text/javascript"></script><script src="/sites/...../Jquery/js_jquery-1.7.2.min.js" type="text/javascript"></script><script type="text/javascript">
$(document).ready( function() {
$('h3:contains("1. Question1")').hide().next("table").hide();
$('h3:contains("2. Question2")').hide().next("table").hide();
})</script>
for (var i = 0; i < div.length; i++) {
var str = div[i].id;
if (str.indexOf(name) >= 0) {
var viewInExplorer = div[i];
if (viewInExplorer != null) {
if (viewInExplorer.parentNode != null)
viewInExplorer.parentNode.removeChild(viewInExplorer);
}
}
}
}
HideDiv("ListActionsMenu");
HideDiv("ListSettingsMenu");
</script>
Hide the Questions in Graphical summary of survey list
Pre-requisites:
We need the following jquery libraries:
1) jquery-1.7.2.min.js
2) jquery.SPServices-0.7.1a.min.js
Download the above jquery libraries & save them in your site.
Open the Survey Summary.aspx page in browser & add the following script in the CEWP.
<script src="/sites/......./Jquery/jquery.SPServices-0.7.1a.min.js" type="text/javascript"></script><script src="/sites/...../Jquery/js_jquery-1.7.2.min.js" type="text/javascript"></script><script type="text/javascript">
$(document).ready( function() {
$('h3:contains("1. Question1")').hide().next("table").hide();
$('h3:contains("2. Question2")').hide().next("table").hide();
})</script>
Tips:
Scenario 1:
If the Administrator does not want to allow end users to see all columns in default EditForm or DisplayForm of a list then he can hide the specific columns from end users by using the following script
If the Administrator does not want to allow end users to see all columns in default EditForm or DisplayForm of a list then he can hide the specific columns from end users by using the following script
<script type="text/javascript">
$(document).ready(function(){
$('nobr:contains("Column-Name1")').closest('tr').hide();
$('nobr:contains("Column-Name2")').closest('tr').hide();
});</script>
$(document).ready(function(){
$('nobr:contains("Column-Name1")').closest('tr').hide();
$('nobr:contains("Column-Name2")').closest('tr').hide();
});</script>
where Column-Name1is the name of the column within the list which the administrator wants to hide.
Scenario 2:
If the Administrator wants to hide certain columns based on the value of other column within the list from end users in default EditForm or DisplayForm of a list then he can hide the specific columns by using the following script
<script type="text/javascript">
$(document).ready(function(){
var DropDownStatus = $("[title='Status']").val();
if(DropDownStatus == "Pending")
{
$('nobr:contains("ColumnToHide")').closest('tr').hide();
}
});</script>
$(document).ready(function(){
var DropDownStatus = $("[title='Status']").val();
if(DropDownStatus == "Pending")
{
$('nobr:contains("ColumnToHide")').closest('tr').hide();
}
});</script>
where,
ColumnToHide is the name of the column within the list which the administrator wants to hide.
var DropDownStatus = $("[title='Status']").val(); - fetches the value of the column name "Status" & assigns it to variable DropDownStatus
No comments:
Post a Comment