HTTP GET request with JQuery

Question

First of all, I am VERY new with JS so sorry for the simple question. I have a search box in a webpage which the user should type some input into it. After that, I need to perform a HTTP GET request to some address (say: http://m.mywebsite.com/AppService.svc/searchitems?param=userValue when the param parameter is the user input (in the below sample it is John Doe). So far I tried with this way, but nothings happen when I click somewhere in the webpage. Hope some of you can explain me how to do it right.

Thanks

$(document).ready(function(){

    document.addEventListener("click", function(e) {
        $.ajax({
            'url' : 'http://m.mywebsite.com/AppService.svc/searchitems',
            'type' : 'GET',
            'data' : {
                'param' : 'John Doe'
            },
            'success' : function(data) {
                if (data == "success") {
                    alert('request sent!');
                }
            }
        });
    });
});

Answer 1

I think you can't use addEventListener() function with document object. You should use something like that:

document.getElementById("myBtn").addEventListener("click", function(){
    document.getElementById("demo").innerHTML = "Hello World";
});

from here

Answer 2

this works (if the 'url' is correct and accept GET requests). The url you are using should receive GET requests and answer something (in this case, "success" if "param" is passed), check it before proceeding.

$(document).ready(function() {
    $(document).click(function() {
        $.ajax({
            url : 'http://m.mywebsite.com/AppService.svc/searchitems',
            type : 'GET',
            data : { param : 'John Doe' }
        }).done(function(data) {
            if (data == "success") alert('request sent!');
        });
    });
});