ajax pass parameters to python script

Question

I have this python CGI script that I got up and running using following command:

python3 -m http.server --cgi 8000

important part of the python script is this:

parameter = cgi.FieldStorage()
artiest = parameter.getvalue("artiest")
rijen_aantal = parameter.getvalue("rijen")
kolommen_aantal = parameter.getvalue("kolommen")

Now what I would like to do is in my html/javascript I would like to pass the values I am getting from a form to my cgi script.

In html i have written the following form using bootstrap:

<form class="form-inline" role="form" method="POST" action="cgi-bin/schuifpuzzel.py">
<div class="form-group">
    <label for="artiest">Artiest:</label>
    <input type="text" class="form-control margin-right" id="artiest">
</div>
<div class="form-group">
    <label for="rij">Rijen:</label>
    <input type="number" class="form-control margin-right" id="rij">
</div>
<div class="form-group">
    <label for="kolom">Kolommen:</label>
    <input type="number" class="form-control margin-right" id="kolom">
</div>
<button type="submit" class="btn btn-default">Submit</button>

And in javascript I have written following code that I am calling in the html header.

$(function () {

var artiest = document.getElementById("myForm").elements[0].value;
var rijen = document.getElementById("myForm").elements[1].value;
var kolommen = document.getElementById("myForm").elements[2].value;
$.ajax({
    url: 'cgi-bin/schuifpuzzel.py',
    type: 'post',
    datatype: "json",
    data: JSON.stringify({'artiest': artiest, "rijen": rijen, "kolommen": kolommen}),
    success: function(response) {
        alert(response);
    }
})

});

but this is for some reason not working. All it does is download the .py.

What am I doing wrong here?

UPDATE:

new problem. I think the posting problem is kind of solved.

But then I was getting following error:

No 'Access-Control-Allow-Origin' header is present on the requested resource

I have solved that by using the solution posted by yoshyosh on this post

But now I am getting this error for some reason:

I am not sure why because the path to my script is correct?

I think the problem is that the data your AJAX call is sending is JSON, not form encoded key-value pairs. The way you are accessing the values in your CGI script requires the data to be sent as form encoded key-value pairs. — ErikR
– ErikR, Commented May 7, 2016 at 14:56
So how would I do that exactly? Because I just kind of copied the solution to a similar question — Joey
– Joey, Commented May 7, 2016 at 14:58

C14L · Accepted Answer · 2016-05-07 16:03:19Z

1

Use .serialize() on your form to send the data as formdata, not as JSON.

$.ajax({
    ...
    data: $('.form-inline').serialize(),
    ...
})

answered May 7, 2016 at 16:03

C14L

12.6k4 gold badges43 silver badges53 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

ajax pass parameters to python script

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related