We help IT Professionals succeed at work.

Build dynamic HTML drop-down box

I need to create a drop down box using the values in the working-storage of a COBOL program. The program passes the value to HTML page using a utility available on the system.
Watch Question

b0lsc0ttIT Manager


What is the relation of the utility to the page where you want the drop down?  Does the web server support a server language (e.g. ASP, PHP, Perl, Coldfusion)?  Is the utility accessible to the web server and how?  Is this an Internet page or part of some intranet page?

HTML on its own isn't dynamic and can't "create" a drop down.  Clientside script can do it but usually won't be able to access data on the web server, especially if the page is an Internet page.  Please provide answers to the questions above and those details will hopefully clear this up and let us answer better.

Let me know if you have any questions or need more information.



Mr SCott:

I work with my database on a Unisys mainframe, accessed by COBOL, and at the fron-end is a web page to querry and update the DB. The internet page is built with HTML & JS.
THe utility that I am referring to is WEBPCM that sits in between the client, the mainframe and the server. It verifies the request from the client, pulls the data from the mainframe and send it to the server. The mainframe is Unisys system. We have a number of applications with HTML, JavaScript & COBOL accessing data and editing the data on the mainframe.
The web service itself is menu-driven, in the sense: we have a number of options on the home page. Each option has links and input fields to "SUBMIT" to the server to get the results. The system works fine.
Just as we fill the input fields and then submit the request, I need a drop-down box the values of which need to be dynamically filled (by pulling the data from the database at the time of initial handshake) and then submit the querry request.
To be more specific, if the data against the query is availabke for the months of October 2006 through March 2007, The drop down box for the month will display only October, November, December, January, February & March. The drop down box for the year will have only 2006 & 2007.
I have no problem in getting these months and years to the COBOL at the instant of initial hand-shake. But how to move them to the HTML drop down box?

Shall be grateful for the solution.


Is my question in the "Neglected List"?
Mr Scott: Can you please help?

b0lsc0ttIT Manager


This question isn't on the neglected list.  I can put it on the list but I want to ask a few things and make another suggestion.

Which part of that process actually "writes" the html and Javascript?  I am a little confused about it and that will be a key to this.  It seems like that is what you need to change to make the dynamic drop-down work.  I am not real clear how WEBPCM ties into this but that may not be important.  If you disagree then please clarify what it does.  If WEBPCM is the key then what programming or scripting language does it use?

HTML and Javascript alone aren't going to be able to get the info.  HTML isn't dynamic at all so it is no help.  However it sounds like you have something in this process that is making the html and javascript and doing it with the data.  That is what we need to use (assuming I understood you correctly).

Those were the questions and my confusion.  Now for the suggestion.  This question isn't in zones that will help you.  If you'd like to explain a little more I can try to suggest some zones and I can help you close this and open a new question.  As a Zone Advisor I can even change the zones if you want to just move this.  Once we do that then we could look at making this "neglected."  Making this neglected as it is now will just alert experts in these zones and I doubt that is your best audience (Homesite and HTML).  If COBOL is producing the html/javascript and accessing the data then it would be one of the zones I would suggest.

Let me know what you think of this and how you want to proceed.  I will do what I can to help.  Even if it is out of my expertise I can help you get experts to see it.  If I have misunderstood something then let me know.  In some ways I hope that is the case and, with that clarification, I will be able to suggest the simple solution.  I am not holding my breath on that though. ;)



Dear Mr Scott:

As I have already mentioned in the previous mail, I am able to pull the data from the database and pass it to the HTML at "ONLOAD".

The data which is to be displayed on the form is availabke for the months of October 2006 through March 2007 in the database. At "onload", the months are pulled by COBOL and available to the html in the array defined as
     var MonthsIn [];
I am able to populate the MonthsIn[] with the months October through March, and display the array fields in the javascrpt as  MonthsIn[0] = October, MonthsIn[1] = November, etc using the alert().

Similarly, the years are available in another array
     var YearsIn [] and YearsIn[0] = 2006,  YearsIn[1] = 2007.

I need to create drop-down boxes on the form using the JavaScript (JS function called by html).

The drop down box for the months need to have the values October, November,..., March only.
If "December" is selected, value 12 sould be returned by the function like the <select> element of the html:

