Loop function in Javascript fails when combined with perl array

[ash1351]

Hi, I am taking backend perl variables and using it at the front end for display. Here is the code. head1 and head2 are the header names taken from perl script. I use that and display those headers of grid on webpage.

  
    var headname1= "@head1";
    var headname2= "@head2";

Now, if there are 100 headers, i would have to assign variables 100 times separately. so its better to make it dynamic. Taking values from backend and assigning it to javascript variable. This task will be dynamic. Here is my attempted code for that. I hav taken all the headers from backend and assigned it to line_array. @line_arry is the name of that array. If i do @line_arry[0] and so on. appropriate values will be displyaed.

    var headname=[];
    
    for(var i=0;i<total_columns;i++) {
        headname[i+1]= "@line_arry[(i)]";
    }

This code doesnot work. It displays only the first column. i.e.

     headname[1] = "Order";
     headname[2] = "Order";

Order is the name of the first header. In headname2, header of second column should be displayed. but it still displays "Order" If i write the below code, it displays first and second header.

     headname[i+1]= "@line_arry[(0)]";
    headname[i+1]= "@line_arry[(1)]"; 

    "@line_arry[i]" doesnt work whereas 
    "@line_arry[0], @line_arry[1] works.

Can anyone suggeest why it is not performing looping action using variable i

[jeffa]

"Now, if there are 100 headers, i would have to assign variables 100 times separately. so its better to make it dynamic. "

I recommend a hybrid solution that dynamically creates static Javascript:

use strict;
use warnings;
use Mojolicious::Lite;

get '/' => sub {
    my $c = shift;
    my @array = qw( foo bar baz qux );
    $c->stash( vars => \@array );
    $c->render( template => 'js', format => 'html' );
};

app->start;

__DATA__
@@ js.html.ep
<script>
<% for ( 0 .. $#$vars) { %>
var headname<%= $_ + 1 %> = "<%= $vars->[$_] %>";
<% } %>
</script>

Yields:

<script>

var headname1 = "foo";

var headname2 = "bar";

var headname3 = "baz";

var headname4 = "qux";

</script>

UPDATE: Better yet would be to shove them all into a Javascript array:

use strict;
use warnings;
use Mojolicious::Lite;

get '/' => sub {
    my $c = shift;
    my @array = map "'$_'", qw( foo bar baz qux );
    $c->stash( vars => \@array );
    {
        local $" = ', ';
        $c->render( template => 'js', format => 'html' );
    }
};

app->start;

__DATA__
@@ js.html.ep
<script>
var headname = <%== "[@$vars]" %>;
alert( headname );
</script>

[Anonymous Monk]

Hi friend, Mojo::JSON is core mojo and provides an encode_json , so

#!/usr/bin/perl --
use Mojolicious::Lite;
use Mojo::JSON qw/ /;
get '/' => sub {
    my $c = shift;
    my @array = ( 'hi', [ qw/ ro sham bo /], 'bye', );
    $c->stash( vars => \@array );
    $c->render( template => 'hello', format => 'html' );
};
app->start;
__DATA__

@@ hello.html.ep
<script>
var headname = <%== Mojo::JSON::encode_json( $vars ) %>;
alert( headname[0] );
</script>

__END__
no more templates no more books this is how you run it and what you ge
+t
$ perl mojo-hello-mojo-json.pl get /
[Wed Aug 26 16:55:06 2015] [debug] Your secret passphrase needs to be 
+changed
[Wed Aug 26 16:55:06 2015] [debug] GET "/"
[Wed Aug 26 16:55:06 2015] [debug] Routing to a callback
[Wed Aug 26 16:55:06 2015] [debug] Rendering template "hello.html.ep" 
+from DATA section
[Wed Aug 26 16:55:06 2015] [debug] 200 OK (0.004393s, 227.635/s)
<script>
var headname = ["hi",["ro","sham","bo"],"bye"];
alert( headname[0] );
</script>

[philipbailey]

Where are the fragments of code you show running? In a CGI script? In a template? In a static page? The short answer is that you can't mix and match languages quite like that.

[1nickt]

Is this question about Perl?