I have a mvc3 application. and on one page i have a textbox that will allow a user to search for a client, now i am struggling with some functionality, as i am a windows form and widows phone 8 developer. i want this text box i have here to execute as i press enter, i have a button that the user can click on to search, but i know most users just click enter! i am using JavaScript to hit function!
Html for button and textbox:
<td>
<input value="Search..." id="SearchText" style="color:GrayText" onchange="SearchText" onfocus="javascript:this.value=''" onblur="javascript: if(this.value==''){this.value='Search...';}" />
<input id="searchbutton" type="button" value="Search" class="button"/>
</td>
Here is the Javascript :
<script type="text/javascript">
$('#searchbutton').click(function(){
var client = document.getElementById('SearchText').value;
var textbox = document.getElementById('SearchText');
var edittext = ", is not available!";
var result = client + edittext;
if (textbox.value == 'Search...') {
alert('Please enter a Client Name to search for ');
textbox.focus();
}
else {
alert(result);
};
});
</script>
how would i get the textbox to also trigger the function as i hit enter on the textbox!
here is how it looks on the form :
very new to this kind of coding, any help will do!
thanks!
I have a mvc3 application. and on one page i have a textbox that will allow a user to search for a client, now i am struggling with some functionality, as i am a windows form and widows phone 8 developer. i want this text box i have here to execute as i press enter, i have a button that the user can click on to search, but i know most users just click enter! i am using JavaScript to hit function!
Html for button and textbox:
<td>
<input value="Search..." id="SearchText" style="color:GrayText" onchange="SearchText" onfocus="javascript:this.value=''" onblur="javascript: if(this.value==''){this.value='Search...';}" />
<input id="searchbutton" type="button" value="Search" class="button"/>
</td>
Here is the Javascript :
<script type="text/javascript">
$('#searchbutton').click(function(){
var client = document.getElementById('SearchText').value;
var textbox = document.getElementById('SearchText');
var edittext = ", is not available!";
var result = client + edittext;
if (textbox.value == 'Search...') {
alert('Please enter a Client Name to search for ');
textbox.focus();
}
else {
alert(result);
};
});
</script>
how would i get the textbox to also trigger the function as i hit enter on the textbox!
here is how it looks on the form :
very new to this kind of coding, any help will do!
thanks!
Share Improve this question asked Feb 28, 2013 at 13:21 ArrieArrie 1,3375 gold badges18 silver badges39 bronze badges4 Answers
Reset to default 2$('#searchbutton').click(search);
$('#SearchText').keypress(function(e){
var code = (e.keyCode ? e.keyCode : e.which);
if(code == 13) {
search()
}
});
function search(){
var client = document.getElementById('SearchText').value;
var textbox = document.getElementById('SearchText');
var edittext = ", is not available!";
var result = client + edittext;
if (textbox.value == 'Search...') {
alert('Please enter a Client Name to search for ');
textbox.focus();
}
else {
alert(result);
};
}
$('#SearchText').on('keypress', function(e){
var code = (e.keyCode ? e.keyCode : e.which);
if(code == 13) {
//write your code for search here..like searchbutton on click
}
});
I dont know the exact answer to your question but you could use a tabindex to press tab to jump to your button and then you can press enter to submit.
try this..
<input type="text" placeholder="Search" id="txtSearch" />
<input type="button" value="Search" id="btnsearch" onclick="return Search();" />
<script type="text/javascript">
$("#txtSearch").keyup(function (event) {
if (event.keyCode == 13) {
$("#btnsearch").click();
}
});
function Search(){
// do Something here.......
}
</script>