dcsimg
www.webdeveloper.com
Results 1 to 3 of 3

Thread: Java Script: Problem with HTML Drop Down List

  1. #1
    Join Date
    Jul 2009
    Posts
    2

    Question Java Script: Problem with HTML Drop Down List

    Hi,

    I am very new t HTML/Java Script. I am bulding a web page where i have drop down lists.

    My requirement is, I have two different drop down lists. I am displaying values in the second drop down list on the basis of value selected in First drop down list.

    Problem is when i select value from first drop down list and resubmit the form, value in first drop down vanishes.

    I want to achieve that when the value in first drop down changes (onChange Function) then web page will be reloaded and the values in second drop down will be displayed. and it will be displaying the selected value in first drop down as well.

    If some have any idea how to do it or some piece of code available, it will be really great.

    Thanks in Advance.

    Regards,
    Mangat Rai

  2. #2
    Join Date
    Jun 2008
    Posts
    62
    It is easier to do without reloading the page.

    In case you want only one set of values to be submitted, take a look at this for example:
    HTML Code:
    <!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" />
    <title>Unbenanntes Dokument</title>
    <script type="text/javascript" language="javascript">
      var suboptions = new Array();
      suboptions.push(null);
      suboptions.push(new Array('sub1.1','sub1.2','sub1.3'));
      suboptions.push(new Array('sub2.1'));
      suboptions.push(new Array('sub3.1','sub3.2'));
      
      function loadSecondSelect(index) {
        var e = document.getElementById('someOtherSelect');
        if (index > 0) {
          clearElement(e);
          for (var i=0; i<suboptions[index].length; i++) {
            var opt = document.createElement('option');
            opt.value = suboptions[index][i];
            opt.innerHTML = suboptions[index][i];
            e.appendChild(opt);
          }
          e.style.display = 'inline';
        } else {
          clearElement(e);
          e.style.display = 'none';
        }  
      }
      
      function clearElement(e) {
        while (e.hasChildNodes()) e.removeChild(e.lastChild);
      }
    </script>
    </head>
    <body>
      <form id="someForm" action"example.com">
        <p><select name="someSelect" onchange="loadSecondSelect(this.options.selectedIndex);">
          <option></option>
          <option>first option</option>
          <option>second option</option>
          <option>third option</option>
        </select></p>
        <p><select id="someOtherSelect" name="someOtherSelect" style="display:none;">
        </select></p>
      </form>
    </body>
    </html>

  3. #3
    Join Date
    Jul 2009
    Posts
    2

    Post

    Hi..
    thanks a lot for quick reply.

    I am building DSP pages. and I have a requirement of reloading the page. My web Page is connected to webMethods65 flow services. Value in second list comes on the basis of output of flow services. This flow service will execute only if the page reloads

    So I have to reload the page otherwise i will not be able to execute the flow service.

    At moment i have written code as per below

    function getValues(operation) {
    if(operation == 'FUNCLookup') {
    if (document.propFile.V_ENVNAME.value != 'default') {
    document.propFile.ENVSelected.value = document.propFile.V_ENVNAME.value;
    document.propFile.action.value = "DRpropfileView.dsp";
    document.propFile.submit();

    } else {
    document.propFile.action.value = "DRpropfileView.dsp";
    document.propFile.submit();
    }
    }

    And the body part is

    <form name="propFile" id="propFile">

    <input type="hidden" name="ENVSelected">
    <select name="V_ENVNAME" id="V_ENVNAME" onChange="getValues('FUNCLookup')">
    <option value="default">Select Environment</option>

    %invoke flowService%
    %loop %

    <option %ifvar WM_LINENAME vequals(ENVSelected)% selected %endif% value="%value WM_LINENAME%">%value WM_LINENAME%</option>
    %endloop%
    </select>
    %onerror%
    %include onError.txt%
    %endinvoke flowService%

    according to me i have some issue with the if condition marked in bold.

    hope now i am clear with my requirement.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles