如何从javascript向Web服务发送GET请求

Question

I have an html form of which has an onClick attribute on it's button, that then calls a javascript function:

function submitForm () {

    // Get Session ID
    var sessionId = document.getElementById("session-id").value;

    // Get Description
    var description = document.getElementById("description").value;

    // Call WebService ??   

}

At this stage I have to call a webservice at this URL:

localhost:8080/PatientRefund/WebService?urnId=93&batchDescription=My%20Description

Where you can replace '93' with 'sessionId' and 'My%20Description' with 'batchDescription'. Also the request should be a GET request.

Can anyone just point me in the right direction? I'm not looking for you to write the code for me... Thanks guys :)

Answer 1

Using jQuery ajax, your code will be like:

function submitForm () {
    var sessionId = document.getElementById("session-id").value;
    var description = document.getElementById("description").value;

    $.ajax({
        url: 'http://localhost:8080/PatientRefund/WebService',
        type: 'GET',
        data: {urnId: sessionId, batchDescription: description}
    }).done(function(response) {
        console.log(response);
        // do something with your response
    });
}

If you want the clients to download a file after submit, you should not use ajax request. You should create a form dynamically and submit it. Example code:

function submitForm() {
    var sessionId = document.getElementById("session-id").value;
    var description = document.getElementById("description").value;
    var newForm = jQuery('<form>', {
        'action': 'http://localhost:8080/PatientRefund/WebService',
        'method': 'GET',
        'target': '_top'
    }).append(jQuery('<input>', {
        'name': 'urnId',
        'value': sessionId,
        'type': 'hidden'
    })).append(jQuery('<input>', {
        'name': 'batchDescription',
        'value': description,
        'type': 'hidden'
    }));
    newForm.submit();
    return false;
}