11 Event Registration - Limit Available Grades with CSS Shared by Nathan Parikh, Hallmark Baptist Church one year ago 8.8 General Intermediate In an Event Registration form, for a Grade person field, there is not currently a way to limit the Grades that are displayed in the drop-down.Our church's Vacation Bible School is only for children PreK-5th grade, so we wanted those grades to be the only options available in order to help prevent children from 6th grade and up from registering.Follow these steps to hide different grades from your Event Registration form:Edit the desired Event Registration TemplateFind the "Grade" Person Field and click the pencil icon to editIn the Pre-Text, the following HTML/CSS will hide 6th-12th grade:<style type="text/css">.grade-picker option[value="6"],.grade-picker option[value="5"],.grade-picker option[value="4"],.grade-picker option[value="3"],.grade-picker option[value="2"],.grade-picker option[value="1"],.grade-picker option[value="0"] {display: none;}</style>Click Save and that's it! You can add or remove the option values as needed. The following are what the option values/grades are as of Rock v.8.8:<option value="13">Pre-K</option> <option value="12">K</option><option value="11">1st</option><option value="10">2nd</option><option value="9">3rd</option><option value="8">4th</option><option value="7">5th</option><option value="6">6th</option><option value="5">7th</option><option value="4">8th</option><option value="3">9th</option><option value="2">10th</option><option value="1">11th</option><option value="0">12th</option>Hope this is helpful!
Jeremy Hoff Reply one month ago This is awesome - thank you! Have others been able to get this to work in Safari?... it seems to ignore this and display all the grades.
Calvin Ho Reply 8 months ago How can we apply this same technique to schools, too? Between K-12, we probably have 50+ schools to choose from.
Nathan Parikh 5 months ago Calvin, as long as you can find the option values for what you want to hide, you should be able to adjust the CSS accordingly.