Often we are have clients who want to capture additional data for their patrons. For schools and colleges, this typically includes demographic details, roll numbers, program enrolled etc. The Koha-friendly way to do is by using Extended Patron Attributes aka custom fields for patron data.`
The thing about these patron attribute fields is that if these are expecting textual data input, Koha uses the textarea
HTML element for them. Which is fine, except the textarea elements are sized to 2 rows by default. This something that confuses some users who expect to see an input
element instead. So, we decided to adopt a middle way solution – to reduce the textarea element’s rows
attribute from 2 to 1.
JQuery to the rescue
As always we turn to trusty jquery which makes this something ridiculously easy thing to do. Here is the code snippet:
$(document).ready(function(){ if ($('#pat_memberentrygen').length) { var tareas = $('textarea[id^=patron_attr_]'); for (var i=0; i < tareas.length; i++) { var t = $(tareas[i]); var tarea_reset_rows = t.attr('rows',1); } } });
We plug that code into our IntranetUserJS
system preference and we are good to go! 🙂 The screenshot below shows the change it brings to the patron data entry UI.
Code explained
In the first line (i.e. the one starting with if
) we check if we are actually on the patron member entry page. Next we create a JS array of only the textarea element on *that* page, *which* have an id that begins with patron_attr_
. And finally we loop through that array and change the rows
attribute of each textarea
fields whose reference is stored in the array.
1 thought on “JQuery quicktip : Using Patron Attribute fields without double rowed textarea boxes”