1,105,214 Community Members

html+javascript

Member Avatar
Shikha_1
Light Poster
33 posts since Jul 2013
Reputation Points: -4 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
0
 
<script type="text/javascript">
    function check()
    {
    var select1 = document.getElementById("from");
    var selected1=[];
    for(var i=0;i< select1.length; i++) {
    if (select1.options[i].selected)
        selected1.push(select1.options[i].value);
    }
    for (var j=0;j<select1.length;j++)
    {
        document.write(selected2[j]);

    }
    }
    </script>

    <!--[if IE]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
  </head>
  <body>

 <table width="70%" height="30%"  align="center"border="1" style="border-collapse:collapse;">
  <tr height="300">
    <td height="256"><p><center>YOUR SCHOOL IS FROM </center> 
      </p>

         <center> 
           <label>  FROM
          <select name="from"  id="from" multiple="multiple" size="3" onchange="check()">
         <option value="0">NURSURY</option>
          <option value="1" selected>I</option>
          <option value="2">II</option>
          <option value="3">III</option>
          <option value="4">IV</option>
          <option value="5">V</option>
          <option value="6">VI</option>
         </select>
          </label>    
         </center>
      <hr>
    <p><center>ADD SECTION TO YOUR CLASSES<br>
    </center></p>
    <script type="text/css">
    check()
    </script>
    <table width="70%" height="30%" align="center"border="1" style="border-collapse:collapse;" >
    <tr>
    <td width="196">CLASS I  </td>
    <td width="94"><input name="A" type="checkbox" value="A">A    </td>
    <td width="96"><input name="B" type="checkbox" value="B">B    </td>
    <td width="95"><input name="C" type="checkbox" value="C">C    </td>
    <td width="95"><input name="D" type="checkbox" value="D">D    </td>
    </tr>
    <td>CLASS II </td>
    <td><input name="A" type="checkbox" value="A">A   </td>
    <td><input name="B" type="checkbox" value="B">B   </td>
    <td><input name="C" type="checkbox" value="C">C   </td>
    <td><input name="D" type="checkbox" value="D">D   </td>
    <tr>
    <td>CLASS III    </td>
    <td><input name="A" type="checkbox" value="A">A   </td>
    <td><input name="B" type="checkbox" value="B">B   </td>
    <td><input name="C" type="checkbox" value="C">C   </td>
    <td><input name="D" type="checkbox" value="D">D   </td>
    </tr>
    <tr>
    <td>CLASS IV </td>
    <td><input name="A" type="checkbox" value="A">A   </td>
    <td><input name="B" type="checkbox" value="B">B   </td>
    <td><input name="C" type="checkbox" value="C">C   </td>
    <td><input name="D" type="checkbox" value="D">D   </td>
    </tr>
    <tr>
    <td>CLASS IV </td>
    <td><input name="A" type="checkbox" value="A">A   </td>
    <td><input name="B" type="checkbox" value="B">B   </td>
    <td><input name="C" type="checkbox" value="C">C   </td>
    <td><input name="D" type="checkbox" value="D">D   </td>
    </tr>
    <tr>
    <td height="73" colspan="5">                                                                                                                                                  



      <a href="confirmpop.html" rel="shadowbox"><input type="submit" name="Submit3" value="CONFIRM"></td>
      </tr>
    </table>   


      <a href="confirmpop.html" rel="shadowbox"><input type="submit" name="Submit3" value="CONFIRM"></td>
      </tr>
    </table>

  </body>
</html>

i want the values of the selected option from drop down but its not working and onthe selection of the values i want to create a table as shown in code ..i am new to javascrit and need help
Member Avatar
iamthwee
Posting Sage
7,037 posts since Aug 2005
Reputation Points: 1,307 [?]
Q&As Helped to Solve: 592 [?]
Skill Endorsements: 74 [?]
Featured
 
-5
 

Consider using jquery.

Member Avatar
pp0007
Newbie Poster
7 posts since Jun 2013
Reputation Points: -2 [?]
Q&As Helped to Solve: 1 [?]
Skill Endorsements: 0 [?]
 
