✔ Checkboxen via jQuery selektieren und deselektieren

A

angelikamorgan

Mitglied
Hallo Zusammen,

ich habe für mein Vorhaben ein funktionierenden Beispiel bereits gefunden.
Leider bin ich (obwohl ich die Lösung vor mir sehe), zu blöd, um das Ganze etwas umzuschreiben :(

PHP: 
<HTML>
<HEAD>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <TITLE>Multiple Checkbox Select/Deselect - DEMO</TITLE>
	
	<SCRIPT language="javascript">
	$(function(){
	 
		// add multiple select / deselect functionality
		$("#selectall").click(function () {
			  $('.case').attr('checked', this.checked);
		});
	 
		// if all checkbox are selected, check the selectall checkbox
		// and viceversa
		$(".case").click(function(){
	 
			if($(".case").length == $(".case:checked").length) {
				$("#selectall").attr("checked", "checked");
			} else {
				$("#selectall").removeAttr("checked");
			}
	 
		});
	});
	
	function fubar() {
		// TODO
	}
	</SCRIPT>
	
</HEAD>
<BODY>

<!-- wenn ich hier auf "select all" clicke, kann ich Checkbox 1 und 2 markieren -->
<input type="checkbox" id="selectall"/>select all<br/>
<input type="checkbox" class="case" name="case" value="1"/>1<br/>
<input type="checkbox" class="case" name="case" value="2"/>2
 
<!-- wenn ich hier auf "orange" clicke, sollen Checkbox 1 und 2 markiert werden -->
<div id="banane" onclick="fubar()">orange</div>
 
</BODY>
</HTML>

Mein Vorhaben:
Wenn ich einmal auf das Wort "orange" klicke, sollen die beiden Checkboxen mit dem Wert 1 und 2 markiert werden. Klicke erneut auf das Wort "orange" sollen die beiden Checkboxen deselektiert werden.
Ich wollte das Ganze in der Methode "fubar()" implementieren.

Wäre klassem wenn mir jemand weiterhelfen würde.

Vielen Dank,
Angelika
 
Hallo,

arbeite schon ein Weilchen mit jQuery etc.
Dachte ich sehe das mal als kleine Herausforderung und schaue mal ob ich was dazu gelernt habe. Und ja, anscheinend schon:

HTML: 
<HTML>
<HEAD>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <TITLE>Multiple Checkbox Select/Deselect - DEMO</TITLE>
    
    <SCRIPT language="javascript">
    $(function(){
     
        // add multiple select / deselect functionality
        $("#selectall").click(function () {
              $('.case').attr('checked', this.checked);
        });
     
        // if all checkbox are selected, check the selectall checkbox
        // and viceversa
        $(".case").click(function(){
     
            if($(".case").length == $(".case:checked").length) {
                $("#selectall").attr("checked", "checked");
            } else {
                $("#selectall").removeAttr("checked");
            }
     
        });
    });
    
    function fubar() {
		$('.case').each(function() {
			if(($(this).val()==1) || ($(this).val()==2)) {
				
				if($(this).attr('checked')){					
					$(this).removeAttr("checked");
				} else{
					$(this).attr("checked", "checked");					
				}				
			}
		});
    }

    </SCRIPT>
    
</HEAD>
<BODY>

<!-- wenn ich hier auf "select all" clicke, kann ich Checkbox 1 und 2 markieren -->
<input type="checkbox" id="selectall"/>select all<br/>
<input type="checkbox" class="case" name="case" value="1"/>1<br/>
<input type="checkbox" class="case" name="case" value="2"/>2<br/>
<input type="checkbox" class="case" name="case" value="3"/>3
 
<!-- wenn ich hier auf "orange" clicke, sollen Checkbox 1 und 2 markiert werden -->
<div id="banane" onclick="fubar()">orange</div>
 
</BODY>
</HTML>


Teste das mal aus und berichte ob dies soweit funktioniert.

Gruß
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück