473,396 Members | 1,671 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

home > topics > javascript > questions > populate textbox value with option value

Join Bytes to post your question to a community of 473,396 software developers and data experts.

Populate textbox value with option value

Hi
I am very new to web programming, trying to achieve a task, I have a form with 3 dropdown box and a text field(which is readonly).
My problem now is, after selecting the above 3 dropdown boxes, its values should be populated at the text box value, Ex

dropdown value 01 = Place (1MUM)
dropdown value 02 = Year (10)
dropdown value 03 = Course (MCA)

text value = Place+Year+Course
(1MUM10MCA)

here is the form code(any hint i will be very thankful)
The form is still in design, so please bear.

Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>Untitled Document</title>
  6. </head>
  7. <body>
  8. <form action="" method="post" enctype="multipart/form-data" name="stud_don_reg">
  9.   <table width="0" border="0" cellspacing="5">
  10.     <tr>
  11.       <td>&nbsp;</td>
  12.       <td colspan="2"><h2>Student Dontation &amp; Registration Application</h2></td>
  13.       <td>&nbsp;</td>
  14.     </tr>
  15.     <tr>
  16.       <td>&nbsp;</td>
  17.       <td><table width="0" border="0" cellspacing="5">
  18.           <tr>
  19.             <th scope="row" align="left"><label>Student Full Name</label></th>
  20.             <td><input name="stud_full_name" type="text" readonly="true" /></td>
  21.             <td>&nbsp;</td>
  22.           </tr>
  23.           <tr>
  24.             <th scope="row" align="left"><label>Place<sup>#Current Course Place</sup></label></th>
  25.             <td><select name="place" id="select">
  26.                 <!-- Uttar Kannada -->
  27.                 <option style="font-style:italic; font-weight:bold" selected="selected">Select Place</option>
  28.                 <option style="font-style:italic; font-weight:bold">Uttar Kannada</option>
  29.                 <option value="1ANK">Ankola</option>
  30.                 <option value="1BHA">Bhatkal</option>
  31.                 <option value="1HON">Honnavar</option>
  32.                 <option value="1KAR">Karwar</option>
  33.                 <option value="1KUM">Kumta</option>
  34.                 <option value="1SID">Siddapur</option>
  35.                 <option value="1SIR">Sirsi</option>
  36.                 <option value="1YEL">Yellapur</option>
  37.                 <!-- Dharwad -->
  38.                 <option style="font-style:italic; font-weight:bold">Dharwad</option>
  39.                 <option value="1DHA">Dharwad</option>
  40.                 <option value="1HUB">Hubli</option>
  41.                 <option value="1KAL">Kalghatgi</option>
  42.                 <option value="1KUN">Kundgol</option>
  43.                 <option value="1NAV">Navalgund</option>
  44.                 <!-- Gadag -->
  45.                 <option style="font-style:italic; font-weight:bold">Gadag</option>
  46.                 <option value="1GAD">Gadag</option>
  47.                 <option value="1LAX">Laxmeshwar</option>
  48.                 <option value="1NAR">Naragund</option>
  49.                 <option value="1RON">Ron</option>
  50.                 <!-- Koppal -->
  51.                 <option style="font-style:italic; font-weight:bold">Koppal</option>
  52.                 <option value="1GAN">Gangavati</option>
  53.                 <option value="1KOP">Koppal</option>
  54.                 <option value="1KUS">Kushtagi</option>
  55.                 <!-- Bellary -->
  56.                 <option style="font-style:italic; font-weight:bold">Bellary</option>
  57.                 <option value="1BEL">Bellary</option>
  58.                 <option value="1HBH">HB Halli</option>
  59.                 <option value="1HOS">Hospet</option>
  60.                 <option value="1KUD">Kudligi</option>
  61.                 <option value="1SAN">Sandur</option>
  62.                 <!-- Davangere -->
  63.                 <option style="font-style:italic; font-weight:bold">Davangere</option>
  64.                 <option value="1HAR"> Harihar</option>
  65.                 <option value="2HON"> Honnalli</option>
  66.                 <option value="1DAV">Davangere</option>
  67.                 <!-- Shimoga -->
  68.                 <option style="font-style:italic; font-weight:bold">Shimoga</option>
  69.                 <option value="1BIR">Birur</option>
  70.                 <option value="2HOS">Hosanagar</option>
  71.                 <option value="1KAD">Kadur</option>
  72.                 <option value="1NAG">Nagar</option>
  73.                 <option value="1SAG">Sagar</option>
  74.                 <option value="1SHI">Shimoga</option>
  75.                 <!-- Chikkamagalur -->
  76.                 <option style="font-style:italic; font-weight:bold">Chikkamagalur</option>
  77.                 <option value="1CHI">Chikkamagalur</option>
  78.                 <!-- Hassan -->
  79.                 <option style="font-style:italic; font-weight:bold">Hassan</option>
  80.                 <option value="1ARS">Arsikere</option>
  81.                 <option value="1HAS">Hassan</option>
  82.                 <!-- Dakshin Kannada -->
  83.                 <option style="font-style:italic; font-weight:bold">Dakshin Kannada</option>
  84.                 <option value="2BEL">Belthangadi</option>
  85.                 <option value="1MAN">Mangalore</option>
  86.                 <option value="1PUT">Puttur</option>
  87.                 <option value="1SUL">Sulia</option>
  88.                 <!-- Udupi -->
  89.                 <option style="font-style:italic; font-weight:bold">Udupi</option>
  90.                 <option value="1BYN">Byndoor</option>
  91.                 <option value="2KAR">Karkala</option>
  92.                 <option value="2KUN">Kundapur</option>
  93.                 <option value="1UDU">Udupi</option>
  94.                 <!-- Bangalore -->
  95.                 <option style="font-style:italic; font-weight:bold">Bangalore</option>
  96.                 <option value="1BAN">Bangalore</option>
  97.                 <!-- Chitradurg -->
  98.                 <option style="font-style:italic; font-weight:bold">Chitradurg</option>
  99.                 <option value="2CHI">Chitradurg</option>
  100.                 <!-- Kodagu -->
  101.                 <option style="font-style:italic; font-weight:bold">Kodagu</option>
  102.                 <option value="2KUS">Kushalnagar</option>
  103.                 <option value="1MAD">Madikere</option>
  104.                 <option value="1SOM">Somawarpet</option>
  105.               </select></td>
  106.             <td>&nbsp;</td>
  107.           </tr>
  108.           <tr>
  109.             <th scope="row" align="left"><label>Current Course Year</label></th>
  110.             <td><select name="year">
  111.             <option value="06">2006</option>
  112.             <option value="07">2007</option>
  113.             <option value="08">2008</option>
  114.             <option value="09">2009</option>
  115.             <option value="10">2010</option>
  116.             </select>
  117.             </td>
  118.             <td>&nbsp;</td>
  119.           </tr>
  120.           <tr>
  121.             <th scope="row" align="left"><label>Course Name &amp; Semester</label></th>
  122.             <td><select name="course">
  123.             <option value="SSLC">SSLC</option>
  124.             <option value="PUC1">PUC 1st yr</option>
  125.             <option value="PUC2">PUC 2nd yr</option>
  126.             <!-- Diploma -->
  127.             <option value="DIP1A">Diploma 1st yr, 1st Sem</option>
  128.             <option value="DIP1B">Diploma 1st yr, 2nd Sem</option>
  129.             <option value="DIP2A">Diploma 2nd yr, 3rd Sem</option>
  130.             <option value="DIP2B">Diploma 2nd yr, 4th Sem</option>
  131.             <option value="DIP3A">Diploma 3rd yr, 5th Sem</option>
  132.             <option value="DIP3B">Diploma 3rd yr, 6th Sem</option>
  133.             <!-- BCom -->
  134.             <option value="BCOM1A">BCOM 1st yr, 1st Sem</option>
  135.             <option value="BCOM1B">BCOM 1st yr, 2nd Sem</option>
  136.             <option value="BCOM2A">BCOM 2nd yr, 3rd Sem</option>
  137.             <option value="BCOM2B">BCOM 2nd yr, 4th Sem</option>
  138.             <option value="BCOM3A">BCOM 3rd yr, 5th Sem</option>
  139.             <option value="BCOM3B">BCOM 3rd yr, 6th Sem</option>
  140.             <!-- BA -->
  141.             <option value="BA1A">BA 1st yr, 1st Sem</option>
  142.             <option value="BA1B">BA 1st yr, 2nd Sem</option>
  143.             <option value="BA2A">BA 2nd yr, 3rd Sem</option>
  144.             <option value="BA2B">BA 2nd yr, 4th Sem</option>
  145.             <option value="BA3A">BA 3rd yr, 5th Sem</option>
  146.             <option value="BA3B">BA 3rd yr, 6th Sem</option>
  147.             <!-- BSc -->
  148.             <option value="BSC1A">BSC 1st yr, 1st Sem</option>
  149.             <option value="BSC1B">BSC 1st yr, 2nd Sem</option>
  150.             <option value="BSC2A">BSC 2nd yr, 3rd Sem</option>
  151.             <option value="BSC2B">BSC 2nd yr, 4th Sem</option>
  152.             <option value="BSC3A">BSC 3rd yr, 5th Sem</option>
  153.             <option value="BSC3B">BSC 3rd yr, 6th Sem</option>
  154.             <!-- BCA -->
  155.             <option value="BCA1A">BCA 1st yr, 1st Sem</option>
  156.             <option value="BCA1B">BCA 1st yr, 2nd Sem</option>
  157.             <option value="BCA2A">BCA 2nd yr, 3rd Sem</option>
  158.             <option value="BCA2B">BCA 2nd yr, 4th Sem</option>
  159.             <option value="BCA3A">BCA 3rd yr, 5th Sem</option>
  160.             <option value="BCA3B">BCA 3rd yr, 6th Sem</option>
  161.             </select>
  162.             </td>
  163.             <td>&nbsp;</td>
  164.           </tr>
  165.           <tr>
  166.             <th scope="row" align="left"><label>Student Registration Number</label></th>
  167.             <td><input name="stud_reg" type="text" size="30" maxlength="30" readonly="true" /></td>
  168.             <td>&nbsp;</td>
  169.           </tr>
  170.           <tr>
  171.             <th scope="row" align="left"><label>Donation Amount</label></th>
  172.             <td><input name="don_amt" type="text" size="30" maxlength="30" /></td>
  173.             <td>&nbsp;</td>
  174.           </tr>
  175.           <tr>
  176.             <th scope="row" align="left">&nbsp;</th>
  177.             <td>&nbsp;</td>
  178.             <td>&nbsp;</td>
  179.           </tr>
  180.           <tr>
  181.             <th scope="row" align="left">&nbsp;</th>
  182.             <td>&nbsp;</td>
  183.             <td>&nbsp;</td>
  184.           </tr>
  185.         </table></td>
  186.       <td>&nbsp;</td>
  187.       <td>&nbsp;</td>
  188.     </tr>
  189.     <tr>
  190.       <td>&nbsp;</td>
  191.       <td>&nbsp;</td>
  192.       <td>&nbsp;</td>
  193.       <td>&nbsp;</td>
  194.     </tr>
  195.     <tr>
  196.       <td>&nbsp;</td>
  197.       <td>&nbsp;</td>
  198.       <td>&nbsp;</td>
  199.       <td>&nbsp;</td>
  200.     </tr>
  201.   </table>
  202. </form>
  203. </body>
  204. </html>
  205.  
