2013-08-20 226 views
0

我想構建一個簡單的搜索功能,但我找不出爲什麼我的代碼不工作。實現搜索功能sailsjs

這是我建立了搜索行動:我有我的主網頁上的按鈕

search: function(req, res) { 

    var criteria = req.param('criteria'); 

    var value = req.param('value'); 


    Human.find().where({ criteria: value }).done(function(err, humans) { 
     if(err) { 
     return console.log('Error:' + err); 
     }else{ 
     res.view({ 
      title: 'Search', 
      humans: humans 
     }); 
     } 
    }); 
} 

與搜索的ID。我想這樣做只要有人點擊我的搜索按鈕,它就會查詢數據庫並在localhost:1337/model/search處返回結果。到目前爲止,我已經嘗試使用兩個變量(條件,值)向該控制器操作發送ajax請求,但它不起作用。

這是AJAX調用,我提出:

$('#search').on('click', function() { 
    var criteria = $('#filter').val(); 

    var value = $('#value').val(); 

    $.ajax({ 
     type: 'POST', 
     url: 'http://localhost:1337/human/search', 
     cache: false, 
     data: { 
      criteria: criteria, 
      value: value 
     }, 
     success: function(data) { 
      console.log('SUCCESS!'); 
      window.location.href = 'http://localhost:1337/human/search'; 
     }, 
     error: function(err) { 
      console.log('ERROR!'); 
     } 
    }); 
}); 

這是對應的視圖:

<table> 
    <thead> 
     <tr> 
    <th>ID</th> 
    <th width="150">First Name</th> 
    <th width="150">Last Name</th> 
    <th width="150">Contact</th> 
    <th width="150">E-Mail</th> 
    <th>View</th> 
    <th>Edit</th> 
    </tr> 
</thead> 

<tbody> 
<% _.each(humans, function(model) { %> 
<tr> 
<td> <%= model.id %> </td> 
<td> <%= model.firstName %> </td> 
<td> <%= model.lastName %> </td> 
<td> <%= model.contact %> </td> 
<td> <%= model.email %> </td> 
<td><a href="/human/view/<%= model.id %>" class="tiny button">VIEW</a></td> 
<td><a href="/human/edit/<%= model.id %>" class="tiny button">EDIT</a></td> 
    </tr> 
<% }) %> 
</tbody> 
</table> 

回答

1

Promlem#1:當您搜索這樣的模式:Human.find().where({ criteria: value }) ,您實際上按名稱爲「標準」的字段進行搜索,而不是按字段進行搜索,該變量名稱保存在criteria變量中。 嘗試創建搜索對象是這樣的:

var searchObj = {}; 
searchObj[criteria] = value; 
// and then search like you did before 
Human.find().where(searchObj).done(function(err, humans) { 
    if(err) { 
    console.log('Error:' + err); 
    // you should return some response here: 
    res.send(err, 500); 
    }else{ 
    res.view({ 
     title: 'Search', 
     humans: humans 
    }); 
    } 
}); 

問題2:你爲什麼AJAX請求,然後做重定向到相同的URL?
首先,你做了POST請求,雖然GET請求更適合搜索引擎。通常在您使用創建資源時使用POST。
其次,在阿賈克斯成功處理程序,您會收到與發現人類模型視圖後,你只需瀏覽器重定向到URL http://localhost:1337/human/search沒有傳遞任何參數,所以控制器將嘗試空值和標準Human.find().where({ "": "" })進行搜索。所以你不會看到預期的結果。

目前還不清楚您是想通過ajax獲取數據,還是僅僅將其顯示在新的HTML頁面中?

編輯:如果你不希望使用AJAX,讓HTML表單爲你做的工作:

<form action="human/search"> 
     <input name="criteria" value="foo"> 
     <input name="value" value="bar"> 
     <button type="submit" id="search">Search</button> 
    </form> 

搜索按鈕,點擊會提交表單,並通過在所有形式的數據GET請求的查詢字符串:http://localhost:1337/human/search?criteria=foo&value=bar

當然,您可以使用javascript手動構建查詢字符串,而不使用表單,並將瀏覽器重定向到該URL。結果將是相同的。

+0

Criteria =>屬性;值=>該屬性的值;基本上,我試圖寫:Human.find()。其中​​({id:2})(例如:criteria = id; value = 2;) –

+0

我試過了你提供的代碼,但它仍然沒有工作。也許我錯過了一些東西。我會盡力更好地解釋這個過程。我有一個搜索ID(使用Zurb Foundation Framework)的頁面上的按鈕:Search當有人點擊這個按鈕時,它會觸發我發佈並導航到localhost:1337/human/search的點擊事件;它返回一個空視圖; –

+0

檢查編輯的答案 – ataman