Certified for SharePoint 2007 Certified for SharePoint 2010


The SPArrangeChoices rearranges radio buttons or checkboxes in a form from vertical to horizontal display to save page real estate. If the column has "Allow 'Fill-in' choices:" set to 'Yes', the fill-in option will always remain at the bottom of the controls.

Important notes:

  • In versions prior to v0.5.8, SPArrangeChoices did not work with Survey questions. If you want to use this function with Surveys, please upgrade to v0.5.8 or greater.
  • If you are working with a customized form, you'll need to use a little trick to get this function to work. (Thanks to alexlee797 for pointing this out.) You'll need to add the following line:
    <xsl:comment>FieldName="Display Name"</xsl:comment>
    just above the <SharePoint:FormField> in the XSL of the custom form. You should replace 'Display Name' with the same value you supply for columnName in the function call.
    This is a little kludgy, but SharePoint doesn't render anything else for us to "hook into" for the radio button or checkbox columns. In an uncustomized form, this comment is already in the page; when you customize the form you need to add it manually.


	listName: "",
	columnName: "",
	perRow: 99,
	randomize: false

If specified, this list will be used to look up the column's attributes. By default, this is set at runtime to the list name for the current form's context based on the form's URL. You will not generally need to specify this value.

The DisplayName of the Choice column in the form. This function works with both radio buttons and checkboxes.

The maximum number of choices to show per row.

If true, randomize the order of the options.


The screen snips below show the before and after views of columns with checkboxes (Lead Source) and radio buttons (Radio Buttons) when the following calls to SPArrangeChoices are in place.

	columnName: "Lead Source",
	perRow: 2
	columnName: "Radio Buttons",
	perRow: 7

Lead Source before:

Lead Source after:

Radio Buttons before:

Radio Buttons after:

Last edited Nov 15, 2010 at 3:42 AM by sympmarc, version 11


spproservice Feb 11, 2016 at 8:56 PM 
Hi, thank you for the post.
Would you be able to clarify Alexei's comments regarding custom forms. How to edit the XSL text he is referring too? Thank you.

hpirbiz Jan 19, 2016 at 9:26 PM 
I have this working fine using a list form, but not a document library form. Does it work with document libraries? Using SharePoint 2010.

bettya2015 Sep 23, 2015 at 9:33 PM 
I have my checkboxes displaying horizontally, however, the checked choices are not getting saved to the list. Help!

TomWard Jun 18, 2015 at 6:52 PM 
I have been trying to get this to work on Custom Pages or the Default pages.
Still does not load or modify the test fields?
No Errors or Warnings
Site is set to Permissive
Have tried it with the full path to the .js, and relative path ../ or / still does not work!

<script language="javascript" type="text/javascript" src="http://SiteName/SiteAssets/jQueryLibraries/jquery-1.11.3.js"></script>
<script language="javascript" type="text/javascript" src="http://SiteName/SiteAssets/jQueryLibraries/jquery.SPServices-2014.01.min.js"></script>
listName: "List Name Removed",
columnName: "Vertical",
perRow: 99,
randomize: false

Clem11 Mar 30, 2015 at 12:41 PM 
We are using SP2013 in SP2010 emulation mode. This method throws an error: "Wrong Number or Invalid Arguments" when it calls jquery.js

SravanB Feb 10, 2015 at 4:10 PM 
I am using SharePoint 2013, your code seems working with some tweak. I have added <tr></tr> to the table below, so it won't miss some choices:

//Create a new choices table to hold the arranged choices.
var newChoiceTable = $("<table cellpadding='0' cellspacing='1'><tr></tr></table>");

bleutiger Dec 15, 2014 at 8:03 PM 
getting this error in SP 20113

Unable to get property 'childNodes'

Any ideas?

logintoreality Apr 3, 2014 at 3:37 AM 
this is great little script!! wonder how to pass in multiple columnName values instead of redoing the script!

photogeorge Jun 13, 2013 at 7:29 PM 
Marc, this information is great. I'm new to programing though. I have a custom form with about 40 questions with radio options for 1-5. Where do I need to place this code in this form? Also, if I am understanding properly, this code would need to be placed in every single spot it is needed, is there a place or code that could do it all from one location rather than re-listing the code so many times? Thank you once again. George

peoniessmiles Apr 3, 2013 at 4:18 PM 
I ahve a SharePoint 2007 site, but the radio buttons have not changed their direction.

sathyaseelan Jan 31, 2013 at 7:54 AM 
Its really wonderful.........................thanks man

pmbaokhanh Aug 1, 2012 at 8:03 AM 
<xsl:comment>FieldName="Something"</xsl:comment> make this field failed to save. I have a choice field with about 40 options. Can that be the problem?

cepes Apr 7, 2012 at 2:48 PM 
Fabulous Marc. Thanks for this.
Charlie Epes

rrediska Nov 7, 2011 at 9:18 AM 
i was wondering if it's possible to dissplay by columns a long list of sources on SP Advanced search OOB WP?

sympmarc Jun 13, 2011 at 5:01 AM 
Awrex: Please post your questions in the Discussions. You can change the display using CSS. Since many people have custom CSS applied to their sites, I don't try to predict what the output will look like; I simply structure it cleanly. M.

Awrex Jun 10, 2011 at 6:14 PM 
Sorry sent the wrong link...

Awrex Jun 10, 2011 at 6:13 PM 
This is awesome, it's working as displayed. The only question I have is can I clean up the formatting on how the fields are displayed?

Example -

iOnline247 Jun 8, 2011 at 10:48 PM 
@parriwg This function works great in 2007. I'd suggest posting the problem you are facing in the Discussions forum. Most of these comments are rarely seen and are very limited in what you can post. Feel free to start a thread in the Discussions and we'll look at it.

parriwg Jun 8, 2011 at 9:20 PM 
I'm thinking this is what I should have... is that correct?

<script type="text/javascript" src="http://MYSITENAME/SharePoint/PowerUsers/CodeLibrary/jquery-1.5.1.min.js"></script>

<script type="text/javascript" src="http://MYSITENAME/SharePoint/PowerUsers/CodeLibrary/jquery.SPServices-0.6.1.min.js"></script>

<script type="text/javascript">
columnName: "Lead Source",
perRow: 2

iOnline247 Mar 24, 2011 at 3:49 PM 
@ironman99 This function works great in 2007. I'd suggest posting the problem you are facing in the Discussions forum. Most of these comments are rarely seen and are very limited in what you can post. Feel free to start a thread in the Discussions and we'll look at it.

ironman99 Mar 24, 2011 at 3:24 PM 
does this work with moss 2007? I've been trying to get this to work, but with no luck.

ValliMarco Jun 4, 2010 at 9:29 AM 
This work with SharePoint 2010 in customized form and with the <xsl:comment> trick... Nice Job!!! :)