-2
 

solve it

Member Avatar
Shikha_1
Light Poster
33 posts since Jul 2013
Reputation Points: -4 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
0
 
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="generator" content="CoffeeCup HTML Editor (www.coffeecup.com)">
    <meta name="dcterms.created" content="Sat, 17 Aug 2013 07:56:58 GMT">
    <meta name="description" content="">
    <meta name="keywords" content="">
    <title></title>

    <!--[if IE]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
  </head>
  <body>
<html>
<body>
<script type="text/javascript">
function section() 
{
var select1,length,a,b,tableElem,rowElem,colElem,inc;

     select1 = document.myForm.myOption;
    var selected1=[];
    for(var i=0;i< select1.length; i++)
    {
    if (select1.options[i].selected)
        selected1.push(select1.options[i].value);
    }
    document.write(selected1.length);
    document.write("hello");
    document.write(selected1[0]);
    length=selected1.length;
    a=selected1[0];
    b=selected1[length-1];
    document.write(a);
    document.write(b);

    inc=1;
    tableElem = document.createElement('table');
    tableElem.style.border="1px solid black";
    for (var k=a;k<=b; k++) {
          rowElem = document.createElement('tr');

           for (var j = 0; j < 4; j++) 
           {
             colElem = document.createElement('td');
             colElem.style.border="1px solid black";
             colElem.appendChild(document.createTextNode(inc)); //to print cell number
             rowElem.appendChild(colElem);
             check = document.createElement('input');
             check.type = "checkbox";
             check.name = "chkSection";
            //check.value = "chk"+inc;

             check.value = inc;
             check.id = "chk"+inc;
            //alert(check.value);


             colElem.appendChild(check);
             inc++;
           //colElem.appendChild(lab);
}
           tableElem.appendChild(rowElem);
}
}
</script>
<form name="myForm">
<select name="myOption" id="myoption" multiple="multiple" size="3" >

<option value="1">I</option>
<option value="2">II</option>
<option value="3">III</option>
<option value="4">IV</option>
<option value="5">V</option>
<option value="6">VI</option>
<option value="7">VII</option>
<option value="8">VIII</option>
</select>
<BR><BR>
<input type=submit value="ok" onClick="section()">




  </body>
</html>

i tried this also but still table is not generated????why??
Member Avatar
Shikha_1
Light Poster
33 posts since Jul 2013
Reputation Points: -4 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
-1
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
  <head>
       <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <title>JSP Page</title>
  </head>
  <body>
<html>
<body>
<script type="text/javascript">
function section() 
{
var select1,length,a,b,tableElem,rowElem,colElem,inc;

     select1 = document.myForm.myOption;
    var selected1=[];
    for(var i=0;i< select1.length; i++)
    {
    if (select1.options[i].selected)
        selected1.push(select1.options[i].value);
    }
    /*document.write(selected1.length);
    document.write("hello");
    document.write(selected1[0]);
    length=selected1.length;
    a=selected1[0];
    b=selected1[length-1];
    document.write(a);
    document.write(b);
    */
    inc=1;

    tableElem = document.createElement('table');
    tableElem.style.border="1px solid black";
    for (var k=a;k<=b; k++) 
    {
          rowElem = document.createElement('tr');

           for (var j=0; j<4;j++) 
           {
             colElem = document.createElement('td');
             colElem.style.border="1px solid black";
             colElem.appendChild(document.createTextNode(inc)); //to print cell number
             rowElem.appendChild(colElem);
             check = document.createElement('input');
             check.type = "checkbox";
             check.name = "chkSection";
            //check.value = "chk"+inc;

             check.value = inc;
             check.id = "chk"+inc;
            //alert(check.value);


             colElem.appendChild(check);
             inc++;
           //colElem.appendChild(lab);
}
           tableElem.appendChild(rowElem);
}
        document.getElementById("clicksection").appendChild(tableElem);
        document.getElementById("ch").hidden =0;

}
</script>
 <center><table border="1" width="40%" height="30%">
