Adapted from code developed by Lauren McFall at MiraCosta College https://library.miracosta.edu/c.php?g=980906
CCC LSP Discovery UX Workgroup
More info:
Minneapolis College Library: Primo VE Search Widgets
Harvard wiki: Code for embedded search box / widget
Primo VE Customization - Best Practices
<!-- Each function below is connected to a search tab. The functions take the submitted form values and add the appropriate Primo query parameters in order to launch the desired search -->
<!-- Script that converts the query string into valid parameter -->
<script type="text/javascript">
function searchPrimo() {
document.getElementById("primoQuery").value = "any,contains," + document.getElementById("primoQueryTemp").value.replace(/[,]/g, " ");
document.forms["searchForm"].submit();
}
function searchPrimo1() {
document.getElementById("primoQuery1").value = "any,contains," + document.getElementById("primoQueryTemp1").value.replace(/[,]/g, " ");
document.forms["searchForm1"].submit();
}
function searchPrimo2() {
document.getElementById("primoQuery2").value = "any,contains," + document.getElementById("primoQueryTemp2").value.replace(/[,]/g, " ");
document.forms["searchForm2"].submit();
}
function searchPrimo3() {
document.getElementById("primoQuery3").value = "any,contains," + document.getElementById("primoQueryTemp3").value.replace(/[,]/g, " ");
document.forms["searchForm3"].submit();
}
function searchPrimo4() {
document.getElementById("primoQuery4").value = "any,contains," + document.getElementById("primoQueryTemp4").value.replace(/[,]/g, " ");
document.forms["searchForm4"].submit();
}
</script>
<!-- End code for javascript -->
<!-- Tabs -->
<ul class="nav nav-pill responsive">
<li class="active">
<a data-toggle="tab" href="#onesearch">OneSearch</a>
</li>
<li class="">
<a data-toggle="tab" href="#articles">Articles</a>
</li>
<li class="">
<a data-toggle="tab" href="#books">Books</a>
</li>
<li class="">
<a data-toggle="tab" href="#textbooks">Textbooks</a>
</li>
<li class="">
<a data-toggle="tab" href="#audiovisual">Audio Visual</a>
</li>
</ul>
<!-- The individual tab panes -->
<div class="tab-content">
<div id="onesearch" class="tab-pane fade in active">
<br>
<form class="form" id="simple" name="searchForm" method="get" target="_blank" action="https://caccl-laccd.primo.exlibrisgroup.com/discovery/search" enctype="application/x-www-form-urlencoded; charset=utf-8" onsubmit="searchPrimo()">
<div class="input-group input-group-lg" style="width: 100%;">
<!--- Search box ---->
<input class="form-control" type="text" id="primoQueryTemp" value="" placeholder="OneSearch for Articles, Books, and more">
<!-- Customizable Parameters -->
<input type="hidden" name="vid" value="01CACCL_LACCD:ELAC">
<input type="hidden" name="tab" value="Everything">
<input type="hidden" name="search_scope" value="ELAC_LibraryCatalog_and_CI">
<input type="hidden" name="mode" value="basic">
<!-- Fixed parameters -->
<input type="hidden" name="displayMode" value="full">
<input type="hidden" name="bulkSize" value="10">
<input type="hidden" name="highlight" value="true">
<input type="hidden" name="dum" value="true">
<input type="hidden" name="query" id="primoQuery">
<input type="hidden" name="displayField" value="all">
<!-- Enable this if "Expand My Results" is enabled by default in Views Wizard -->
<input type="hidden" name="pcAvailabiltyMode" value="true">
<!-- Search Button -->
<div class="input-group-btn">
<button class="btn btn-default" id="go" title="Search" onclick="searchPrimo()" type="button" value="Search" alt="Search">
<i class="glyphicon glyphicon-search"></i>
</button>
</div>
</div>
</form>
</div>
<div id="articles" class="tab-pane fade">
<br>
<form aria-label="Find Articles" class="form" id="simple" name="searchForm1" method="get" target="_blank" action="https://caccl-laccd.primo.exlibrisgroup.com/discovery/search" enctype="application/x-www-form-urlencoded; charset=utf-8" onsubmit="searchPrimo1()">
<div class="input-group input-group-lg" style="width: 100%;">
<!--- Search box ---->
<input aria-label="Find Articles" class="form-control" type="text" id="primoQueryTemp1" value="" placeholder="Find Articles">
<!-- Customizable Parameters -->
<input type="hidden" name="vid" value="01CACCL_LACCD:ELAC">
<input type="hidden" name="tab" value="Everything">
<input type="hidden" name="search_scope" value="ELAC_LibraryCatalog_and_CI">
<!-- Fixed parameters -->
<input type="hidden" name="query" id="primoQuery1">
<input type="hidden" name="displayField" value="all">
<input type="hidden" name="mfacet" value="rtype,include,articles,1">
<input type="hidden" name="mfacet" value="rtype,include,newspaper_articles,1">
<!-- Search Button -->
<div class="input-group-btn">
<button aria-label="Search Button" class="btn btn-default" id="go" title="Search" onclick="searchPrimo1()" type="button" value="Search" alt="Search">
<i class="glyphicon glyphicon-search"></i>
</button>
</div>
</div>
</form>
</div>
<div id="books" class="tab-pane fade">
<br>
<form aria-label="Find Books" class="form" id="simple" name="searchForm2" method="get" target="_blank" action="https://caccl-laccd.primo.exlibrisgroup.com/discovery/search" enctype="application/x-www-form-urlencoded; charset=utf-8" onsubmit="searchPrimo2()">
<div class="input-group input-group-lg" style="width: 100%;">
<!--- Search box ---->
<input aria-label="Find Books" class="form-control" type="text" id="primoQueryTemp2" value="" placeholder="Find Books">
<!-- Customizable Parameters -->
<input type="hidden" name="vid" value="01CACCL_LACCD:ELAC">
<input type="hidden" name="tab" value="Everything">
<input type="hidden" name="search_scope" value="ELAC_LibraryCatalog_and_CI">
<!-- Fixed parameters -->
<input type="hidden" name="query" id="primoQuery2">
<input type="hidden" name="displayField" value="all">
<input type="hidden" name="mfacet" value="rtype,include,books,1">
<input type="hidden" name="mfacet" value="rtype,include,book_chapters,1">
<!-- Search Button -->
<div class="input-group-btn">
<button aria-label="Search Button" class="btn btn-default" id="go" title="Search" onclick="searchPrimo2()" type="button" value="Search" alt="Search">
<i class="glyphicon glyphicon-search"></i>
</button>
</div>
</div>
</form>
</div>
<div id="textbooks" class="tab-pane fade">
<br>
<form aria-label="Find Textbooks" class="form" id="simple" name="searchForm3" method="get" target="_blank" action="https://caccl-laccd.primo.exlibrisgroup.com/discovery/search" enctype="application/x-www-form-urlencoded; charset=utf-8" onsubmit="searchPrimo3()">
<div class="input-group input-group-lg" style="width: 100%;">
<!--- Search box ---->
<input aria-label="Find Textbooks" class="form-control" type="text" id="primoQueryTemp3" value="" placeholder="Find Textbooks">
<!-- Customizable Parameters -->
<input type="hidden" name="vid" value="01CACCL_LACCD:ELAC">
<input type="hidden" name="tab" value="Everything">
<input type="hidden" name="search_scope" value="ELAC_LibraryCatalog_and_CI">
<!-- Fixed parameters -->
<input type="hidden" name="query" id="primoQuery3">
<input type="hidden" name="displayField" value="all">
<input type="hidden" name="mfacet" value="location_code,include,5265–161070860005265–textbooks,1">
<input type="hidden" name="mfacet" value="location_code,include,5265–161070860005265–reserves,1">
<!-- Search Button -->
<div class="input-group-btn">
<button aria-label="Search Button" class="btn btn-default" id="go" title="Search" onclick="searchPrimo3()" type="button" value="Search" alt="Search">
<i class="glyphicon glyphicon-search"></i>
</button>
</div>
</div>
</form>
</div>
<div id="audiovisual" class="tab-pane fade">
<br>
<form aria-label="Find Audio Visual" class="form" id="simple" name="searchForm4" method="get" target="_blank" action="https://caccl-laccd.primo.exlibrisgroup.com/discovery/search" enctype="application/x-www-form-urlencoded; charset=utf-8" onsubmit="searchPrimo4()">
<div class="input-group input-group-lg" style="width: 100%;">
<!--- Search box ---->
<input aria-label="Find Audio Visual" class="form-control" type="text" id="primoQueryTemp4" value="" placeholder="Find Audio Visual Materials">
<!-- Customizable Parameters -->
<input type="hidden" name="vid" value="01CACCL_LACCD:ELAC">
<input type="hidden" name="tab" value="Everything">
<input type="hidden" name="search_scope" value="ELAC_LibraryCatalog_and_CI">
<!-- Fixed parameters -->
<input type="hidden" name="query" id="primoQuery4">
<input type="hidden" name="displayField" value="all">
<input type="hidden" name="mfacet" value="rtype,include,media,1">
<input type="hidden" name="mfacet" value="rtype,include,videos,1">
<!-- Search Button -->
<div class="input-group-btn">
<button aria-label="Search Button" class="btn btn-default" id="go" title="Search" onclick="searchPrimo4()" type="button" value="Search" alt="Search">
<i class="glyphicon glyphicon-search"></i>
</button>
</div>
</div>
</form>
</div>
</div>
<!-- Links -->
<br>
<a href="https://caccl-laccd.primo.exlibrisgroup.com/discovery/search?vid=01CACCL_LACCD:ELAC&lang=en&mode=advanced" target="_blank">Advanced Search</a>