Sep 20 '10 #1

✓ answered by RamananKalirajan

It is simple yaar....

In the third Select box, use onchange event. Call a method.
In that method first check the values for all the three select object. Then put it them in the text box.

Ex:
Expand|Select|Wrap|Line Numbers
  1. var res = selObj1.options[selObj1.selectedIndex].value+""+selObj2.options[selObj2.selectedIndex].value+""+selObj3.options[selObj3.selectedIndex].value;
  2. document.getElementById("stud_reg").value= res;
Note: Please include id attribute for the text box also.

This will solve your problem and dont need to call sir. Just address me as Ramanan.

Thanks and Regards
Ramanan Kalirajan

10 2148
RamananKalirajan
608 512MB
Hi,
Use onchange event in the select.

Ex: HTML

Expand|Select|Wrap|Line Numbers
  1. <select id="placeSelect" onchange="doThis()">
  2. <option value="--Select--">--Select--</option>
  3. ...
  4. </select>
Ex: JS Part
Expand|Select|Wrap|Line Numbers
  1. function doThis()
  2. {
  3.   var selObj = document.getElementById('placeSelect');
  4.   if(selObj.selectedIndex>0)
  5.   {
  6.       alert("Selected Value = "+selObj.options[selObj.selectedIndex].value);
  7.   }
  8. }
