Javascript: How do i code this?

Discussion in 'JavaScript' started by Javver, Jul 31, 2011.

  1. #1
    Hello,

    How do i code this? Please check the image below. Any help would be much appreciated.

    test.gif
     
    Javver, Jul 31, 2011 IP
  2. JamesColin

    JamesColin Prominent Member

    Messages:
    7,874
    Likes Received:
    164
    Best Answers:
    1
    Trophy Points:
    395
    Digital Goods:
    1
    #2
    simply VIEW SOURCE of the page and steal the code.
     
    JamesColin, Jul 31, 2011 IP
  3. Javver

    Javver Active Member

    Messages:
    72
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    91
    #3
    I'm sorry. I just made the html myself but don't know the js part of the code. Thanks
     
    Javver, Aug 1, 2011 IP
  4. JamesColin

    JamesColin Prominent Member

    Messages:
    7,874
    Likes Received:
    164
    Best Answers:
    1
    Trophy Points:
    395
    Digital Goods:
    1
    #4
    JamesColin, Aug 1, 2011 IP
  5. ayushi infotech

    ayushi infotech Peon

    Messages:
    1,814
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    0
    #5
    try this code and what use for launch button . if you said try my self....

    <script language="JavaScript">
    function checkAll(field)
    {
    for (i = 0; i < field.length; i++)
    field.checked = true ;
    }
    function uncheckAll(field)
    {
    for (i = 0; i < field.length; i++)
    field.checked = false ;
    }
    </script>
    <form onsubmit="bornday" name="myform">
    <div><input type="checkbox" id="facebook" name="myCheckbox" /> facebook</div>
    <div><input type="checkbox" id="google" name="myCheckbox"/> Google</div>
    <div><input type="checkbox" id="yahoo" name="myCheckbox"/> Yahoo</div>
    <input type="button" value="uncheck!" onclick="uncheckAll(document.myform.myCheckbox)" />
    <input type="button" value="launch!" onclick="checkAll(document.myform.myCheckbox)" />

    </form>
     
    ayushi infotech, Aug 1, 2011 IP
  6. Javver

    Javver Active Member

    Messages:
    72
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    91
    #6
    Thank you mohan_new!

    The code works for Uncheck but not the Launch button
     
    Javver, Aug 1, 2011 IP
  7. astrazone

    astrazone Member

    Messages:
    358
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    33
    #7
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><script type="text/javascript" src="js/1.4.3jquery.js"></script><script type="text/javascript">$(document).ready(function(){	var domains = ["http://www.facebook.com","http://www.google.com","http://www.Yahoo.com"];	$("#ckAll").click(function(){			$('[name="myCheckbox"]').each(function(){				$(this).attr("checked","checked");						   			})			return false;	})	$("#unckAll").click(function(){			$('[name="myCheckbox"]').each(function(){				$(this).attr("checked","");						   			})			return false;	})	$("#lunch").click(function(){			$('[name="myCheckbox"]:checked').each(function(){				window.open(domains[$(this).attr("value")]);						   			})			return false;	})})</script><title>Test JS</title></head>
    <body><form name="myform" action=""><div><input type="checkbox" name="myCheckbox" value="0" />Facebook</div><div><input type="checkbox" name="myCheckbox" value="1"/>Google</div><div><input type="checkbox" name="myCheckbox" value="2"/>Yahoo!</div><button id="lunch">Launch!</button><button id="unckAll">UnCheck</button><button id="ckAll">Check All</button>
    
    </form></body></html>
    PHP:
    I used jquery for this.. simpler
     
    astrazone, Aug 1, 2011 IP
  8. Javver

    Javver Active Member

    Messages:
    72
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    91
    #8
    Thank you for sharing astrazone. I appreciate it. However, jquery is quite more advanced and i can't follow. just need the typical js code to do it.
     
    Javver, Aug 1, 2011 IP
  9. astrazone

    astrazone Member

    Messages:
    358
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    33
    #9
    If you would like to really get into this seriously you should probably learn jquery its very simple...

    Let me break id down for you...

    $("#ckAll").click(function(){
    PHP:
    It looks for the ckAll id and goes through the function when its pressed...
    $('[name="myCheckbox"]').each(function(){				$(this).attr("checked","checked");						   			})
    PHP:
    Here it finds every input with the name "myCheckbox" and runs each of the inputs it finds through the function changing the $(this) each time..
    Then it just adds the attribute checked with the value checked...
    I hope that you will understand it from here. if not feel free to PM me.

    Good luck,
    astrazone
     
    astrazone, Aug 1, 2011 IP
  10. camjohnson95

    camjohnson95 Active Member

    Messages:
    737
    Likes Received:
    17
    Best Answers:
    0
    Trophy Points:
    60
    #10
    Include the whole library of jQuery instead of a few lines of a JS? Seems efficient...
     
    camjohnson95, Aug 1, 2011 IP
  11. Javver

    Javver Active Member

    Messages:
    72
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    91
    #11
    hello... i have the check/uncheck buttons working now. my problem now is the code for the launch button.
     
    Javver, Aug 1, 2011 IP
  12. ayushi infotech

    ayushi infotech Peon

    Messages:
    1,814
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    0
    #12
    i got the solution please try this one.......

    <script language="JavaScript">
    function checkAll(field)
    {
    for (i = 0; i < field.length; i++)
    field.checked = true ;
    }
    function uncheckAll(field)
    {
    for (i = 0; i < field.length; i++)
    field.checked = false ;
    }

    function siteOpener()
    {
    var checkboxArr=document.myform.myCheckbox;
    for(var i=0;i<checkboxArr.length;i++)
    {
    if(checkboxArr.checked)
    {
    window.open (checkboxArr.value,"mywindow"+i);
    }
    }
    }


    </script>
    <form onsubmit="bornday" name="myform">
    <div><input type="checkbox" id="facebook" name="myCheckbox" value="http://www.facebook.com/" /> facebook</div>
    <div><input type="checkbox" id="google" name="myCheckbox" value="http://google.com" id="CheckboxGroup1_0" /> Google</div>
    <div><input type="checkbox" id="yahoo" name="myCheckbox" value="http://yahoo.com" id="CheckboxGroup1_1" /> Yahoo</div>
    <input name="openSites" type="button" value="Launch" onclick="siteOpener();"/>
    <input type="button" value="Uncheck!" onclick="uncheckAll(document.myform.myCheckbox)" />
    <input type="button" value="Check All" onclick="checkAll(document.myform.myCheckbox)" />
    </form>
     
    Last edited by a moderator: Aug 1, 2011
    ayushi infotech, Aug 1, 2011 IP
  13. Javver

    Javver Active Member

    Messages:
    72
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    91
    #13
    Thank you very much mohan_new! i have the site working now! great man!
     
    Javver, Aug 2, 2011 IP
  14. Vinil Mehta

    Vinil Mehta Member

    Messages:
    190
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    48
    #14
    thanks mohan_new .i found it helpful .
     
    Vinil Mehta, Aug 2, 2011 IP
  15. ayushi infotech

    ayushi infotech Peon

    Messages:
    1,814
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    0
    #15
    you are welcome buddy.............
     
    ayushi infotech, Aug 2, 2011 IP
  16. chinnodu

    chinnodu Peon

    Messages:
    25
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #16
    Great Info....
     
    chinnodu, Aug 2, 2011 IP