PDA

View Full Version : Dynamic search and pagination



x0ner
22 Feb 2011, 1:17 PM
I have a search that allows a users to pick a search type and a search value. These are then passed to an ajax call that will make the request to the server and grab the results. The thing to note here is that the backend server needs those parameters passed each time, so it gets the proper results.

I have created a pagination bar that successfully sees the amount of results, pages, etc, but I can't seem to get it to pass the original search type and value when hitting the next page button. The json store assumes the proxy or url I use is not going to take dynamic variables (or at least it seems that way).

I feel like I have tried everything:

global variable that get set
jsonstore metadata generated serverside
httpproxy passing parameters
baseparams in the json store that get updated


Any ideas or suggestions would be great. I have spent hours on this and feel like it has been a complete waste of time.

x0ner
22 Feb 2011, 1:39 PM
Solved my own problem. I neglected to see the add baseparam method for the JSOn store. Called that after my store load and all worked well.

nagarjuna.avula89
2 Sep 2011, 5:37 AM
Hi x0ner can u pls post the code for me ............


Thanx in advance

x0ner
2 Sep 2011, 6:06 AM
function process_search(type, value) {
Ext.Ajax.request({
url: 'controls/actions/search_by_type.php',
method: 'POST',
waitTitle: 'Connecting',
waitMsg: 'Getting data...',
params: {
'search_type': type,
'search_value': value
},

success: function(request) {
var obj = Ext.util.JSON.decode(request.responseText);
if (obj.results == null) {
Ext.Msg.alert('Results', 'No search results found!');
search_result_count = "0";
Ext.getCmp('search_results_bar').setText("Search results: " + search_result_count);
}
search_result_count = obj.total;
Ext.getCmp('search_results_bar').setText("Search results: " + search_result_count);
store.loadData(obj);
store.setBaseParam("search_type", type);
store.setBaseParam("search_value", value);
},
});
}

nagarjuna.avula89
4 Sep 2011, 8:14 PM
Hi x0ner Thank u very much for ur reply , but i am unable to use ur code because ....please find out my code and help me to perform pagination
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Automatic Searchfield Demo</title>
<script type="text/javascript" src="jquery.js"></script>
<script type='text/javascript' src='jquery.autocomplete.js'></script>
<link rel="stylesheet" type="text/css" href="jquery.autocomplete.css" />
<script type="text/javascript">
$(function() {
function formatForDisplay(doc) {
var name;
if (doc.threadid=doc.threadid)
{
name=doc.title;
}
else{
name=doc.name;
}
return name+" - "+doc.keywords;
}
$("#search").autocomplete( 'http://localhost:8983/solr/db/select/?wt=json&json.wrf=?&rows=200&df=keywords', {
dataType: "jsonp",
width: 200,
minChars: 1,
parse: function(data) {
return $.map(data.response.docs, function(doc) {
return {
data: doc,
result:doc.keywords
}
});
},
formatItem: function(doc) {
return formatForDisplay(doc);
}
}).result(function(e, doc) {
var mySelect = document.getElementById("type_of_search");
dropdown=mySelect.options[mySelect.selectedIndex].value;
if(dropdown==""){
dropdown="keywords";
}
$.getJSON("http://localhost:8983/solr/db/select/?q="+doc.keywords+"&wt=json&json.wrf=?&rows=200&df="+dropdown,function(data)
{
document.getElementById('content1').innerHTML="";
$.each(data.response.docs, function(i,data)
{
if (data.title=data.title)
{
data.name=data.title;
}
else{
data.name=data.name;
}
$("#content1").append("<hr>"
+"<a href="+data.url+">"+"<h4>"+"<B>"+data.name+"</B>"+"</h4>"+"</a><br/>"+data.description);
$('a').hover(function(){
$(this).addClass('linkstyle');
},
function(){
$(this).removeClass('linkstyle');
});


});
});
});
});
function getSearchResults(){
var mySelect = document.getElementById("type_of_search");
dropdown=mySelect.options[mySelect.selectedIndex].value;
if(dropdown==""){
dropdown="keywords";
}
$.getJSON("http://localhost:8983/solr/db/select/?q="+$("#search").val()+"&wt=json&json.wrf=?&rows=200&df="+dropdown,function(data)
{
document.getElementById('content1').innerHTML="";
$.each(data.response.docs, function(i,data)
{
if (data.title=data.title)
{
data.name=data.title;
}
else{
data.name=data.name;
}
$("#content1").append("<hr>"
+"<a href="+data.url+">"+"<h4>"+"<B>"+data.name+"</B>"+"</h4>"+"</a><br/>"+data.description);
$('a').hover(function(){
$(this).addClass('linkstyle');
},
function(){
$(this).removeClass('linkstyle');
});
});
});
}
</script>
<style>
.padding
{
color:grey;
font-size:13pt;
margin-top:20px;
padding-top:20px;
padding-left:100px;
padding-bottom:20px;
padding-right:100px;
alignment: left;
}
.linkstyle{
font-weight:bold;
color:black;
text-decoration: none;
}
</style>
</head>
<body>
<h1 id="banner">Automatic Searchfield Demo</h1>
<div id="content">
<form autocomplete="off">
<p>
<label>Enter Search Term Here:</label>
<input type="text" id="search" size="50"/>
<select name="type_of_search" id="type_of_search">
<option value="">SelectHere</option>
<option value="forums">Forums</option>
<option value="groups">Groups</option>
</select>
<input type="button" value="search" onClick="getSearchResults();"/>
</p>
</form>
</div>
<div id="content1" class="padding">
</div>
<script>
</script>
</body>
</html>
---------------------------------------------------------------------------------------------------------
this is how i am getting search results from my solr server and now i would like to perform pagination which will give 10 results in one page like that please help me....

