Want <asp:textbox> to postback only when Enter key is pressed

[Guest]

Hello All,

I have an ASP.NET page with one Textbox (SearchTextBox) and one ImageButton
(SearchButton) server controls. The user can type search text in
SearchTextBox and click SearchButton and the web server performs a database
query and displays the results. All of this works fine.

I want the user to be able to press the Enter key while the cursor is still
in SearchTextBox and have the SearchButton.Click event fire (thus performing
the database query and displaying the results). I have
SearchTextBox.AutoPostBack = False because I don't want the page to repost
everytime the user types something; I just want it to query the database adn
display teh results when the user presses the Enter key.

I've thought about using AddHandler SearchTextBox.TextChanged, AddressOf
HandleEnterKey

using the private sub
Private Sub HandleEnterKey()
If EnterKeyPressed Then
SearchButton_Click(SearchtextBox, e)
End If
End Sub

but I don't know what EventArgs to pass in for the parameter, e.

Does anyone know how to make this happen? Does anyone have any other ideas?

TIA,

 

[Guest]

Let's assume you have a TextBox with id="TextBox1" and a button with
id="btnSearch"
<asp:TextBox ID="txtSearch" onclick="fnTrapKD('btnSearch');" Runat=server

</asp:TextBox>

<asp:Button ID="btnSearch" Runat=server Text="search"></asp:Button>

then add a Javascript snippet in your aspx page like this:

<script language="javascript">
function fnTrapKD(btnName){
var btn = document.getElementById(btnName);
if (event.keyCode == 13)
{
event.returnValue=false;
event.cancel = true;
btn.click();
}
}

</script>

and handle the btnSearch Onclick event on the server side as normal for your
search function:
Private Sub btnSearch_Click(ByVal sender As System.Object, ByVal e As
System.EventArgs) Handles btnSearch.Click
'implement the database search
End Sub

 

[Guest]

Well, What I would do is

Just create an independed function to do the search

Seach(string TexBoxValue)
{
// code to perform Search on DB and display results here
}

Call this fucntion from your Serch Button click event.

SearchButton_Click ()
{
Seach(TexBoxName.text)
}

When Enter Key is pressed have a hidden control [or a textbox webcontrol
with size 0] and set some value, say "ENTERPRESSED" [to distinguish that an
enter key and do a search]

In the page_Load fucntion

Page_Load()
{
if(Request.Forms["HiddenControlName"].Value = "ENTERPRESSED")
Seach(TexBoxName.text)
}

HTH

 

[Guest]

Phillip,

Thank you. I'm 95% there. If the box is populated, this works fine. If it
isn't populated, the Click event never fires. This means that an error
message is never displayed. Please see the code below. lblSearchMsg
displays an error message that asks the user to enter some text to search for.

Also, I tried something similar using the cancelBubble property of the event
object and it didn't work. Is cancel the same as cancelBubble ?

Thank you,

/////////////////////////////////////////
Code for SearchButton click event
/////////////////////////////////////////
*********************************************
Private Sub SearchButton_Click(ByVal sender As System.Object, ByVal e As
System.Web.UI.ImageClickEventArgs) _
Handles SearchButton.Click

If Search.Text.Length = 0 Then
hdnSearchText.Value = String.Empty
If hdnSelectedCategory.Value.Length = 0 Then
lblSearchMsg.Visible = True
Else
lblSearchMsg.Visible = False
PopulateClaimFormsDataGrid(hdnSortField.Value,
hdnSortOrder.Value)
End If
Else
hdnSearchText.Value = Search.Text
lblSearchMsg.Visible = False
PopulateClaimFormsDataGrid(hdnSortField.Value, hdnSortOrder.Value)
End If
End Sub

*********************************************

 

[Guest]

Phillip,

Thank you. I'm 95% there. If the box is populated, this works fine. If it
isn't populated, the Click event never fires. This means that an error
message is never displayed. Please see the code below. lblSearchMsg
displays an error message that asks the user to enter some text to search for.

By looking at your code, you display the error message depending on the
hdnSelectedCategory.Value being not empty. If you want to simply display the
error message when there is not a search text:

If Search.Text.Trim.Equals("") Then
lblSearchMsg.Visible = True
Else
lblSearchMsg.Visible = False
End If

Also, I tried something similar using the cancelBubble property of the event
object and it didn't work. Is cancel the same as cancelBubble ?

Actually cancelBubble is the correct property name. I am glad you got it to
work because I hastily made 2 errors in the previous response:
- event.cancel should have been event.cancelBubble
- onclick in the TextBox control should have been onKeyDown

This should work correctly

Phillip

 

[Guest]

Phillip,

I figured out why the event wasn't firing when the box was empty, though I
do still have a couple of other questions:

Why use an onclick event instead of an onkeypress event?

The SearchButton.Click event fires twice. This is confusing to me since I
only call it once. Any idea why this happens?

Thanks again.

 

[Guest]

For what it's worth, the error message being displayed does depend on whether
the hdnSelectedCategory is populated. This is business logic.

I changed onClick to onKeyPress and it works fine. Is there any advantage
to using onKeyDown?

I still don't understand why the SearchButton click event fires twice. Any
ideas?

 

[Guest]

Phillip,

After I changed cancel to cancelBubble, the double post back stopped. What
I still don't underatdn is where was the second postback coming from? Is
there a page level event that occurs whenever a button or image button is
clicked?

Thanks,

 

[Guest]

For what it's worth, the error message being displayed does depend on whether
the hdnSelectedCategory is populated. This is business logic.

I changed onClick to onKeyPress and it works fine. Is there any advantage
to using onKeyDown?

No. Both work equally the same for me in this situation. It is just how i
designed the search on the City of North Vancouver website
http://www.cnv.org/ and it worked for me.

I still don't understand why the SearchButton click event fires twice. Any
ideas?

I read your other posting where you mentioned that by replacing event.cancel
by event.cancelBubble it stopped. I assume then that if it worked for you
when you used the onclick event then it means that the search button is
your default button to submit the form.

Phillip

 

[Guest]

I could understand the button being the default button for a windows form,
but I don't see anything that would indicate that this is a default button
for this web form....

I don't follow. Is there a default button for a web form? How do I declare
which button is the default and how do I determine if the SearchButton is the
default button?

Thanks,

 

[Guest]

I have put this sample quickly together
http://www.societopia.net/Samples/asppage_buttons.aspx to help understanding
how to make a button default to a webpage and how to assign each section
within a page associated with a specific submit button.

 

[Guest]

Thank you.