Hi folks
My Javascript/jQuery skills are rudimentary at best and I hope someone might be
able to help me out.
I'm trying to collapse large blocks of ISBNs on OPAC records (where for example
we have someone's works catalogued as a set and every volume has a different
ISBN).
We have a similar bit of jQuery that collapses large contents notes:
----
// Collapse contents on OPAC
if(window.location.href.indexOf("cgi-bin/koha/opac-detail.pl?biblionumber") >
-1) {
$(document).ready(function(){
var countclass = $(".contentblock").length; //counts number of contentblocks
if(countclass > 0){ //if more than one contentblock
var expander = "<div id='expander' style='font-size:14px;
color:green;'>Click to Expand +</div>"; //create expansion button
function tog(){$(document).find('.contentblock').slideToggle("slow")};
//create slide toggle function
function typ(){ //change expansion button based on display of contentblocks
if($(".contentblock").css('display') == 'block'){
$("#expander").text("Click to Expand +");
}else if($(".contentblock").css('display') == 'none'){
$("#expander").text("Click to Collapse -");
};
};
$("span:contains('Contents:')").append(expander); //add expansion button to
page
$(".contentblock").hide(); //hide contentblocks initially
$("#expander").click(function(){ //execute the two functions when the
expansion button is clicked
typ();
tog();
});
};
});
}
----
(from
https://wiki.koha-community.org/wiki/JQuery_Library#Collapsible_contents_in_bib_record)
I thought if I replaced instances of ".contentblock" with ".isbn" this might do
what I want:
----
// Collapse ISBNs on OPAC
if(window.location.href.indexOf("cgi-bin/koha/opac-detail.pl?biblionumber") >
-1) {
$(document).ready(function(){
var countisbns = $(".isbn").length; //counts number of isbns
if(countisbns > 2){ //if more than 3 isbns
var expander = "<div id='expander' style='font-size:14px;
color:green;'>Click to Expand +</div>"; //create expansion button
function tog(){$(document).find('.isbn').slideToggle("slow")}; //create
slide toggle function
function typ(){ //change expansion button based on display of isbns
if($(".isbn").css('display') == 'block'){
$("#expander").text("Click to Expand +");
}else if($(".isbn").css('display') == 'none'){
$("#expander").text("Click to Collapse -");
};
};
$("span:contains('ISBN:')").append(expander); //add expansion button to page
$(".isbn").hide(); //hide isbns initially
$("#expander").click(function(){ //execute the two functions when the
expansion button is clicked
typ();
tog();
});
};
});
}
----
Unfortunately that doesn't work.
I can see that the contents blocks look like <div class="contentblock"
property="description" style="display: block;"> while ISBNs look like <span
property="isbn"> (so really I should have used "#isbn" rather than ".isbn" but
that didn't work either).
How do I select these ISBNs so that I can hide them? Should I be using XPath or
CSS Selectors instead?
With kind regards from the Dalton McCaughey Library Team
Carlos Lopez
Dalton McCaughey Library | 29 College Crescent, Parkville, VICTORIA 3052
Ph: 03 9340 8888 ext.1 | [email protected]<mailto:[email protected]>
| library.dmlibrary.org.au
_______________________________________________
Koha mailing list http://koha-community.org
[email protected]
Unsubscribe: https://lists.katipo.co.nz/mailman/listinfo/koha