Thanks and Regards
Ramanan Kalirajan
Sep 22 '10 #2
hello sir,

I have tried this logic, but still i am not able to add(concat) 3 different values from the 3 different dropdown values, and display them in a readonly text box or label.

thank you every much for your time, pls can you try and help me in the above problem.
Sep 22 '10 #3
RamananKalirajan
608 512MB
It is simple yaar....

In the third Select box, use onchange event. Call a method.
In that method first check the values for all the three select object. Then put it them in the text box.

Ex:
Expand|Select|Wrap|Line Numbers
  1. var res = selObj1.options[selObj1.selectedIndex].value+""+selObj2.options[selObj2.selectedIndex].value+""+selObj3.options[selObj3.selectedIndex].value;
  2. document.getElementById("stud_reg").value= res;
Note: Please include id attribute for the text box also.

This will solve your problem and dont need to call sir. Just address me as Ramanan.

Thanks and Regards
Ramanan Kalirajan
Sep 22 '10 #4
Hi Ramanan,

thank you very much for your quick response, i greatly appreciate, i will try this, and let you know about the success.

Thank you again.
Sep 22 '10 #5
Hi Ramanan,

Got partial success,
  1. for place if i select the default value "Select Place" is selected by the function, is their any way to validate so the only respective code values is setected
    Ex:
    Expand|Select|Wrap|Line Numbers
    1. <option value="1ANK">Ankola</option>
    1ANK

    i think this is causing to select the default value.
    Expand|Select|Wrap|Line Numbers
    1. if(selObj1.selectedIndex>0)
  1. i ma still not able to set the textbox value
    here is the updated code

    Expand|Select|Wrap|Line Numbers
    1. <tr>
    2.             <script type="text/javascript">
    3.                  function placeSelect()
    4.                  {
    5.                      var selObj1 = document.getElementById('place');
    6.                     if(selObj1.selectedIndex>0)
    7.                      {
    8.                           alert("Selected Value = "+selObj1.options[selObj1.selectedIndex].value);
    9.                     }
    10.                 }
    11.             </script>
    12.             <th scope="row" align="left"><label>Place<sup>#Current Course Place</sup></label></th>
    13.             <td><select name="place" id="place" style="width:205px" onchange="placeSelect()">
    14.                 <!-- Uttar Kannada -->
    15.                 <option style="font-style:italic; font-weight:bold" selected="selected">Select Place</option>
    16.                 <option style="font-style:italic; font-weight:bold">Uttar Kannada</option>
    17.                 <option value="1ANK">Ankola</option>
    18.                 <option value="1BHA">Bhatkal</option>
    19.                 <option value="1HON">Honnavar</option>
    20.                 <option value="1KAR">Karwar</option>
    21.                 <option value="1KUM">Kumta</option>
    22.                 <option value="1SID">Siddapur</option>
    23.                 <option value="1SIR">Sirsi</option>
    24.                 <option value="1YEL">Yellapur</option>
    25.                 <!-- Dharwad -->
    26.                 <option style="font-style:italic; font-weight:bold">Dharwad</option>
    27.                 <option value="1DHA">Dharwad</option>
    28.                 <option value="1HUB">Hubli</option>
    29.                 <option value="1KAL">Kalghatgi</option>
    30.                 <option value="1KUN">Kundgol</option>
    31.                 <option value="1NAV">Navalgund</option>
    32.                 <!-- Gadag -->
    33.                 <option style="font-style:italic; font-weight:bold">Gadag</option>
    34.                 <option value="1GAD">Gadag</option>
    35.                 <option value="1LAX">Laxmeshwar</option>
    36.                 <option value="1NAR">Naragund</option>
    37.                 <option value="1RON">Ron</option>
    38.                 <!-- Koppal -->
    39.                 <option style="font-style:italic; font-weight:bold">Koppal</option>
    40.                 <option value="1GAN">Gangavati</option>
    41.                 <option value="1KOP">Koppal</option>
    42.                 <option value="1KUS">Kushtagi</option>
    43.                 <!-- Bellary -->
    44.                 <option style="font-style:italic; font-weight:bold">Bellary</option>
    45.                 <option value="1BEL">Bellary</option>
    46.                 <option value="1HBH">HB Halli</option>
    47.                 <option value="1HOS">Hospet</option>
    48.                 <option value="1KUD">Kudligi</option>
    49.                 <option value="1SAN">Sandur</option>
    50.                 <!-- Davangere -->
    51.                 <option style="font-style:italic; font-weight:bold">Davangere</option>
    52.                 <option value="1HAR"> Harihar</option>
    53.                 <option value="2HON"> Honnalli</option>
    54.                 <option value="1DAV">Davangere</option>
    55.                 <!-- Shimoga -->
    56.                 <option style="font-style:italic; font-weight:bold">Shimoga</option>
    57.                 <option value="1BIR">Birur</option>
    58.                 <option value="2HOS">Hosanagar</option>
    59.                 <option value="1KAD">Kadur</option>
    60.                 <option value="1NAG">Nagar</option>
    61.                 <option value="1SAG">Sagar</option>
    62.                 <option value="1SHI">Shimoga</option>
    63.                 <!-- Chikkamagalur -->
    64.                 <option style="font-style:italic; font-weight:bold">Chikkamagalur</option>
    65.                 <option value="1CHI">Chikkamagalur</option>
    66.                 <!-- Hassan -->
    67.                 <option style="font-style:italic; font-weight:bold">Hassan</option>
    68.                 <option value="1ARS">Arsikere</option>
    69.                 <option value="1HAS">Hassan</option>
    70.                 <!-- Dakshin Kannada -->
    71.                 <option style="font-style:italic; font-weight:bold">Dakshin Kannada</option>
    72.                 <option value="2BEL">Belthangadi</option>
    73.                 <option value="1MAN">Mangalore</option>
    74.                 <option value="1PUT">Puttur</option>
    75.                 <option value="1SUL">Sulia</option>
    76.                 <!-- Udupi -->
    77.                 <option style="font-style:italic; font-weight:bold">Udupi</option>
    78.                 <option value="1BYN">Byndoor</option>
    79.                 <option value="2KAR">Karkala</option>
    80.                 <option value="2KUN">Kundapur</option>
    81.                 <option value="1UDU">Udupi</option>
    82.                 <!-- Bangalore -->
    83.                 <option style="font-style:italic; font-weight:bold">Bangalore</option>
    84.                 <option value="1BAN">Bangalore</option>
    85.                 <!-- Chitradurg -->
    86.                 <option style="font-style:italic; font-weight:bold">Chitradurg</option>
    87.                 <option value="2CHI">Chitradurg</option>
    88.                 <!-- Kodagu -->
    89.                 <option style="font-style:italic; font-weight:bold">Kodagu</option>
    90.                 <option value="2KUS">Kushalnagar</option>
    91.                 <option value="1MAD">Madikere</option>
    92.                 <option value="1SOM">Somawarpet</option>
    93.               </select></td>
    94.             <td>&nbsp;</td>
    95.           </tr>
    96.           <tr>
    97.           <script type="text/javascript">
    98.                  function yearSelect()
    99.                  {
    100.                      var selObj2 = document.getElementById('year');
    101.                     if(selObj2.selectedIndex>0)
    102.                      {
    103.                           alert("Selected Value = "+selObj2.options[selObj2.selectedIndex].value);
    104.                     }
    105.                 }
    106.             </script>
    107.             <th scope="row" align="left"><label>Current Course Year</label></th>
    108.             <td><select name="year" id="year" onchange="yearSelect()">
    109.                 <option value="06">2006</option>
    110.                 <option value="07">2007</option>
    111.                 <option value="08">2008</option>
    112.                 <option value="09">2009</option>
    113.                 <option value="10">2010</option>
    114.               </select></td>
    115.             <td>&nbsp;</td>
    116.           </tr>
    117.           <tr>
    118.           <script type="text/javascript">
    119.                  function courseSelect()
    120.                  {
    121.                      var selObj3 = document.getElementById('course');
    122.                     if(selObj3.selectedIndex>0)
    123.                      {
    124.                           alert("Selected Value = "+selObj3.options[selObj3.selectedIndex].value);
    125.                     }
    126.                 }
    127.             </script>
    128.             <th scope="row" align="left"><label>Course Name &amp; Semester</label></th>
    129.             <td><select name="course" id="course" style="width:205px" onchange="courseSelect()">
    130.                 <option value="SSLC">SSLC</option>
    131.                 <option value="PUC1">PUC 1st yr</option>
    132.                 <option value="PUC2">PUC 2nd yr</option>
    133.                 <!-- Diploma -->
    134.                 <option value="DIP1A">Diploma 1st yr, 1st Sem</option>
    135.                 <option value="DIP1B">Diploma 1st yr, 2nd Sem</option>
    136.                 <option value="DIP2A">Diploma 2nd yr, 3rd Sem</option>
    137.                 <option value="DIP2B">Diploma 2nd yr, 4th Sem</option>
    138.                 <option value="DIP3A">Diploma 3rd yr, 5th Sem</option>
    139.                 <option value="DIP3B">Diploma 3rd yr, 6th Sem</option>
    140.                 <!-- BCom -->
    141.                 <option value="BCOM1A">BCOM 1st yr, 1st Sem</option>
    142.                 <option value="BCOM1B">BCOM 1st yr, 2nd Sem</option>
    143.                 <option value="BCOM2A">BCOM 2nd yr, 3rd Sem</option>
    144.                 <option value="BCOM2B">BCOM 2nd yr, 4th Sem</option>
    145.                 <option value="BCOM3A">BCOM 3rd yr, 5th Sem</option>
    146.                 <option value="BCOM3B">BCOM 3rd yr, 6th Sem</option>
    147.                 <!-- BA -->
    148.                 <option value="BA1A">BA 1st yr, 1st Sem</option>
    149.                 <option value="BA1B">BA 1st yr, 2nd Sem</option>
    150.                 <option value="BA2A">BA 2nd yr, 3rd Sem</option>
    151.                 <option value="BA2B">BA 2nd yr, 4th Sem</option>
    152.                 <option value="BA3A">BA 3rd yr, 5th Sem</option>
    153.                 <option value="BA3B">BA 3rd yr, 6th Sem</option>
    154.                 <!-- BSc -->
    155.                 <option value="BSC1A">BSC 1st yr, 1st Sem</option>
    156.                 <option value="BSC1B">BSC 1st yr, 2nd Sem</option>
    157.                 <option value="BSC2A">BSC 2nd yr, 3rd Sem</option>
    158.                 <option value="BSC2B">BSC 2nd yr, 4th Sem</option>
    159.                 <option value="BSC3A">BSC 3rd yr, 5th Sem</option>
    160.                 <option value="BSC3B">BSC 3rd yr, 6th Sem</option>
    161.                 <!-- BCA -->
    162.                 <option value="BCA1A">BCA 1st yr, 1st Sem</option>
    163.                 <option value="BCA1B">BCA 1st yr, 2nd Sem</option>
    164.                 <option value="BCA2A">BCA 2nd yr, 3rd Sem</option>
    165.                 <option value="BCA2B">BCA 2nd yr, 4th Sem</option>
    166.                 <option value="BCA3A">BCA 3rd yr, 5th Sem</option>
    167.                 <option value="BCA3B">BCA 3rd yr, 6th Sem</option>
    168.               </select></td>
    169.             <td>&nbsp;</td>
    170.           </tr>
    171.           <tr>
    172.           <script type="text/javascript">
    173. var res = selObj1.options[selObj1.selectedIndex].value+""+selObj2.options[selObj2.selectedIndex].value+""+selObj3.options[selObj3.selectedIndex].value;
    174. document.getElementById("stud_reg").value= res;
    175.           </script>
    176.             <th scope="row" align="left"><label>Student Registration Number</label></th>
    177.             <td><input name="stud_reg" id="stud_reg" type="text" size="30" maxlength="30" readonly="true" /></td>
    178.             <td>&nbsp;</td>
    179.           </tr>
    180.  
