tiny_monk has asked for the wisdom of the Perl Monks concerning the following question:

I am very sorry. My text editor is behaving strangely today. I don't know where those back ticks came from. I'm sorry for the inconvenience. My PSGI code goes like this: 


#!/usr/bin/perl
use strict;
use warnings;

use Plack::Request;
use Plack::Response;
use Plack::Builder;

my %router = (

    '/'        =>    \&beverage,
    '/ajax'      =>    \&fruit_juice

);


my $app = sub {

    my $env = shift;
    my $request = Plack::Request->new($env);
    my $route = $router{$request->path_info};
    if ($route) {
        return $route->($env);
    }
    else
    {
        return [
            '404',
            [ 'Content-Type' => 'text/html' ],
            [ '404 Not Found' ],
            ];
    }

};



sub beverage {

    return [
        200, 
        ['Content-Type' => 'text/html'],
        ['<html>
          <head>
         <script type='text/javascript' src='/static/javascript.js'></
+script>
         </head>
         <body>
        <p>Beverage</p>
    <select name='beverage' id='beverages' onchange='get_choices()'>
    <option value='Alcholic'>Alcoholic</option>
    <option value='Non-alcoholic'>Non-alcoholic</option>
    </select>
    
    <p>Choices</p>
    <select id='choices'>
    <option value='Beer'>Beer</option>
    <option value='Red Wine'>Red Wine</option>
    </select>
        </body>
        </html>']
    ];    

};


sub fruit_juice {

    my $env = shift;
    my $request = Plack::Request->new($env);
    my $beverage = $request->param('beverage'); 
    
    my $response = Plack::Response->new(200); # new Plack::Response
    if ($beverage eq 'Non-alcoholic') 
    {
    $response->headers({ 'Content-Type' => 'text/html' });
    $response->content("<option value='Orange Juice'>Orage Juice</opti
+on>
          <option value='Grape juice'>Grape Juice</option>");
    return $response->finalize;
    }
};

builder {
    # serve static files
    enable 'Static', path => sub { s!^/static/!! }, root => '/Library/
+WebServer/Documents';
    $app;
};

[download]

My Javascript-AJAX code goes something like this.


function get_choices() 
    { 
        var xmlhttp;
        if (window.XMLHttpRequest) {xmlhttp = new XMLHttpRequest();}  
        else {xmlhttp=new ActiveXObject('Microsoft.XMLHTTP');}      
        var x = document.getElementById(‘beverages’).value;
        var z = ‘beverage=' + x;
        xmlhttp.open('POST’,'/ajax',true);
        xmlhttp.send(z); 
        xmlhttp.onreadystatechange=function() { 
        if (xmlhttp.readyState==4 && xmlhttp.status==200){document.get
+ElementById(‘choices’).innerHTML=xmlhttp.responseText;}}
    }

[download]

What I am hoping to accomplish is to be able to populate the Choices dropdown menu with a new set of options (in this case, types of fruit juice) upon selecting 'Non-alcoholic' on the Beverage dropdown menu by invoking the fruit_juice subroutine asynchronously via AJAX. For some reason unknown to me, I couldn't make it work. I am sure I'm missing something but I don't know what it is. I'd be very much obliged if you could help me out on this problem. Thank you

Replies are listed 'Best First'.
Re: AJAX and PSGI/Plack (jquery)
by Anonymous Monk on Sep 07, 2015 at 08:47 UTC
[reply]
Re: AJAX and PSGI/Plack
by Anonymous Monk on Sep 07, 2015 at 08:05 UTC
[reply]
[d/l]
Re: AJAX and PSGI/Plack
by Anonymous Monk on Sep 07, 2015 at 07:58 UTC

    ... ‘beverage’ ‘beverage’ ‘’ ‘’ ‘’ ‘’ ‘’ ‘’ ‘’ ‘’ ‘’ ‘’

    IIRC html doesn't like those characters

[reply]
A reply falls below the community's threshold of quality. You may see it by logging in.

Back to Seekers of Perl Wisdom