EVOLUTION-NINJA
Edit File: search.php
<script src="<?php echo base_url('public/assets/js/jquery-ui.js'); ?>"></script> <link rel="stylesheet" href="<?php echo base_url('public/assets/css/jquery-ui.css'); ?>"> <div id="tfheader"> <form id="tfnewsearch" method="get" action="" class="search_form"> <input type="text" class="search_bar tftextinput search_content" name="q" size="21" maxlength="120" placeholder="What would you like to learn about?" required="required"> <input type="hidden" class="search_value" /> <input type="submit" value="Search" class="tfbutton search_button"> </form> <div class="tfclear"></div> </div> <style type="text/css"> .searchbar { padding-top: 3%; padding-bottom: 6%; } .tftextinput { margin: 0; padding: 8px 15px; font-family: Arial, Helvetica, sans-serif; font-size: 14px; border: 1px solid #a6cf39; border-right: 0px; border-top-left-radius: 5px 5px; border-bottom-left-radius: 5px 5px; width: 80%; } .tfbutton { margin: 0; padding: 8px 15px; font-family: Arial, Helvetica, sans-serif; font-size: 14px; outline: none; cursor: pointer; text-align: center; text-decoration: none; color: #ffffff; border: solid 1px #a6cf39; border-right: 0px; background: url(http://localhost/amcad/public/assets/website_assets/images/searchicon.png) no-repeat #a6cf39 !important; background: -webkit-gradient(linear, left top, left bottom, from(#00adee), to(#0078a5)); background: -moz-linear-gradient(top, #00adee, #0078a5); border-top-right-radius: 5px 5px; border-bottom-right-radius: 5px 5px; margin-left: -6px; width: 20%; text-align: right !important; } .tfbutton:hover { text-decoration: none; background: #007ead; background: -webkit-gradient(linear, left top, left bottom, from(#0095cc), to(#00678e)); background: -moz-linear-gradient(top, #0095cc, #00678e); } </style> <style type="text/css"> .pager { float: right; background: #11B0B3; height: 30px; width: 108px; position: relative; right: 0px; width: 118px \9; } .pager img { margin: 3px; } .pageNo { display: inline; position: relative; top: 0px; padding: 0 3px; color: #fff; } .ul_list { height: 10em; line-height: 2em; border: 1px solid #ccc; padding: 0; margin: 0; overflow: scroll; overflow-x: hidden; } .search_field { margin-bottom: 55px; } .search_faculty { width: 500px; } .search_list { z-index: 9; position: absolute; background: #fff; width: 500px; } .ui-autocomplete { max-height: 150px; overflow-y: auto; /* prevent horizontal scrollbar */ overflow-x: hidden; /* add padding to account for vertical scrollbar */ padding-right: 20px; } </style> <script type="text/javascript"> $(document).ready(function() { //---------------------------------Faculty search----------------------------------------------------// $(".search_bar").keyup(function() { var search_value = $(this).val(); $(".search_bar").autocomplete({ source: function(request, callback) { $.ajax({ type: 'post', url: '<?= site_url("search_all") ?>', data: { search_value: search_value }, success: function(response) { // No need to parseJSON here, as the response is already an object // response = $.parseJSON(response); console.log(response); if (response.result == 1) { callback($.map(response.search_result, function(value) { return { label: value.domain_name, value: value.type }; })); } else { // Handle error or no data case } }, minLength: 1 }); }, focus: function(event, ui) { event.preventDefault(); $(".search_content").val(ui.item.label); $(".search_value").val(ui.item.value); return false; }, select: function(event, ui) { event.preventDefault(); $(".search_content").val(ui.item.label); $(".search_value").val(ui.item.value); return { value: ui.item.type }; } }); $('.ui-autocomplete').empty(); }); $('.search_form').submit(function(e) { e.preventDefault(); var autocomplete = $('.ui-autocomplete').html(); var search_bar = $(".search_bar").val(); var search_value = $(".search_value").val(); if (autocomplete != '') { if (search_value != '') { $.ajax({ type: 'post', url: '<?= site_url("get-searched-value-subdomain-id") ?>', data: { search_bar: search_bar, search_value: search_value }, dataType: 'json', // Specify that the response should be parsed as JSON success: function(response) { console.log(response); if (response.result == 1) { if (response.type == 'category') { window.location.href = '<?= site_url("view-category-courses") ?>/' + response.data.domain_id; } else if (response.type == 'sub_category') { window.location.href = '<?= site_url("subject-wise-courses") ?>/' + response.data.sub_domain_id; } else if (response.type == 'course') { window.location.href = '<?= site_url("view-category-courses") ?>/' + response.data.domain_id; } } else { toastr["error"]("No course available"); } } }); } else { toastr["error"]("Please choose from suggestions"); } } else { toastr["error"]("Please choose from suggestions"); } }); }); </script>