Re: Post from jQuery to Perl - can't access parameters

in reply to Post from jQuery to Perl - can't access parameters

Hi stuckdev,

Here's a fairly simple example that should do the basics of what you want:

#!/usr/bin/perl -w

###############
## Libraries ##
###############
use strict;
use warnings;
use CGI;
use CGI::Carp qw{ fatalsToBrowser };
use JSON;


##################
## User-defined ##
##################
my $jquery = "//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.
+js";


##################
## Main program ##
##################
my $query = new CGI;
my $url   = $query->url;

my $txt_content = $query->param("txt_content") || "";
if ($txt_content) {
    handle_server_side_ajax($txt_content);
    exit;
}

print_html();


#################
## Subroutines ##
#################
sub handle_server_side_ajax {
    my ($text) = @_;

    print "Content-type:  application/json\n\n";

    # Do something with $text ...
    my $result = "You said '$text'";
    my $time   = localtime(time());

    my $h_json = { 'result' => $result, 'time' => $time };

    my $output = to_json($h_json);
    print $output;
}


sub print_html {
    print "Content-type:  text/html\n\n";

    print qq{
        <script src="$jquery" type="text/javascript"></script>
        <script type="text/javascript">
            var J = jQuery.noConflict();

            function ajax_text() {
                var input = J('#text_input').val();
                J.ajax({
                  url:      "$url",
                  cache:    false,
                  dataType: 'json',
                  data:     { txt_content: input },
                  success:  function(json) {
                    handle_ajax_output(json);
                  }
                });
            }

            function handle_ajax_output(json) {
              var result = json.result;
              var time   = json.time;
              var text   = "<br>Time: " + time + " &nbsp; Result: " + 
+result;
              J('#html_result').append(text);
            }
        </script>

        <body style="background:cyan">
            <h2>JQuery Example</h2>

            <br>Enter Text and click Submit
            <br>
              <input id="text_input">
              <input type="button" value="Submit" onclick="ajax_text()
+">

            <br><br>
               <h5>Ajax Results Below</h5>
               <pre id="html_result" style="background:#ffef9f">
               </pre>
        </body>
    };
}
[download]

Note that I used "var J = jQuery.noConflict();" so that I could type:

    var input = J('#text_input').val();
[download]

without having to escape the usual '$' variable of jQuery. Otherwise I'd have had to do:

    var input = \$('#text_input').val();
[download]

My guess is that you were getting a blank page because you didn't print the headers properly. For the server-side ajax, you need to at least print something like:

    print "Content-type:  text/html\n\n";
[download]

Or, what I usually use:

    print "Content-type:  application/json\n\n";
[download]

If you have access to your httpd logs (for example, in Linux they might be in "/var/log/httpd"), take a look at "access_log" (to see if the server-side code was called), and "error_log" (to see whether there were problems).

By the way, you don't have to use jQuery to do what you're trying to do, but it does make it a lot easier (especially things like Ajax, which are greatly simplified by jQuery).

Let me know if you have any questions about my code, and I'll be happy to elaborate further.

say substr+lc crypt(qw $i3 SI$),4,5

In Section Seekers of Perl Wisdom