Saturday 22 September 2012

SharePoint Custom List form with horizontal RadioButtons

In sharepoint list form we don't get options to show radiobuttons horizontally and they take to much space of form if there are too many of them.

We can make those radio buttons vertically using some javascript. I searched on google and I found below post.
http://www.mickyjay.co.uk/blog/?p=668

We need to open the form in designer and add below javascript in it.

<script type="text/javascript">
_spBodyOnLoadFunctionNames.push("reconfigRadios");
function reconfigRadios()
{
var inputs = document.getElementsByTagName("INPUT");
var radios = new Array();
for (var i=0; i < inputs.length; i++)
{
    if (inputs[i].type == "radio")
    radios.push(inputs[i]);
}var html = new String();
var openTable = "<TABLE cellSpacing='0' cellPadding='0'
width='100%' border='0'><TR>";
var closeTable = "</TR></TABLE>";for (var i=0; i < radios.length-1; i++)
{if (i == 0)
html = openTable;
var obj = radios[i];
while (true)
{
    if (obj.tagName == "TD")
    break;
    else
    obj = obj.parentElement;
}
html = html + "<TD>" + obj.innerHTML + "</TD>";
if (radios[i].name != radios[i+1].name)
{
   html = html + closeTable;
   var obj2 = obj;
   while (true)
   {
      if (obj2.tagName == "SPAN")
      break;
      else
      obj2 = obj2.parentElement;
   }
   obj2.innerHTML = html;
   html = openTable;
}
if (i == radios.length-2)
{
   obj = radios[i+1];
   while (true)
   {
      if (obj.tagName == "TD")
      break;
      else
      obj = obj.parentElement;
   }
   html = html + "<TD>" + obj.innerHTML + "</TD>";
   html = html + closeTable;
   var obj2 = obj;
   while (true)
   {
      if (obj2.tagName == "SPAN")
      break;
      else
      obj2 = obj2.parentElement;
   }
   obj2.innerHTML = html;
}}}</script>




No comments:

Post a Comment

Related Posts Plugin for WordPress, Blogger...