Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

Capturing keystroke in asp.net TextBox

Posted on 2014-01-28
4
Medium Priority
?
672 Views
Last Modified: 2014-01-29
Hi Experts,

I have a datalist displayed in an update panel which I would like to respond to each keystroke made in a textbox. The textbox is acting as a search box.

I realise that I can use an OnTextChanged event but this doesn't postback until the focus leaves the textbox. In most cases 2 to 3 characters will be sufficient to get the user what they want, but if I can't show this in real-time on their screen so that they can see their search narrowing in, they will continue to type out a full word on every search.
So if possible I'd like to postback on each keystoke so that the datalist is refining the results in the most dynamic way possible...

I have been experimenting with a tiny piece of Javascript that I found online but I need a little expert help to fine tune. This is the code I have:
<script type="text/javascript">
       function RefreshUpdatePanel() {
           __doPostBack('<%= TxtSearch.ClientID %>', '');
    };
</script>

Open in new window

<asp:TextBox ID="TxtSearch" AutoPostBack="true" onkeyup="RefreshUpdatePanel();" OnTextChanged="TxtSearch_TextChanged" runat="server"></asp:TextBox>

Open in new window


I also have focus set in the page_load event
TxtSearch.Focus();

Open in new window


which I would like to preserve if I can - currently this is problematic when combined with keystroke postback as it resets the cursor to the left of the textbox - so if I have typed 'a' the page posts back the cursor moves left I type my next letter lets say 'b' but what I end up with is 'ba' not 'ab' as intended. So I think part of my problem is I am posting back the whole page whereas I only want to post back my update panel.
I'm not very experienced in AJAX Javascript so much fumbling around, would appreciate some guidance from the pros.

Many thanks in advance
0
Comment
Question by:forsters
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
  • 2
4 Comments
 
LVL 4

Accepted Solution

by:
Hiran Desai earned 2000 total points
ID: 39814946
I'll rather appreciate of using such thing like as below...
http://jqueryui.com/autocomplete/

Open in new window



The problem with Ajax toolkit is when update panel returns HTML back from server, It'll replace the existing which causes focus lost.

Though there's way to handle such thing but there's again question of browser compablity( IE by default handles this where in chrome and firefox one needs to code broeser specific script to handle focus for update panel.)

You can have a button(which is not visible and onclick of that button you can post your search text to server. in response to that server will return the HTML/ more appropriate would be JSON data).
Which you can use for obtaining the required functionality.

Let know if more help required ;)
0
 

Author Comment

by:forsters
ID: 39814995
Hi ItWorked,

Thanks for your advice, I think its the Javascript I am using that's posting back the textbox in order to register the keystrokes...the box sits outside of the update panel so should be unaffected by that updating...but because I have TxtSearch.Focus() in the page-Load each postback resets the focus - if I change that and nest it inside if (!IsPostBack) then after each keystroke I lose the focus - so I suppose what I'm trying to do is postback from the textbox with out interrupting the flow of data-entry to that textbox - its starting to sound impossible...catch22...no?

I like the jquery autocomplete function -I will look at that, it isn't quite what I was after but it would be a close second. Do you by chance know if/how I can bind that to a sql generated list -rather than hard-code the array?
This will be IE only so I'm not worried about browser compatibility in this case.

Many thanks for your help
0
 
LVL 4

Assisted Solution

by:Hiran Desai
Hiran Desai earned 2000 total points
ID: 39816870
It's seems to be what I understand.
TxtSearch.Focus()

Open in new window

only brings focus.(It's not intelligent that it'll bring focus to your last entered character.

Yes, It's possible to have a Jquery Auto complete  from SQL Server.
For that you can search for
1) How to create [WebMethod] in Webpage(Not WebService).
2) How to consume same from jQuery
3) This is what you need I guess

Let us know if you need more information.
0
 

Author Comment

by:forsters
ID: 39817252
Hmm yes I think I was asking the impossible :(

Ok well thanks for the JQuery tips I will have a look at that instead

Many thanks
0

Featured Post

Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

The Confluence of Individual Knowledge and the Collective Intelligence At this writing (summer 2013) the term API (http://dictionary.reference.com/browse/API?s=t) has made its way into the popular lexicon of the English language.  A few years ago, …
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

650 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question