Clicking the buttonimage should go to search.php - php

Question

<script>
function loadXMLDoc() {
$("input[class=search]").bind("keyup",function(){
$.get("search.php?search="+$(this).val(),
function(data){
if(data==1) {
alert("this is valid search")
} else {
alert("this is a right user search");
}
}
);
});
}
</script>
Below is the button image code
<table width="165" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<img src="images/search_box_left_im.png" width="3" height="28" />
</td>
<td class="inputbox_bg" width="118px">
<input type="text" name="search" class="username">
</td>
<td>
<input type="image" onclick="loadXMLDoc()" src="images/search_go_btn.png" border="0" width="44" height="28" />
</td>
</tr>
</table>
It is going to the function but not executing the ajax code

Answer 1

Change this:
<script>
function loadXMLDoc()
{
$("input[class=search]").bind("keyup",function(){
$.get("search.php?search="+$(this).val(),function(data){
if(data==1){
alert("this is valid search")
}else{
alert("this is a right user search");
}
})
})
}
</script>
to this:
<script>
function loadXMLDoc()
{
$("input[name=search]").bind("keyup",function(){ //<- important bit here
$.get("search.php?search="+$(this).val(),function(data){
if(data==1){
alert("this is valid search")
}else{
alert("this is a right user search");
}
})
})
}
</script>

Answer 2

$(document).ready(function(){
$(".username").keyup(function(event){ //<- important bit here
$.get("search.php?search="+$(this).val(),function(data){
if(data==1){
alert("this is valid search")
}else{
alert("this is a right user search");
}
});
});
$('input[type=image]').click(function() {
$('.username').keyup();
});
});

Answer 3

Please try this:
<script>
function loadXMLDoc() {
$.ajax({
type: 'GET',
url: 'search.php?search='+$(".username").val(),
success: function(data){
if(data==1) {
alert("this is valid search")
} else {
alert("this is a right user search");
}
}
});
}
</script>

Answer 4

Your <input type="image" ... /> is a submit button for the form.
What you want to do is change its default behaviour (submitting form) to alternative - execute some code.
Here is a good question about this: event.preventDefault() vs. return false
Besides that, you are assigning an event listener twice - once in your <input onclick="" /> and second time inside the event handler $("input[class=search]").bind()
Try removing your <input onclick="" /> and define event listener in $(document).ready():
<script>
$(document).ready(function() {
$("input[class=search]").bind("keyup",function(e){
e.preventDefault();
$.get("search.php?search="+$(this).val(),function(data){
if(data==1){
alert("this is valid search")
}else{
alert("this is a right user search");
}
});
});
});
</script>
...
<input type="image" src="images/search_go_btn.png" border="0" width="44" height="28" />
...