Web Analytics Made Easy -
StatCounter need help finishing this code.. - CodingForum

Announcement

Collapse
No announcement yet.

need help finishing this code..

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • need help finishing this code..

    hi all, I am new here and this is my first post. now, I want someone to help me please. I have added the HTML codes and uploaded the CSS code file.
    what I waned to do here.. is
    1) I wanted to select no more than 5 options.
    2) when an option is selected I wanted some detail to show in the
    information area.
    3) when I open the codes in a different computer or browser; the
    alignmt of the 2 areas (course selection and detail info) get messed up.
    I am using IE8 and google chrome.
    so can an one help me plz.



    [CODE]

    <?xml version = "1.0" encoding = "utf-8" ?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
    "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">


    <head>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
    <title>index</title>



    <link rel="stylesheet" type="text/css" href="style.css" />

    <!--[if lte IE 6]>
    <link href="style.css" type="text/css" rel="stylesheet" media="screen" />
    <![endif]-->





    <SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
    <!--

    function MoveOption(objSourceElement, objTargetElement)
    {
    var aryTempSourceOptions = new Array();
    var x = 0;

    //looping through source element to find selected options
    for (var i = 0; i < objSourceElement.length; i++) {
    if (objSourceElement.options[i].selected) {
    //need to move this option to target element
    var intTargetLen = objTargetElement.length++;
    objTargetElement.options[intTargetLen].text = objSourceElement.options[i].text;
    objTargetElement.options[intTargetLen].value = objSourceElement.options[i].value;
    }
    else {
    //storing options that stay to recreate select element
    var objTempValues = new Object();
    objTempValues.text = objSourceElement.options[i].text;
    objTempValues.value = objSourceElement.options[i].value;
    aryTempSourceOptions[x] = objTempValues;
    x++;
    }
    }

    //resetting length of source
    objSourceElement.length = aryTempSourceOptions.length;
    //looping through temp array to recreate source select element
    for (var i = 0; i < aryTempSourceOptions.length; i++) {
    objSourceElement.options[i].text = aryTempSourceOptions[i].text;
    objSourceElement.options[i].value = aryTempSourceOptions[i].value;
    objSourceElement.options[i].selected = false;
    }
    }



    <!--
    function myFunction()
    {
    document.getElementById('T').innerHTML="this is ITEC 1000 ";
    document.getElementById('T').innerHTML="this is ITEC 1000 ";
    document.getElementById('T').href="nothing";
    document.getElementById('T').target="_blank";
    }

    //-->
    </SCRIPT>

    <link rel="stylesheet"href=style.css type="text/css"">

    </head>

    <body>


    <div id="left1"></div>
    <div id="right1"></div>
    <div id="top1"></div>
    <div id="bottom1"></div>

    <div id="left2"></div>
    <div id="right2"></div>
    <div id="top2"></div>
    <div id="bottom2"></div>

    <h1 class="t1">Course Selection</h1>

    <form action="" name="MoveList">


    <select class="so1" name="Added" size="15" multiple style="width: 130px;">
    <option value="">Select course(s)</option>
    <option value="ITEC1000">ITEC 1000</option>
    <option value="ITEC1010">ITEC 1010</option>
    <option value="ITEC1620">ITEC 1620</option>
    <option value="ITEC1630">ITEC 1630</option>
    <option value="ITEC3020">ITEC 3020</option>
    <option value="ITEC3210">ITEC 3210</option>
    <option value="ITEC3230">ITEC 3230</option>
    <option value="ITEC4030">ITEC 4030</option>
    <option value="ITEC4040">ITEC 4040</option>
    <option value="ITEC4220">ITEC 4220</option>
    <option value="ITEC4305">ITEC 4305</option>
    </select>
    <!--
    <input class="b1" type="button" name="remove" value="&nbsp;&nbsp;&nbsp; Add -&gt; " style="width: 100px;" onClick="MoveOption(this.form.Added, this.form.Removed)", "changeLink()">-->
    <input class="b1" name="remove" type="button" value="Add >>" style="width: 100px;" onClick="MoveOption(this.form.Added, this.form.Removed, myFunction())" >
    <input class="b2" type="button" name="Add" value="<< Remove" style="width: 100px;" onClick="MoveOption(this.form.Removed, this.form.Added)">


    <select class="so2" name="Removed" size="15" multiple style="width: 130px;">

    </select>
    </form>






    <h2 class="t2">Selected Courses - Detailed Information</h2>



    <p class="info1" id="T" ></p>

    </html>


    [ICODE]
    Attached Files
Working...
X