Schrift
[thread]12852[/thread]

"Check All" Button bei CGI und Checkboxen



<< |< 1 2 >| >> 15 Einträge, 2 Seiten
tecker
 2008-12-02 17:38
#116784 #116784
User since
2008-02-26
77 Artikel
BenutzerIn
[Homepage] [default_avatar]
Hi,

weis jemand eine bessere Möglichkeite einen "Alles auswählen" Button zu erzeugen, mit dem sämtliche Checkboxen ausgewählt bzw. "gechecked" werden?

Meine funktioniert zwar, aber wird dabei die Seite immer neu geladen, d.h. sämtliche bis dahin ausgefüllten Inputfelder/Textfields werden gelöscht.

Code-Schnippsel:

Code (perl): (dl )
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
while ($prepare_select_hosts->fetch()){

        print $cgi->Tr(
                        $cgi->td({-width=>'20'},$id),
                        $cgi->td($hostname),
                        $cgi->td($ip),
                        $cgi->td($cgi->checkbox(-name=>'host', -label=>'', -checked=>"$status", -value=>"$ip"))
                );
        }
        print $cgi->Tr({-height=>'15'}, "");
        print $cgi->Tr(
                $cgi->td({-colspan=>'2'},
                $cgi->button(-name=>'check',
                             -value=>'Select All',
                             -onClick=>"location.href='/cgi-bin/passwd/passwd.pl?status=1'"),

                $cgi->button(-name=>'check',
                             -value=>'Unselect All',
                             -onClick=>"location.href='/cgi-bin/passwd/passwd.pl?status=0'")
                ));



Viele Grüße
Linuxer
 2008-12-02 17:40
#116785 #116785
User since
2006-01-27
3890 Artikel
HausmeisterIn

user image
Du könntest JavaScript verwenden, um die entsprechenden Checkboxes anzuwählen.

edit:

schau Dir mal den Quelltext der Messenger-Seite dieses Boards an, dort ist es mit JavaScript umgesetzt.
meine Beiträge: I.d.R. alle Angaben ohne Gewähr und auf Linux abgestimmt!
Die Sprache heisst Perl, nicht PERL. - Bitte Crossposts als solche kenntlich machen!
tecker
 2008-12-02 18:03
#116786 #116786
User since
2008-02-26
77 Artikel
BenutzerIn
[Homepage] [default_avatar]
Ja ok,

mit Javascript hatte ich es ursprünglich mal, aber da war die GUI noch eine index.html

Code: (dl )
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<script type="text/javascript">
<!--
function AllMessages()
{for(var x=0;x<document.form1.elements.length;x++)
{var y=document.form1.elements[x];
if(y.name!='ALLMSGS') y.checked=document.form1.checkall.checked;
}
}
//-->
</script>

[...]
<td><input type="checkbox" name="host" value="HOSTNAME1" /> HOSTNAME1</td>
<td><input type="checkbox" name="host" value="HOSTNAME2" /> HOSTNAME2</td></tr>


<tr><td><input type="checkbox" name="checkall" onclick="AllMessages(this.form);" /> alle markieren</td></tr>




Wie setzt ich das in Perl um, wenn ich alles Objektorientiert mit CGI-Modul mache??

Hab es versucht aber nicht wirklich hinbekommen.
Struppi
 2008-12-02 18:17
#116787 #116787
User since
2006-02-17
628 Artikel
BenutzerIn
[Homepage]
user image
Du musst das JS an den Browser schicken und im onclick Handler die Funktion eintragen.
tecker
 2008-12-03 13:28
#116804 #116804
User since
2008-02-26
77 Artikel
BenutzerIn
[Homepage] [default_avatar]
Hab jetzt 3 Sachen versucht den Javascriptcode an den Browser zu schicken. Er wird ja auch angezeigt im Browser also scheint das eigentlich zu klappen, aber so richtig funktioniert das alles doch noch nicht. Ist mein Fuktionsaufruf evtl. falsch?

1.
Code (perl): (dl )
1
2
3
4
5
6
7
8
print $cgi->header(     -type=>'text/html');
print $cgi->start_html( -dtd => '-//W3C//DTD XHTML 1.0 Transitional//EN',
                                -title=>'Test',
                                -style=>{'src'=>"https://10.255.253.7/passwd/styles.css"},
                                -script=>{ -language=>'JavaScript',
                                                -src=>'checkall.js'}

                                );


2.
Code (perl): (dl )
1
2
3
4
5
6
7
8
9
10
print "<script type=\"text/javascript\">
<!--
        function AllMessages()
                {for(var x=0;x<document.form1.elements.length;x++)
                        {var y=document.form1.elements[x];
                         if(y.name!='ALLMSGS') y.checked=document.form1.checkall.checked;
                        }
                }
//-->
</script>";