Thank u in advance

x0ner
4 Sep 2011, 8:18 PM
Can you repost the main portion of the code that you need help with and within the code tags? Makes it much easier to troubleshoot. At first glance it looks like the reason my code didn't work is because you are using a different front-end library. You are using jQuery and this is an ExtJS forum. Head over to http://forum.jquery.com/ and post your question.

nagarjuna.avula89
4 Sep 2011, 8:28 PM
k x0ner here it is


<script type="text/javascript">
$(function() {
function formatForDisplay(doc) {
return name+" - "+doc.keywords;
}
$("#search").autocomplete( 'localhost:8983/solr/db/select/?wt=json&json.wrf=?&rows=200&df=keywords', {
dataType: "jsonp",
width: 200,
minChars: 1,
parse: function(data) {
return $.map(data.response.docs, function(doc) {
return {
data: doc,
result:doc.keywords
}
});
},
formatItem: function(doc) {
return formatForDisplay(doc);
}
}).result(function(e, doc) {
$.getJSON("localhost:8983/solr/db/select/?q="+doc.keywords+"&wt=json&json.wrf=?&rows=200&df="+dropdown,function(data)
{
document.getElementById('content1').innerHTML="";
$.each(data.response.docs, function(i,data)
{
if (data.title=data.title)
{
data.name=data.title;
}
else{
data.name=data.name;
}
$("#content1").append("<hr>"
+"<a href="+data.url+">"+"<h4>"+"<B>"+data.name+"</B>"+"</h4>"+"</a><br/>"+data.description);

});
});
});
});
function getSearchResults(){
var mySelect = document.getElementById("type_of_search");
dropdown=mySelect.options[mySelect.selectedIndex].value;
if(dropdown==""){
dropdown="keywords";
}
$.getJSON("localhost:8983/solr/db/select/?q="+$("#search").val()+"&wt=json&json.wrf=?&rows=200&df="+dropdown,function(data)
{
document.getElementById('content1').innerHTML="";
$.each(data.response.docs, function(i,data)
{
if (data.title=data.title)
{
data.name=data.title;
}
else{
data.name=data.name;
}
$("#content1").append("<hr>"
+"<a href="+data.url+">"+"<h4>"+"<B>"+data.name+"</B>"+"</h4>"+"</a><br/>"+data.description);
});
});
}
</script>
</head>
<body>
<div id="content">
<form autocomplete="off">
<p>
<label>Enter Search Term Here:</label>
<input type="text" id="search" size="50"/>
<select name="type_of_search" id="type_of_search">
<option value="">SelectHere</option>
<option value="forums">Forums</option>
<option value="groups">Groups</option>
</select>
<input type="button" value="search" onClick="getSearchResults();"/>
</p>
</form>
</div>
<div id="content1" class="padding">
</div>
<script>
</script>
</body>
</html>


i just developed an autocomplete search field and it is working fine ....when i enter any keyword which is in my database i will get the details related to tht keyword...the results may be more than 10 ....what i need to do is i should arrange 10 per page and for the remaing i need to go for otherpage