Sep 22 '10 #6
RamananKalirajan
608 512MB
Hi,
I found out the problem. Many used to do this kind of errors. The problem is you have declared and defined the script variables in JS function, but you are trying to access them in some other place. The variable declared in a function are local to that function. It can not be accessed at other places. The working code

Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>Untitled Document</title>
  6. <script type="text/javascript">
  7.  function doThis(){
  8.   var selObj1 = document.getElementById("place");
  9.   var selObj2 = document.getElementById("year");
  10.   var selObj3 = document.getElementById("course");
  11.   if(selObj1.selectedIndex==0)
  12.   {
  13.      alert("Please select a place");
  14.      return;
  15.   }
  16.   var res = selObj1.options[selObj1.selectedIndex].value+""+selObj2.options[selObj2.selectedIndex].value+""+selObj3.options[selObj3.selectedIndex].value;
  17.   document.getElementById("stud_reg").value= res;
  18. }
  19. </script>
  20. </head>
  21. <body>
  22. <form action="" method="post" enctype="multipart/form-data" name="stud_don_reg">
  23.   <table width="0" border="0" cellspacing="5">
  24.     <tr>
  25.       <td>&nbsp;</td>
  26.       <td colspan="2"><h2>Student Dontation &amp; Registration Application</h2></td>
  27.       <td>&nbsp;</td>
  28.     </tr>
  29.     <tr>
  30.       <td>&nbsp;</td>
  31.       <td><table width="0" border="0" cellspacing="5">
  32.           <tr>
  33.             <th scope="row" align="left"><label>Student Full Name</label></th>
  34.             <td><input name="stud_full_name" type="text" readonly="true" /></td>
  35.             <td>&nbsp;</td>
  36.           </tr>
  37.           <tr>
  38.             <th scope="row" align="left"><label>Place<sup>#Current Course Place</sup></label></th>
  39.             <td><select name="place" id="place">
  40.                 <!-- Uttar Kannada -->
  41.                 <option style="font-style:italic; font-weight:bold" selected="selected">Select Place</option>
  42.                 <option style="font-style:italic; font-weight:bold">Uttar Kannada</option>
  43.                 <option value="1ANK">Ankola</option>
  44.                 <option value="1BHA">Bhatkal</option>
  45.                 <option value="1HON">Honnavar</option>
  46.                 <option value="1KAR">Karwar</option>
  47.                 <option value="1KUM">Kumta</option>
  48.                 <option value="1SID">Siddapur</option>
  49.                 <option value="1SIR">Sirsi</option>
  50.                 <option value="1YEL">Yellapur</option>
  51.                 <!-- Dharwad -->
  52.                 <option style="font-style:italic; font-weight:bold">Dharwad</option>
  53.                 <option value="1DHA">Dharwad</option>
  54.                 <option value="1HUB">Hubli</option>
  55.                 <option value="1KAL">Kalghatgi</option>
  56.                 <option value="1KUN">Kundgol</option>
  57.                 <option value="1NAV">Navalgund</option>
  58.                 <!-- Gadag -->
  59.                 <option style="font-style:italic; font-weight:bold">Gadag</option>
  60.                 <option value="1GAD">Gadag</option>
  61.                 <option value="1LAX">Laxmeshwar</option>
  62.                 <option value="1NAR">Naragund</option>
  63.                 <option value="1RON">Ron</option>
  64.                 <!-- Koppal -->
  65.                 <option style="font-style:italic; font-weight:bold">Koppal</option>
  66.                 <option value="1GAN">Gangavati</option>
  67.                 <option value="1KOP">Koppal</option>
  68.                 <option value="1KUS">Kushtagi</option>
  69.                 <!-- Bellary -->
  70.                 <option style="font-style:italic; font-weight:bold">Bellary</option>
  71.                 <option value="1BEL">Bellary</option>
  72.                 <option value="1HBH">HB Halli</option>
  73.                 <option value="1HOS">Hospet</option>
  74.                 <option value="1KUD">Kudligi</option>
  75.                 <option value="1SAN">Sandur</option>
  76.                 <!-- Davangere -->
  77.                 <option style="font-style:italic; font-weight:bold">Davangere</option>
  78.                 <option value="1HAR"> Harihar</option>
  79.                 <option value="2HON"> Honnalli</option>
  80.                 <option value="1DAV">Davangere</option>
  81.                 <!-- Shimoga -->
  82.                 <option style="font-style:italic; font-weight:bold">Shimoga</option>
  83.                 <option value="1BIR">Birur</option>
  84.                 <option value="2HOS">Hosanagar</option>
  85.                 <option value="1KAD">Kadur</option>
  86.                 <option value="1NAG">Nagar</option>
  87.                 <option value="1SAG">Sagar</option>
  88.                 <option value="1SHI">Shimoga</option>
  89.                 <!-- Chikkamagalur -->
  90.                 <option style="font-style:italic; font-weight:bold">Chikkamagalur</option>
  91.                 <option value="1CHI">Chikkamagalur</option>
  92.                 <!-- Hassan -->
  93.                 <option style="font-style:italic; font-weight:bold">Hassan</option>
  94.                 <option value="1ARS">Arsikere</option>
  95.                 <option value="1HAS">Hassan</option>
  96.                 <!-- Dakshin Kannada -->
  97.                 <option style="font-style:italic; font-weight:bold">Dakshin Kannada</option>
  98.                 <option value="2BEL">Belthangadi</option>
  99.                 <option value="1MAN">Mangalore</option>
  100.                 <option value="1PUT">Puttur</option>
  101.                 <option value="1SUL">Sulia</option>
  102.                 <!-- Udupi -->
  103.                 <option style="font-style:italic; font-weight:bold">Udupi</option>
  104.                 <option value="1BYN">Byndoor</option>
  105.                 <option value="2KAR">Karkala</option>
  106.                 <option value="2KUN">Kundapur</option>
  107.                 <option value="1UDU">Udupi</option>
  108.                 <!-- Bangalore -->
  109.                 <option style="font-style:italic; font-weight:bold">Bangalore</option>
  110.                 <option value="1BAN">Bangalore</option>
  111.                 <!-- Chitradurg -->
  112.                 <option style="font-style:italic; font-weight:bold">Chitradurg</option>
  113.                 <option value="2CHI">Chitradurg</option>
  114.                 <!-- Kodagu -->
  115.                 <option style="font-style:italic; font-weight:bold">Kodagu</option>
  116.                 <option value="2KUS">Kushalnagar</option>
  117.                 <option value="1MAD">Madikere</option>
  118.                 <option value="1SOM">Somawarpet</option>
  119.               </select></td>
  120.             <td>&nbsp;</td>
  121.           </tr>
  122.           <tr>
  123.             <th scope="row" align="left"><label>Current Course Year</label></th>
  124.             <td><select name="year" id="year">
  125.             <option value="06">2006</option>
  126.             <option value="07">2007</option>
  127.             <option value="08">2008</option>
  128.             <option value="09">2009</option>
  129.             <option value="10">2010</option>
  130.             </select>
  131.             </td>
  132.             <td>&nbsp;</td>
  133.           </tr>
  134.           <tr>
  135.             <th scope="row" align="left"><label>Course Name &amp; Semester</label></th>
  136.             <td><select name="course" id="course" onchange="doThis()">
  137.             <option value="SSLC">SSLC</option>
  138.             <option value="PUC1">PUC 1st yr</option>
  139.             <option value="PUC2">PUC 2nd yr</option>
  140.             <!-- Diploma -->
  141.             <option value="DIP1A">Diploma 1st yr, 1st Sem</option>
  142.             <option value="DIP1B">Diploma 1st yr, 2nd Sem</option>
  143.             <option value="DIP2A">Diploma 2nd yr, 3rd Sem</option>
  144.             <option value="DIP2B">Diploma 2nd yr, 4th Sem</option>
  145.             <option value="DIP3A">Diploma 3rd yr, 5th Sem</option>
  146.             <option value="DIP3B">Diploma 3rd yr, 6th Sem</option>
  147.             <!-- BCom -->
  148.             <option value="BCOM1A">BCOM 1st yr, 1st Sem</option>
  149.             <option value="BCOM1B">BCOM 1st yr, 2nd Sem</option>
  150.             <option value="BCOM2A">BCOM 2nd yr, 3rd Sem</option>
  151.             <option value="BCOM2B">BCOM 2nd yr, 4th Sem</option>
  152.             <option value="BCOM3A">BCOM 3rd yr, 5th Sem</option>
  153.             <option value="BCOM3B">BCOM 3rd yr, 6th Sem</option>
  154.             <!-- BA -->
  155.             <option value="BA1A">BA 1st yr, 1st Sem</option>
  156.             <option value="BA1B">BA 1st yr, 2nd Sem</option>
  157.             <option value="BA2A">BA 2nd yr, 3rd Sem</option>
  158.             <option value="BA2B">BA 2nd yr, 4th Sem</option>
  159.             <option value="BA3A">BA 3rd yr, 5th Sem</option>
  160.             <option value="BA3B">BA 3rd yr, 6th Sem</option>
  161.             <!-- BSc -->
  162.             <option value="BSC1A">BSC 1st yr, 1st Sem</option>
  163.             <option value="BSC1B">BSC 1st yr, 2nd Sem</option>
  164.             <option value="BSC2A">BSC 2nd yr, 3rd Sem</option>
  165.             <option value="BSC2B">BSC 2nd yr, 4th Sem</option>
  166.             <option value="BSC3A">BSC 3rd yr, 5th Sem</option>
  167.             <option value="BSC3B">BSC 3rd yr, 6th Sem</option>
  168.             <!-- BCA -->
  169.             <option value="BCA1A">BCA 1st yr, 1st Sem</option>
  170.             <option value="BCA1B">BCA 1st yr, 2nd Sem</option>
  171.             <option value="BCA2A">BCA 2nd yr, 3rd Sem</option>
  172.             <option value="BCA2B">BCA 2nd yr, 4th Sem</option>
  173.             <option value="BCA3A">BCA 3rd yr, 5th Sem</option>
  174.             <option value="BCA3B">BCA 3rd yr, 6th Sem</option>
  175.             </select>
  176.             </td>
  177.             <td>&nbsp;</td>
  178.           </tr>
  179.           <tr>
  180.             <th scope="row" align="left"><label>Student Registration Number</label></th>
  181.             <td><input name="stud_reg" id="stud_reg" type="text" size="30" maxlength="30" readonly="true" /></td>
  182.             <td>&nbsp;</td>
  183.           </tr>
  184.           <tr>
  185.             <th scope="row" align="left"><label>Donation Amount</label></th>
  186.             <td><input name="don_amt" type="text" size="30" maxlength="30" /></td>
  187.             <td>&nbsp;</td>
  188.           </tr>
  189.           <tr>
  190.             <th scope="row" align="left">&nbsp;</th>
  191.             <td>&nbsp;</td>
  192.             <td>&nbsp;</td>
  193.           </tr>
  194.           <tr>
  195.             <th scope="row" align="left">&nbsp;</th>
  196.             <td>&nbsp;</td>
  197.             <td>&nbsp;</td>
  198.           </tr>
  199.         </table></td>
  200.       <td>&nbsp;</td>
  201.       <td>&nbsp;</td>
  202.     </tr>
  203.     <tr>
  204.       <td>&nbsp;</td>
  205.       <td>&nbsp;</td>
  206.       <td>&nbsp;</td>
  207.       <td>&nbsp;</td>
  208.     </tr>
  209.     <tr>
  210.       <td>&nbsp;</td>
  211.       <td>&nbsp;</td>
  212.       <td>&nbsp;</td>
  213.       <td>&nbsp;</td>
  214.     </tr>
  215.   </table>
  216. </form>
  217. </body>
  218. </html>
  219.  
  220.  
  221.  
  222.  