<select name = "month">
 <option value = "12"  >December</option>
<option value ="01"  >January</option>

 Similarly for the years.

I have tried, but the script is not returning the required results.

Please let me know if you need any further clarification.

Thanks in advance!


The drop down box for the month will display only October, November, December, January, February & March. The drop down box for the year will have only 2006 & 2007.
b0lsc0ttIT Manager

That doesn't really clear up what I really need.  I am afraid a point I have tried to make is getting missed.  Let me see if I can do better this time.

HTML doesn't have variables.  It isn't dynamic at all.  It sounds like COBOL may be making the html but your description is misleading so I am not sure that is the case.  Nothing could possibly be passed to html, whether onload or at some other time.  It may help if you show and example and explain what you think is the array "available to html."  I think this may be Javascript but parts of it do not look like Javascript.  Since it is the "array" part that is a concern.

You did clarify what you wanted in the drop downs and that helped a lot.  Thanks!  I hope my explanation and info above helps.  Let me see the html page you get.  Let me know if you need steps to get this.  If the info for the drop downs is there in javascript then hopefully I just need to add to it.  However it would seem that if you could add javascript you could modify what makes the html and javascript to do what you want.  It is much better to send the right stuff to the browser instead of depending on javascript (and thus the browser) to do the work.

Let me know if anything I have said isn't clear.



Dear Scott:

I am sorry if I was not clear about the variables and arrays availabe to the HTML.

As we can embedd the JS statements within HTML with <script> and </scipt> tags, and variables can also be included here (as in the JS), can I say that we can have variables within HTML? I was not explicit on this in my comments last time. Again sorry about that.

Similarly, the WEBPCM has arrays that can be defined within JS, and this can be put in the HTML within the <script> </scrpt> tags.

An example:

<form ...>
<table  ...>

<script type = "text/javascript", language= "JavaScript">
var MonthsIn = [$replace-begin "replace=COB-MONTH",$replace-end];

MonthsIn is the array to hold the element COB-MONTH.
The COB-MONTH variable is defined within COBOL, again in an array within the COBOL. At the initial process, COBOL populates the COB-MONTH values within its WORKING-STORAGE. If the data available in the Database is for the months of August through December, the COBOL assigns the values to COB-MONTH as follows:


Thease values are passed to the HTML at initialization and availabe to HTML at "onload" event.

The JavaScript can access these values as MonthsIn[0], MonthsIn[1], MonthsIn[2], etc. , where

MonthsIn[0] = "AUGUST"
MonthsIn[1] = "SEPTEMBER"
MonthsIn[2] = "OCTOBER"
MonthsIn[4] = "NOVEMBER"
MonthsIn[5] = "DECEMBER"

I am able to display these with alert(). Now I want to build the drop-down box that will use the array values "AUGUST" through "DECEMBER".

I was trying a javascript function to format the statements for the array on the following lines:  

function getMyMonth(Mthcode)
for (var i =0; i < MonthsIn.length - 1; i+=1)
var month = MonthsIn[i];

Line1 = " '</select id = "MonthId" name= "Month" size=1>' ;
Line2 = " '<option value = " ' +(value to be passed) + '>' + month + '</option>' ;
Line3 = " '</select>';

HtnlLine = Line1+Line2+Line3;
return HtmlLine;

I am still working on it, and meanwhile trying to get some help too.



Was reading your thread and my interest got peaked.    I use JS scripts a lot in my development sites.

I believe the answer to your question is within your reach.  
Just wrap your 'generated' html code in a statement
     document.write(' ---html code --- ');.  

Dont see a need for the function.  Here is what I wrote up for you....  First write is only created once for the Select drop-down code.  Then we have multiple Options, which are handled by the loop.
And last, you close of the Select with the ending format.

Should look like this...

document.write('</select id = "MonthId" name= "Month" size=1>' ;
for (var i =0; i < MonthsIn.length - 1; i+=1)
      document.write('<option value = " ' + (value to be passed) + '>' + MonthsIn[i] + '</option>' ;

No testing has been done on this code, but I'll help you try to debug it.



Thanks Bob!

Explore More ContentExplore courses, solutions, and other research materials related to this topic.