sentilib_語料庫項目_search模塊的實現

1,搜索表單#searchForm做好準備

2,js 將表單數據序列化並傳送給“控制器”

3,控制器 添加$actions=word_search

4,  words類 添加方法 searchWords

5,js 將返回的數據放入網頁相應的DIV #word_list_searched

6,js 讓 DIV #word_list_searched 先隱藏,用戶點擊搜索後再出現


搜索前




搜索後






1,搜索表單#searchForm做好準備

<form class="form-horizontal" id="searchForm">
        <fieldset>
			<div class="control-group span3">
				  <!-- Search input-->
				  <div class="controls">
				    <input id="searchbox" placeholder="請輸入您要查詢的詞語" class="input" type="text" name="keyword">
				  </div>
			</div>

			<div class="control-group span3">
				    <div class="controls">
					  <!-- Inline Radios -->
					  <label class="radio inline">
						<input checked="checked" value="1" name="group" type="radio">
						中文
					  </label>
					  <label class="radio inline">
						<input value="2" name="group" type="radio">
						英文
					  </label>
		  			</div>
			</div>
			<div class="control-group span2">
				  <!-- Button -->
				  <div class="controls">
                  <!-- 這句話非常重要,是Ajax提交數據時,指定action的  -->
                  <input type="hidden" name="action" value="word_search" />
				    <button class="btn btn-success" type="submit">查詢</button>
				  </div>
			</div>

			</fieldset>
		  </form>
注意2點:

1,表單數據序列化的格式是 keyword=%E5%93%88&group=1&action=word_search

     其中 keyword ,group , action  都是 各個input標籤的 name 屬性;因此name 屬性一定要設置

2,

<input type="hidden" name="action" value="word_search" />
這行代碼指定了 動作 action 爲 word_search



2,js 將表單數據序列化並傳送給“控制器”


$("#searchForm button").live("click", function(event){
            //必須有這下面這行,否則.ajax方法將無法成功調用
            event.preventDefault();
            var formData = $(this).parents("form").serialize();
            $.ajax({
               type: "POST",
               url: processFile,
               data: formData,
               success: function(data) {
               },
                error: function(msg)
                {
                        alert(msg);
                }
            });
   });

3,控制器 添加

$actions=array(

'word_search' => array(
                  'object' => 'Words',
                  'method' => 'searchWords'
           )

)


4,  words類 添加方法 searchWords

public function searchWords()
{   
	    $keyword = htmlentities($_POST['keyword'], ENT_QUOTES,"UTF-8");
    	    $group = htmlentities($_POST['group'], ENT_QUOTES,"UTF-8");
            $words = $this->processSearch($keyword,$group);
            $i=0;
            $tab_str="<table class='table table-striped table-bordered table-hover table-condensed' align='center'>";
            $tab_str.="<thead><td><i class='icon-search'></i></td><td>詞語</td><td>詞性</td><td>傾向值[-3,3]</td><td>詞語類別</td><td>編輯</td></thead>";

            foreach ( $words as $key => $word )
            {   
                    $i++;
                    $labels=NULL;
                    $labels.="<tr>";
                    $labels.="<td width=5%>".$i."</td>";
                    
                    //詞語
                    $link = "<a class='need_model' href='view.php?word_id=".$word['word_id']."'>".$word['word']."</a>";
                    $labels.="<td width='35%'>".$link."</td>";
                    
                    //詞性:1,褒貶詞;2,程度副詞
                    $senti_type=($word[senti_type]===1)?"褒貶詞":"程度副詞";
                    $labels.="<td width='15%'>".$senti_type."</td>";
                    
                    //傾向值:-3~3
                    $labels.="<td width='15%'>".$word[senti_value]."</td>";
                    
                    //中英文:1,中文;2,英文
                    $word_type=($word[word_type]==1)?"中文":"English";
                    $labels.="<td width='15%'>".$word_type."</td>";
                    
                    //編輯鏈接
                    $link2 = "<a class='need_model' href='view.php?word_id=".$word['word_id']."'>編輯</a>";
                    $labels.="<td width='15%'>".$link2."</td>";
                    $tab_str.=$labels;
                
            }
            
            $tab_str.="</table>";
            echo $tab_str;

	}

public function processSearch($keyword=NULL,$group=NULL)
    {
        
        //這裏暫時還沒有做數據庫分頁
        $sql = "SELECT ******************* WHERE  1=1 ";
        
        if ( !empty($keyword) ){
            $sql .= " and `***` like '%".$keyword."%'";
        }
    
        if ( !empty($group) ){
            $sql .= " and `***`=".$group;
        }
    
        $sql.=" limit 1,5";


        try{
                $stmt = $this->db->prepare($sql);

                    $stmt->execute();
                    $results = $stmt->fetchAll(PDO::FETCH_ASSOC);
                    $stmt->closeCursor();
                    return $results;
            }
            
            
         catch ( Exception $e ){
             die ( $e->getMessage() );
            }
        
    }


5,js 將返回的數據放入網頁響應的DIV #word_list_searched中


success: function(data) {
					$("#word_list_searched").html(data);
               },

6,js 讓 DIV #word_list_searched 在搜索後再出現


$(document).ready(function() {
  $("#word_list_searched").hide();
});


success: function(data) {
					$("#word_list_searched").html(data);
					$("#word_list_searched").show();
               },


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章