Display search results dynamically as typing - c#

I am trying to build a SharePoint 2007 web part in Visual Studio.
This web part should search a sharepoint list and display the results.
What I want to accomplish is to display the results as soon as the user stops typing, so no clicking button involved.
Probably, a combination of text_changed event and onkeydown javascript?
Any thought would be great.
This sharepoint site is "Ajax-enabled", btw.
Thanks

I would suggest using jquery and keyup:
$("input#txtid").keyup(function () {
if (this.value.length < 8)
return false;
$.get("ServiceUrl", { arg: this.value }, function (result) { $("#output").html(result); });
});

The easiest way to take care of the UI part is to use the AjaxToolkit AutoCompleteExtender se MOSS, AJAX and the AutoCompleteExtender then all you have to do is decide how you want the searching inside the web service to work

I approached this by using an UpdatePanel in my webpart. Then I added a Button (more on this later) and a TextBox to the UpdatePanel.
I also have a JavaScript class which handles all of the logic for submitting a query after the user has paused while typing their query. It contains the event handler for the onkeyup event which is attached to the TextBox:
t.Attributes.Add("onkeyup", "javascript:oSearchClass.KeyUpEventHandler(event);");
I used setTimeout and clearTimeout to handle when the class should call a SubmitQuery function.
When SubmitQuery() is called, it makes the TextBox read only (so the user can't type anything while it is querying) and then "clicks" the button using click(). Since you're using a normal Button, you can handle the Button.click event like normal to re-query the list and display results.
If you don't want your user to see the button, you can simply put it inside a span WebControl that is hidden.

Have a look at this sample, it adds 'search as you type' to the standard SharePoint search box.
Automatically add ‘Search As You Type’ to every SharePoint page using Infuser.

Related

onUploadComplete event of asyncFileUpload

how to display a btn after onUploadComplete event is executed? It's not coming now even I say btn.visible=true inside that event..
I read in one of the thread that this event happens asynchronously so we have to write javascript for it and call onClientUploadCompete.
But do anyone know how to do it withoiut writing javascript? please its urgent thanx in advance!
You've got two options - to execute client-side using JavaScript and AsyncFileUpload's OnClientUploadError and OnClientUploadComplete, or to handle the server-side UploadedComplete or UploadedFileError events fired by your AsyncFileUpload object.
If you choose client side, you can still include your Button as normal and include CSS for it to be display: none, which can be then altered in the JavaScript with something like the following:
$get(<%= AsyncFileUploaderInstanceName.ClientId %>).style.display = "block"
If you choose server side, you'll be able to refer to the .Visible property of whatever controls you like, and can alter them then. However, you'll have to update whatever UpdatePanel the button would be sitting in for the button to be rendered on the page.

Get text box value on .cs page in asp.net

I want to develop an application in asp.net with C#.
In that application there are one text box and one label.
I want the following functionality:
When I press any key in textbox then I should get this value on .cs page i.e; code behind. And from .cs page I want to add this value to the label.
The problem is that there is no keypress event for an asp textbox and if I take a html text box then I don't get its value on .cs page
How can I come out with this problem?
Because a keypress on a textbox is a client side event but you want to perform server-side processing you will need to use AJAX requests.
You may find the following useful:
AJAX Toolit
Using Jquery to call asp.net page methods
In asp.net the TextBox will have TextChanged event but you will need to enable post back for the button and the event will fire when you tab out of the TextBox.
For the task you want either use javascript or add a button and when this button is do what you want.
I don't think this is a good aproach in web app., In this way you will end with a lot of post-backs.
However, if you still want this functionality. Texbox has TextChanges event, and if you also change the textboxs's AutoPostBack property to true you will get something close, but you will still have to move a currsor.
But it is still a terible solution. Why don't you simply use a button that fires click event instead?
Alternative solution is to use Ajax or javaScript,..
You can simply create a JavaScript-Method for this.
Your Textbox:
<asp:TextBox ID="textBox" runat="server" onkeydown="onFilterTextChanged()">
</asp:TextBox>
Your JavaScript, do a TimeOut to not do this every 0,0001 secs.
function onFilterTextChanged() {
if (timeoutID)
window.clearTimeout(timeoutID);
timeoutID = window.setTimeout(updateFilterText, 600);
}
Send the Values to the CodeBehind, textis your TextBox-Text.
function updateFilterText() {
var text = document.getElementById("<%=textBox.ClientID %>").value;
__doPostBack("<%=textBox.ClientID%>", "CommandArg" + text);
}
You won't need to do as many PostBacks as with the native TextChanged-Event and you can simply use this e.g. for Auto-Extender-Plugins. Pack the TextBox into an UpdatePanel and you're good to go!
Unless of course you do not NEED to go back to the server, in which case just set the labeltext in updateFilterText.

Posting Back with javascript/jQuery

I have a keyboard-controlled menu which I did with jquery (When I press down, it marks second option and so on...)
But after I select the option I need, I want to click enter to call the button's OnClick method as if the user really clicked it. Which means I have to do a postback.
how do I do that?
Just call __doPostaBack function. Here some references:
Doing or Raising Postback using __doPostBack() function from Javascript in Asp.Net
Easily refresh an UpdatePanel, using JavaScript
As #jondavidjohn said, you can use the click() method. Otherwise, you can use
__doPostBack("<control unique ID>", "<command name/arg appended>");
Pass in the unique ID of the control, not the client ID, and the second param is the command name. If you also need the arg, you append it to the command name with a separator like $ or :.
You can check that this happens by doing the following:
Request.Form.Get("__EVENTTARGET") == button.UniqueID
This method essentially sets the __EVENTTARGET and __EVENTARGUMENT form fields.
HTH.
You can trigger click events by calling .click() with no params..
$('button').click() //<-- calls any attached click event.

URL and Query management Asp.Net C#

Ok so while back I asked question Beginner ASP.net question handling url link
I wanted to handle case like this www.blah.com/blah.aspx?day=12&flow=true
I got my answer string r_flag = Request.QueryString["day"];
Then what I did is placed a code in Page_Load()
that basically takes these parameters and if they are not NULL, meaning that they were part of URL.
I filter results based on these parameters.
It works GREAT, happy times.... Except it does not work anymore once you try to go to the link using some other filter.
I have drop down box that allows you to select filters.
I have a button that once clicked should update these selections.
The problem is that Page_Load is called prior to Button_Clicked function and therefore I stay on the same page.
Any ideas how to handle this case.
Once again in case above was confusing.
So I can control behavior of my website by using URL, which I parse in Page_Load()
and using controls that are on the page.
If there is no query in URL it works great (controls) if there is it overrides controls.
Essentially I am trying to find a way how to ignore parsing of url when requests comes from clicking Generate button on the page.
Maybe you can put your querystring parsing code into IsPostBack control if Generate button is the control that only postbacks at your page.
if (!IsPostBack)
{
string r_flag = Request.QueryString["day"];
}
As an alternative way, at client side you can set a hidden field whenever user clicks the Generate button, then you can get it's value to determine if the user clicked the Generate button and then put your logic there.

c# Ajax Lazy Loading

I need to populate 4 GridViews on an aspx page, but I only bind a datatable to one of them on page load. I need to pupulate the other 3 after page load.
does anyone know the best way to do this using ajax ?
Currently I'm using javascript to __doPostBack on a button that pupulates the 3 GridViews but unfortunately this forces a full page load even when using an update panel. I need the page to load, and then populate the GridViews as the datatables are returned.
any suggestions would be much apreciated.
The way you are doing it should work ok, although using jquery to populate a div via the $("#targetDiv").load("contentUrl"); function may be a cleaner way to do it. Anyway, in order to get your current implementation working, there could be a few things you want to look at:
I assume EnablePartialRendering is true on your ScriptManager (always worth checking!).
Make sure the eventTarget for the __dopostback call is set up as an async trigger for your update panels or that it is inside the UpdatePanel if you are only using one UpdatePanel. (See here for details)
Try returning false from the javascript code that executes in the onclick event handler if you have attached this to a button, to make sure the form is not being submitted normally by your browser when you click the button.
If I understand the question properly, you want the data to load after the page is in the browser. If this is the case, then you can fire an event with JavaScript when the page loads on the client.
One method I've used is to put a hidden (with CSS, not any property) button on the page and 'clicking' it with javascript. The event of the button click event will need to be wired in the page's code. Also the button would have to be in an update panel that either contains the grids you want to be bound or has the appropriate triggers to cause them to reload.
You might look at JQuery to get manage when this code gets fired. The $(document).ready(function(){ /* Your code here... */ }); method will fire after the entire DOM is available, which is faster than waiting on the entire page to load (images and so forth).

Categories

Resources