Clicking the buttonimage should go to search.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

score 1 · Answer 1 · answered Oct 03 '12 at 08:17

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>

answered Oct 03 '12 at 08:17

Lucas Green

3,951
22
27

Lucas it is not working , i kept a alert message in the javascript but alert is working not going to search.php – Siva Shanker Oct 03 '12 at 08:23
use `console.log(data)` to inspect the data to find out why – Lucas Green Oct 03 '12 at 08:25
I am not a specialist in developing the ajax code just i copied it somewhere. Pls help me so that i can able to move forward. – Siva Shanker Oct 03 '12 at 08:27

score 0 · Answer 2 · answered Oct 03 '12 at 08:51

$(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();
});
});

score 0 · Answer 3 · answered Oct 03 '12 at 08:54

0

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>

answered Oct 03 '12 at 08:54

suresh gopal

3,138
6
27
58

Suresh the function is stopping here only $.ajax({ – Siva Shanker Oct 03 '12 at 09:00

score 0 · Answer 4 · edited May 23 '17 at 11:56

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" />
...

Clicking the buttonimage should go to search.php

4 Answers4