3.
Code (perl): (dl )
1
2
3
4
5
6
7
8
9
10
11
my $JSCRIPT=<<END;
function AllMessages()
                {for(var x=0;x<document.form1.elements.length;x++)
                        {var y=document.form1.elements[x];
                         if(y.name!='ALLMSGS') y.checked=document.form1.checkall.checked;
END

print $cgi->start_html( -dtd => '-//W3C//DTD XHTML 1.0 Transitional//EN',
                                -title=>'Remote Password Changer',
                                -style=>{'src'=>"https://10.255.253.7/passwd/styles.css"},
                                -script=>$JSCRIPT);




Aufruf später jeweils über:

Code (perl): (dl )
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
print $cgi->start_form({-id=>'form1',-name=>'form1',-action => "$url/cgi-bin/passwd/ssh.pl", -method=>'post'});
[...]
 while ($prepare_select_hosts->fetch()){

        print $cgi->Tr(
                        $cgi->td({-width=>'20'},$id),
                        $cgi->td($hostname),
                        $cgi->td($ip),
                        $cgi->td($cgi->checkbox(-name=>'host', -value=>"$ip"))
                );
        }
        
        print $cgi->Tr($cgi->td(
                $cgi->button(-name=>'checkall',
                             -value=>'Check All',
                             -onClick=>"AllMessages(this.form);"));
LanX-
 2008-12-03 13:57
#116805 #116805
User since
2008-07-15
1000 Artikel
BenutzerIn

user image
ohne die Details zu kennen, wenn der Code in der Seite ankommt, liegts am Aufruf bzw Aufrufzeitpunkt. Entweder du bindest es an einen Button oder ein Event wie "onLoad".

Bedenke das zu Ladezeitpunkt das DOM noch nicht generiert wurde, früher hat man deswegen die Scripte oft auch ans Ende der seite gestellt statt onload zu nehmen.
Struppi
 2008-12-05 02:01
#116826 #116826
User since
2006-02-17
628 Artikel
BenutzerIn
[Homepage]
user image
Der zusammenhang zwischen dem Code ist nicht klar. zuerst bindest du eine exteren JS Datei checkall.js ein, dann gibst du JS inline code, also für den HTML Queltext, aus. Dann stimmt dein Funktionsaufruf nicht mit der Funktion überein.
Auch die Namen der Checkboxen sind nicht die gleichen wie in der JS Funktion.

Was sagt den die Fehlerkonsole?

Ich kann dir nur zeigen, wie es aussehen sollte
http://javascript.jstruebig.de/javascript/29/
tecker
 2008-12-07 15:46
#116910 #116910
User since
2008-02-26
77 Artikel
BenutzerIn
[Homepage] [default_avatar]
Naja so langsam komm ich da hin wo ich hin will mit meinem Programm. Inzwischen gehen auch meine JS-Funktionen.

Code (perl): (dl )
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
my $js = q~
function checkAll(field)
{
        for(i=0;i<field.length; i++)
        field[i].checked=true;
}

function uncheckAll(field)
{
        for(i=0;i<field.length;i++)
        field[i].checked=false;
}


~;

[...]

print $cgi->start_form({-name=>'form1',-action => "/pfad/script.pl", -method=>'post'});
        
        
print $cgi->start_table({-bordercolor=>'#cccccc', -bgcolor=>'#ffffff', -border=>'0', -width=>'700'});
while ($prepare_select_hosts->fetch()){

        print $cgi->Tr(
                        $cgi->td({-width=>'20'},$id),
                        $cgi->td($hostname),
                        $cgi->td($ip),
                        $cgi->td($cgi->checkbox(-name=>'host', -label=>'', -value=>"$ip"))
                );
        }
print $cgi->Tr(
                $cgi->td({-colspan=>'3'},

                $cgi->button(-name=>'checkall',
                             -value=>'Check All',
                             -onMouseOver =>"this.style.color = '#FF0000'",
                             -onMouseOut => "this.style.color = '#000000'",
                             -onClick=>"checkAll(document.form1.host);"),
                
                $cgi->button(-name=>'uncheckall',
                             -value=>'Uncheck All',
                             -onMouseOver =>"this.style.color = '#FF0000'",
                             -onMouseOut => "this.style.color = '#000000'",
                             -onClick=>"uncheckAll(document.form1.host);"),

                        ));
print $cgi->end_table();
print $cgi->end_form();

[...]
Struppi
 2008-12-07 17:37
#116923 #116923
User since
2006-02-17
628 Artikel
BenutzerIn
[Homepage]
user image
Den Aufruf der JS Funktion kannst du noch verkürzen.

Code (perl): (dl )
1
2
3
4
5
$cgi->button(-name=>'checkall',
                              -value=>'Check All',
                             -onMouseOver =>"this.style.color = '#FF0000'",
                              -onMouseOut => "this.style.color = '#000000'",
                              -onClick=>"checkAll(this.form.host);"),

Dann sparst du dir auch den Namen für das Formular.
Und solche Mausovereffekte würde ich heutzutage nur noch über CSS machen
GwenDragon
 2008-12-07 17:47
#116925 #116925
User since
2005-01-17
14747 Artikel
Admin1
[Homepage]
user image
Wenn schon CSS und JS verwendet werden, warum wird dann das CSS immer noch inline geschrieben? Inhalt und Formatierung trennen!

Und warum weist du dem Button keinen Eventhandler zu? Inline-JS ist doch nicht schön!

<< |< 1 2 >| >> 15 Einträge, 2 Seiten



View all threads created 2008-12-02 17:38.