asked on

perl: How to recive POSTed data from AJAX

I'm trying to "POST" data via jquery ajax to a back end perl script

If i change bellow method to GET it works

HTML

<html>
  <head>
    <title>TODO supply a title</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
         <script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
         <script>
           var url = "cgi-bin/form.pl?list=123,456,789&foo=bar";
           $(function() {
           $("#PostBtn").click(function(){
            $.ajax({
            url: url, 
            type:"POST",
            dataType:"text",
            success: function(data, textStatus, jQxHr) {
            
            $("#res").html(data);
            },
            });
              });
          });
         </script>
  </head>
  <body>
    <div><button id="PostBtn" value="Post btn">Post btn</button></div>
    <div id="res"></div>
  </body>
</html>

Open in new window

cgi-bin/form.pl

#!C:\strawberry\perl\bin\perl.exe
print "Content-type:text/html\n\n";

use CGI;
 my $query = CGI->new;

my @Names = $query->param;
my $list = $query->param('list');
my $foo = $query->param('foo');

<p>data $data</data>
print <<HTML;
  <h1>Hello Posts</h1>
HTML
foreach my $name (@Names)
  {
    print "<p>" . $name . "[ " . $q->param($name) . "]</p>";  
    
  }

Open in new window

How do I receive the parameters in perl?

vogen gurung

Hi Trevor1940,

I think, you should have POST to send data to perform save when clicked button and handle data(returned from backend) on success to show changes.

ASKER CERTIFIED SOLUTION

Julian Hansen

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

trevor1940

ASKER

Thanx
Can you remind me how to handle error's within the ajax function?
Not the back end script

Julian Hansen

What sort of errors?

There are server errors which can be hanlded with an AJAX callback (differs depending on jQuery version)
There are errors your script sends back (validation etc) = those you handle in the success (or .then()) callbacks.

trevor1940

ASKER

OK
I'm talking about the AJAX callback
Currently I'm stuck with jquery-1.6.2.js

The script is going to post back a validation message both pass or fail

Julian Hansen

Then you handle that in whatever way is necessary based on the data.

I usually send back a status as part of a JSON response

$.ajax({
   url: url,
   data: data,
   type: 'POST',
   dataType: 'JSON',
   success: function(resp) {
      // resp is a parsed JSON object
      if (resp.status) {
           // All went well
      }
      else   {
           alert(resp.error);
           // or, depending on your setup
           $('#error').html(resp.error);
      }
   }
})

Open in new window

In my server code I prepare a response object with a status field (set to true / false) along with any other data needed to communicate the error. On the client I either message box the error or more commonly, update an element (elements) on the screen with the error data.

trevor1940

ASKER

Hi
To test your method
I'm posting this back from the server

{"list":"123,456,789","foo":"bar"}

Open in new window

The alert box is showing undefined?

Julian Hansen

The alert box is showing undefined?

I don't think you understood my explanation.

When I send data back I construct an object that includes status and error as properties that I can test in the client

So taking your example - my script would send back

{
  "status": "true",
  "data" : {
    "list":"123,456,789",
    "foo":"bar"
  }
}

Open in new window

In the case of an error I would send back

{
  "status": "false",
  "error" : "My custom error message here"
}

Open in new window

Your server script needs to include something that can tell the client script whether the request was successful or not.

trevor1940

ASKER

Got it now Thanx

Julian Hansen

You are welcome.