Please correct your mistakes.

Thanks and Regards
Ramanan Kalirajan
Sep 22 '10 #7
Thank you very much,

i admit to my mistake, had placed it in the wrong place, i know this is a silly issue to fix, i am learning a lot from my mistakes :)
Sep 22 '10 #8
Hi Ramanan,

is there any way to add id number or some thing at the end of the textbox value generated.

ex : "1ANK07DIP1A" to "1ANK07DIP1A0001"

and auto increment the value every time it goes to database.
Sep 22 '10 #9
RamananKalirajan
608 512MB
Yes you can do that. Using Global variable concept. You can have a global variable in your script and use that variable to increment whenever the function is called or loaded. But there is a problem in it. If you go to someother pae and navigate back your index will start from 0. Inorder to avoid that you can use your server side language. I dont know what is your back end language. You can order the studen id by ascending and fetch the last value to the page on load. Use some seperation logic for that number alone and increment it and then use it.

Thanks and Regards
Ramanan Kalirajan
Sep 22 '10 #10
Hi,

sorry was moved on different form,

can i add db id value to the reg code generated
ex : "1ANK07DIP1A" to "1ANK07DIP1A1"
Oct 4 '10 #11

Sign in to post your reply or Sign up for a free account.

Similar topics

3
dynamically populate drop down menu option value problem
by: julian | last post by:
hi I was wondering if anyone can help me out on this.... I have dynamcally populated a drop down menu with data from an access database using ASP. The values seem fine, however when i pass...
ASP / Active Server Pages
1
Populate textbox in new window
by: got4a | last post by:
Hi guys, Lots of threads and ideas, but I couldn't find what I'm looking for. Hence, this. I have asp page (say, 1.asp) that has a textbox. This page is available to me in read-only mode,...
Javascript
1
populate textbox
by: Celine | last post by:
how can we populate a textbox using information from database, using asp.net and c#
ASP.NET
2
How to pre-set combo textbox's selectedindex value from querystring passed from another page?
by: ABC | last post by:
How to pre-set combo textbox's selectedindex value from querystring passed from another page? I pass the querystring to set combo text box (change selectedindex on Page_Init). Source code as: ...
ASP.NET
5
Select box value changes value of hidden field
by: dvwool | last post by:
Hello, Another newbie here... I've been trying to make this work for days now and have finally decided to post as I can't seem to get it to work. Here's what I'm trying to do... I have a...
Javascript
2
Convert the option value, using textbox value
by: Nowezo | last post by:
Hi, Can you please help me, I want to write a dropdown box that have an option 'Other' but when the Other is selected my textbox need to be enable and take the textbox value as an output instead of...
Javascript
1
Populate text box with option value
by: cbellew | last post by:
Hi guys, I have a problem with an option group and a two corresponding text boxes. When the user chooses an option value i want the text boxes to populate with text dependent on the choice made....
Microsoft Access / VBA
6
auto-populate textbox
by: marcelo27 | last post by:
Hi, I have an html page that has both a textbox and a checkbox. I need to autopopulate the textbox with a value of "0" when the checkbox is selected. I am not sure which JS function to use....
Javascript
3
MSSQL populated dropbox option value truncated
by: grantf3 | last post by:
Hi all, I am currently trying to populate a dropbox with values from a MSSQL DB. The values that are being brought back from the table are two words - peoples full names, eg 'John Smith' (in the one...
PHP
1
Populate textbox value from popup window into parent page
by: azie | last post by:
hi.. Can someone help me, how to populate textbox value from popup window into gridview at parent page. I use modal popup window (window.showModalDialog). At parent page have button add where will...
.NET Framework
0
How to turn on java script in a villaon keypad mobile phone
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
Java
0
Merging data from multiple Excel files
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
Data Management
0
Migrating Website to Cloud - Emmanuel Katto
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
General
1
Looking to do Android software development, any suggestions? Is flutter better?
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
General
1
Is that possible of reading the .csv file in column wise and the column have different lengths ?
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
C / C++
0
How to build RAID in BIOS?
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
Computer Hardware
0
marktang
What is ONU?
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
General
0
jinu1996
Maximizing Business Potential: The Nexus of Website Design and Digital Marketing
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
Online Marketing
0
The easy way to turn off automatic updates for Windows 10/11
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
Windows Server

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.

BYTES.COM © 2024
About Bytes
Terms Of Use
Privacy Policy
Sitemap
Advertise on Bytes:
Post a Job
Sponsored Posts
Platinum & Gold Sponsors
Hire Now!