Tạo autofill cho search box chạy bằng ajax

Thảo luận trong 'PHP & MySQL' bắt đầu bởi jujota, 14/5/13.

  1. jujota

    jujota Thành viên mới

    Chào các bạn,
    Tôi có trang web cung cấp tài liệu cho khách hàng như sau: present-legal.vn/thu-vien-tai-lieu.html
    Nhược điểm của nó là search rất khó ra kết quả và gây "nản lòng" bất kỳ khách hàng nào "không" biết cách search :hopelessness: Ví dụ: "đơn xin việc" sẽ ra nhưng chỉ cần "don xin viec" hoặc dư dấu chấm "đơn xin việc." thì không kết quả. Vì vậy tôi muốn cải thiện điều này bằng 1 cách nào đó như xuất hiện autofill khi gõ 1 vài ký tự cho KH dễ nhận biết, hoặc search không dấu vẫn chấp nhận,...
    Sau đây là code của file default_search.php của component thư viện tài liệu này của web mình, mong các bạn diễn đàn hướng dẫn giúp. Chân thành cảm ơn.
    Mã:
    <?php 
    	defined( '_JEXEC' ) or die( 'Restricted access' ); 
    ?>
    <script type="text/javascript">		
    
    		var ajax =  new Array();
    		function getFields(sel)
    		{			
    			var category = sel.options[sel.selectedIndex].value;
    			//alert(category);
    			document.getElementById('field_id').options.length = 0;				
    			if(category.length>0){
    				var index = ajax.length;
    				ajax[index] = new sack();		
    				ajax[index].requestFile = '<?php echo JURI::root(); ?>index.php?option=com_tvtechlawdb&view=fieldsincategory&cat_id=' + category;	
    				ajax[index].onCompletion = function(){ createFields(index); };
    				ajax[index].runAJAX();
    			}
    		}		
    		function createFields(index)
    		{			
    			var obj = document.getElementById('field_id');
    			eval(ajax[index].response);	
    		}
    		function getAgencys(sel)
    		{
    			var category = sel.options[sel.selectedIndex].value;			
    			document.getElementById('agency_id').options.length = 0;				
    			if(category.length>0){
    				var index = ajax.length;
    				ajax[index] = new sack();		
    				ajax[index].requestFile = '<?php echo JURI::root(); ?>index.php?option=com_tvtechlawdb&view=agencysincategory&cat_id='+ category;	
    				ajax[index].onCompletion = function(){ createAgencys(index) };
    				ajax[index].runAJAX();
    			}
    		}
    		function createAgencys(index)
    		{
    			var obj = document.getElementById('agency_id');
    			eval(ajax[index].response);	
    		}
    		function getSubcats(sel)
    		{
    			var category = sel.options[sel.selectedIndex].value;			
    			document.getElementById('subcat_id').options.length = 0;				
    			if(category.length>0){
    				var index = ajax.length;
    				ajax[index] = new sack();		
    				ajax[index].requestFile = '<?php echo JURI::root(); ?>index.php?option=com_tvtechlawdb&view=subcatsincategory&cat_id='+ category;	
    				ajax[index].onCompletion = function(){ createSubcats(index) };
    				ajax[index].runAJAX();
    			}
    		}
    		function createSubcats(index)
    		{
    			var obj = document.getElementById('subcat_id');
    			eval(ajax[index].response);	
    		}
    </script>
    <div class="lawdb_search">
    <form method="get">
    	<table width="100%" class="lawdb_search">
        	<tr>
            	<td width="30%">
                	<label for="keyword"><?php echo JText::_('Keyword'); ?></label>
                </td>
                <td>
                	<input class="inputbox keyword" type="text" name="keyword" id="keyword" value="<?php echo $this->retains['keyword'];?>" />
                </td>
            </tr>
            <?php 
    		if(!$this->category_id):
    		?>
            <tr>
            	<td>
                	<label for="cat_id"><?php echo JText::_('Category')?></label>
                </td>
                <td>
                	<?php
                    	echo $this->lists['category_id'];
    				?>
                </td>
            </tr>     
            <?php
            endif;
    		?>  
            <tr>
            	<td>
                	<label for="field_id"><?php echo JText::_('Sub Category')?></label>
                </td>
                <td>
                	<?php
                    	echo $this->lists['subcat_id'];
    				?>
                </td>
            </tr> 
            <tr>
            	<td>
                	<label for="field_id"><?php echo JText::_('Field')?></label>
                </td>
                <td>
                	<?php
                    	echo $this->lists['field_id'];
    				?>
                </td>
            </tr> 
            <?php 
    		if(!$this->category_id):
    		?>        
            <tr>
            	<td>
                	<label for="agency_id"><?php echo JText::_('Issue Agency')?></label>
                </td>
                <td>
                	<?php
                    	echo $this->lists['agency_id'];
    				?>
                </td>
            </tr>
            <tr>
            	<td valign="top">
                	<label for="agency_id"><?php echo JText::_('Sign Number')?></label>
                </td>
                <td>
                	<input class="inputbox signnumber" type="text" name="signnumber" id="signnumber" value="<?php echo $this->retains['signnumber'];?>" /><br /> <span style="color:#CCC; font-size:90%; font-style:italic;">(<?php echo JText::_('Only Law Document and Dispatch');?>)</span>
                </td>
            </tr>
            <?php
            endif;
    		?> 
            <tr>
            	<td>&nbsp;
                	
                </td>
                <td>
                	<input type="submit" name="btnSearch" value="<?php echo JText::_('Search')?>" />
                    <input type="reset" name="btnReset" value="<?php echo JText::_('Reset')?>" />
                    <h2><p style="margin:16px 0px 3px; font-size:12px;"><a style="color:#d4aa1a" href="present-legal.vn/huong-dan-tai-tai-lieu.html"><?php echo JText::_('How to search and download documents on our website')?></a></p></h2>
                </td>
            </tr>
        </table>
    </form>	
    </div>  
  2. jujota

    jujota Thành viên mới

    Bạn nào rành vụ này vui lòng hỗ trợ để tôi xây dựng website tốt hơn nhé!
  3. ndtien91

    ndtien91 Thành viên mới

    Tạo 1 cái auto complete bằng ajax là được mà ?

Chia sẻ trang này