+ Start a Discussion
Nigel Fisher 26Nigel Fisher 26 

getting value of simple html picklist

Hi

I know this is a really basic question but I am just gettign started.

I have the code but the inout box is not getting populated.

It would be really helpful if someone could pont me in the right direction.

I am hoping to do this wothout an apex class
 
<apex:page standardController="Lead" doctype="html-5.0">

    <head>
        
  <body>
      
      
   <apex:form id="form1">
    <apex:selectList multiselect="false" size="1" id="selectedCountry" onselect="SelectAPICountry()">

         <apex:selectOption itemValue="ie" itemLabel="Ireland"/>
         <apex:selectOption itemValue="gb" itemLabel="Northern Ireland"/>
         <apex:selectOption itemValue="ni" itemLabel="Great Britain"/>
      </apex:selectList>
        <apex:input size="20" label="country id" id="countryid"/>
    </apex:form> 

  
   <script type="text/javascript">
function SelectAPICountry() {
                document.getElementById('{!$Component.form1.countryid}').value = document.getElementById('{!$Component.form1.selectedCountry}').value;
            }

</script>
          </body>
</head>
          
    </apex:page>
Much appreciated 
 
Naga  AlapatiNaga Alapati
Hi Nigel,

Try using "onchange" event 
<apex:page standardController="Lead" doctype="html-5.0">
	<apex:form id="form1">
        <apex:selectList multiselect="false" size="1" id="selectedCountry" onchange="SelectAPICountry()">
			<apex:selectOption itemValue="ie" itemLabel="Ireland"/>
            <apex:selectOption itemValue="gb" itemLabel="Northern Ireland"/>
            <apex:selectOption itemValue="ni" itemLabel="Great Britain"/>
        </apex:selectList>
        <apex:input size="20" label="country id" id="countryid"/>
    </apex:form>
	<script type="text/javascript">
		function SelectAPICountry() {
            document.getElementById('{!$Component.form1.countryid}').value = document.getElementById('{!$Component.form1.selectedCountry}').value;
        }
	</script>
</apex:page>

Regards,
Naga
Nigel Fisher 26Nigel Fisher 26
That is very kind, thank you.

So does this mean i can assign a var in the same way?

var x = document.getElementById('{!$Component.form1.selectedCountry}').value;

Much appreicted
 
Naga  AlapatiNaga Alapati
yeah. You can do that way too
<script type="text/javascript">
		function SelectAPICountry() {
		    var selectedCountry = document.getElementById('{!$Component.form1.selectedCountry}').value;
            document.getElementById('{!$Component.form1.countryid}').value = selectedCountry;
        }
	</script>

Regards,
Naga
Nigel Fisher 26Nigel Fisher 26
Thats great thank you.

The biggest challenge Igave now is to set a parament to be used in a control from the var "after" it has been set from the selectist, and then pass to the control. I expect that this might need to be in two block sections with a "render" setting for the second one where the control sits.
 
<apex:form id="form1" >
        <apex:pageBlock >
        <apex:pageBlockSection id="countrycodesection" >

<div id="myControl">
<script type="text/javascript">

$ = jQuery.noConflict(); 
$(function(){ 
$("#myControl").html(""); 
$("#myControl").xxxxxxx({ 
key : "{!$Label.addressFinderLicenseKey}", 
country : 'gb'

function SelectAPICountry() {
		    var selectedCountry = document.getElementById('{!$Component.form1.selectedCountry}').value;
            document.getElementById('{!$Component.form1.countryid}').value = selectedCountry;
        }
 </script>  
 </apex:pageBlockSection>
        </apex:pageBlock>
        </apex:form>

I want to be able to set the contry : 'gb' to whatever value I have set the var "selectedCountry" to

I really appreicate your help on this to bettre my understanding