<script type="text/javascript">
function kirimCari() {

    var ca = document.getElementById("cari").value;
    var kj = document.getElementById("kd_jenis");
    var optionKj = kj.options[kj.selectedIndex].value;
//   alert('cari :'+ca);
    if (ca == "") {
        document.getElementById("tampilData").innerHTML = "";
        return;
    } else { 
        if (window.XMLHttpRequest) {
            // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp = new XMLHttpRequest();
        } else {
            // code for IE6, IE5
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange = function() {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                document.getElementById("tampilData").innerHTML = xmlhttp.responseText;
            }
        }
        xmlhttp.open("GET","modul/mod_elibrary/tampil_elibrary.php?ca="+ca+"&kj="+optionKj,true);
        xmlhttp.send();
    }
}
</script>
<header id="fh5co-header" class="fh5co-cover fh5co-cover-sm" role="banner" style="background-image:url(images/e-library.jpg);" data-stellar-background-ratio="0.5">
	<div class="overlay"></div>
	<div class="container">
		<div class="row">
			<div class="col-md-8 col-md-offset-2 text-center">
				<div class="display-t">
					<div class="display-tc animate-box" data-animate-effect="fadeIn">
						<h1>e-Library</h1>
						<h2>cek koleksi buku-buku kami disini.</h2>
					</div>
				</div>
			</div>
		</div>
	</div>
</header>

<div id="fh5co-blog">
	<div class="container">
		<div class="row">
		    <div class="col-lg-8 col-md-12">
				<div class="fh5co-blog animate-box">
				    <input type='text' name='cari'  id="cari" class="form-control" placeholder='masukkan judul buku' required/>
				</div>
			</div>
			<div class="col-lg-4 col-md-12">
				<div class="fh5co-blog animate-box">
				    <!--<input type='text' name='cari'  id="cari" class="form-control" placeholder='masukkan judul buku' onchange="kirimCari();"/>-->
				    <SELECT name="kd_jenis" class="form-control" id="kd_jenis" onchange="kirimCari();">
						<OPTION value="0" selected>Pilih Jenis Katalog</OPTION>
						<?Php
						$jenis_katalog = mysqli_query($conn,"SELECT kd_jenis,jenis FROM m_jenis_katalog WHERE kd_jenis IN (SELECT kd_jenis FROM m_katalog GROUP BY kd_jenis)");
                        while($ta = mysqli_fetch_array($jenis_katalog)){
                        ?>
                        <OPTION value="<?Php echo"$ta[kd_jenis]";?>"><?Php echo"$ta[jenis]";?></OPTION>
                        <?Php
                        }
                        ?>
                    </SELECT>
				</div>
			</div>
			<div id="tampilData">
			    
			</div>

		</div>
	</div>
</div>