Dren
Dren

Reputation: 319

How do I pass a html form variable to a perl script via AJAX?

I am trying to pass the html variable from the list menu to the perl script via POST but what happens is that the jQuery ajax() was able to execute the perl without including the value got from the document.getElementById. Here is my HTML code:

<form id="form">
    <p id="survey">
        <label for="list"><b>Ran survey</b></label>
    </p>
    <p>
        <label for="division">Please select division:</label>
            <select type="list" id="list" name="division">
                <option>--Select One--</option>
                <option value="DENVER">Denver</option>
                <option value="PHOENIX_SOUTHWEST">Phoenix-Southwest</option>
                <option value="PORTLAND">Portland</option>
                <option value="SOUTHERN_HOUSTON">Southern-Houston</option>
                <option value="NORCAL">Norcal</option>
                <option value="SEATTLE">Seattle</option>
                <option value="VONS_SoCal">Vons-Socal</option>
                <option value="EASTERN">Eastern</option>
            </select>
        </p>
        <p id="survey">
            <input type="submit" value="Ran Survey" onclick="surveyFunction();" />
        </p>
    </form>
function surveyFunction() {
    var div = document.getElementById("list").value;
    $.ajax({
        type: "POST",
        url: "possurv.pl",
        data: div,
        success: function(result){
            $('#survfeedback').html(result);
        }
    });
}

Upvotes: 1

Views: 193

Answers (1)

Rory McCrossan
Rory McCrossan

Reputation: 337560

You need to include the parameter name in the querystring to assign the value to. I assume this should follow the standard practice of being the name of the control. In this case you can either build the querystring yourself:

data: 'division=' + encodeURIComponent(div),

Or you can send an object and let jQuery serialise it to a querystring for you:

data: { division: div },

Upvotes: 2

Related Questions