<form name="myForm">
<select name="myOption" id="myoption" multiple="multiple" size="3" >

<option value="1">I</option>
<option value="2">II</option>
<option value="3">III</option>
<option value="4">IV</option>
<option value="5">V</option>
<option value="6">VI</option>
<option value="7">VII</option>
<option value="8">VIII</option>
</select>
<BR><BR>
<input type=submit value="ok" onClick="section()">
</form>
</table></center>

 <table id="setionallotment" cellpadding="10" width="50%" height="40%">

                   <tr>

                       <td id="clicksection">




                       </td>

                   </tr>




                    <tr>

                       <td id="ch1">


                           <input type="submit" value="Submit" id="ch" name="ch" hidden="1">


                       </td>

                   </tr>



  </table>



  </body>
</html>

please tell me what is wrong in this code ,it is not working

Member Avatar
Shikha_1
Light Poster
33 posts since Jul 2013
Reputation Points: -4 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
0
 
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="generator" content="CoffeeCup HTML Editor (www.coffeecup.com)">
    <meta name="dcterms.created" content="Fri, 16 Aug 2013 06:00:26 GMT">
    <meta name="description" content="">
    <meta name="keywords" content="">
    <title></title>
    </head>

<html>
<body>
<script type="text/javascript">
function section() 
{
var select1,length,a,b,tableElem,rowElem,colElem,inc;

     select1 = document.myForm.myOption;
    var selected1=[];
    for(var i=0;i< select1.length; i++)
    {
    if (select1.options[i].selected)
        selected1.push(select1.options[i].value);
    }
    /*document.write(selected1.length);
    document.write("hello");
    document.write(selected1[0]);*/
    length=selected1.length;
    a=selected1[0];
    b=selected1[length-1];
    /*document.write(a);
    document.write(b);
    */
    inc=1;

    tableElem = document.createElement('table');
    tableElem.style.border="1px solid black";
    for (var k=a;k<=b; k++) 
    {        

          rowElem = document.createElement('tr');

           for (var j=0; j<4;j++) 
           {
             colElem = document.createElement('td');
             colElem.style.border="1px solid black";
             colElem.appendChild(document.createTextNode(inc)); //to print cell number
             rowElem.appendChild(colElem);
             check = document.createElement('input');
             check.type = "checkbox";
             check.name = "chkSection";
            //check.value = "chk"+inc;

             check.value = inc;
             check.id = "chk"+inc;
            //alert(check.value);


             colElem.appendChild(check);
             inc++;
           //colElem.appendChild(lab);
}
           tableElem.appendChild(rowElem);
}
        document.getElementById("clicksection").appendChild(tableElem);
        document.getElementById("ch").hidden =0;

}
</script>
<table border="0" width="90%" height="70%">
<tr>
<td>

 <table border="1" width="40%" height="30%">
 <tr>
 <td>
<form name="myForm">
<select name="myOption" id="myoption" multiple="multiple" size="3" >

<option value="1">I</option>
<option value="2">II</option>
<option value="3">III</option>
<option value="4">IV</option>
<option value="5">V</option>
<option value="6">VI</option>
<option value="7">VII</option>
<option value="8">VIII</option>
</select>
<BR><BR>

<input type="submit" value="ok" onClick="section()">
</form>
<td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
   <form action="" method="post" name="f1" onsubmit="">
 <table id="sectionallotment" cellpadding="10" width="50%" height="40%">

                   <tr>

                       <td id="clicksection">




                       </td>

                   </tr>




                    <tr>

                       <td id="ch1">


                           <input type="submit" value="Submit" id="ch" name="ch" hidden="1">


                       </td>

                   </tr>



  </table>
  </form>
  </td>
  </tr>

</table>

  </body>
</html>

this code is working fine but on click ok the table are shown then they vanish but they should hold there

You
This article has been dead for over three months: Start a new discussion instead
Post:
Start New Discussion
View similar articles that have also been tagged: