You need to sign in to do that
Don't have an account?
How to get the value add to selectlist using javascript?
I have two selectList,list1 and list2. the option of list2 is add according the selected item in list1 automaticly in javascript.
the code is:
<script>
var hotel=new Array();
var brand=new Array();
var type=new Array();
<apex:outputText escape="false" value="{!MyHotel}"></apex:outputText>
<apex:outputText escape="false" value="{!MyBrand}"></apex:outputText>
<apex:outputText escape="false" value="{!MyType}"></apex:outputText>
function list2(list2id,n)
{
var list=document.getElementById(list2id);
for(var i=list.length-1;i>=0;i--)list.remove(i);
for(var i=0;i<hotel.length;i++)
list.add(new Option(hotel[i],hotel[i]));
}
</script>
<apex:outputPanel id="result">
<apex:form >
<b>Report By: </b>
<apex:selectList id="list1" multiselect="false" size="1" value="{!reporttype}" onchange="list2('{!$Component.list2}');">
<apex:selectOption itemValue="1" itemLabel="Hotel"></apex:selectOption>
<apex:selectOption itemValue="2" itemLabel="Hotel Brand"></apex:selectOption>
<apex:selectOption itemValue="3" itemLabel="Hotel Type"></apex:selectOption>
</apex:selectList>
<b>Please select :</b>
<apex:selectList id="list2" multiselect="false" size="1" value="{!reportby}">
</apex:selectList>
<apex:commandButton value="Go!" action="{!doSearch}" status="status" reRender="result"/>
<apex:form>
</apex:outputPanel >
the problem is I can't get the value of reportby in my apex, where is the problem?
Hi.....
Once you get component by getElelmentById, just treat it as normal HTML component to get value like:
var sel = document.getElementById('sbox').selectedIndex;
var xx = document.getElementById('sbox').options[sel].text;
All Answers
Hi..
Use this directly in your javascript it should work....
document.getElementById("{!$component.SchemaApp.<your componenet Id>}");
Note: SchemaApp is id of <apex:form>
hi,I can get the selected value in javascript,but i can't get the value of 'reportby' in my apex class,
<apex:selectList id="list2" multiselect="false" size="1" value="{!reportby}">
</apex:selectList>
i don't knew why
Hi.....
Once you get component by getElelmentById, just treat it as normal HTML component to get value like:
var sel = document.getElementById('sbox').selectedIndex;
var xx = document.getElementById('sbox').options[sel].text;
Hi....
This select list doesnt have any selectoptions in it ........might be bcoz of that u r
not getting the value in reportBy in the apex class.
<apex:selectList id="list2" multiselect="false" size="1" value="{!reportby}">
<!-- Write the code for Select Options here -->
</apex:selectList>
Just giving feedback here a I used this post to get value from an apex:selectlist in a Javascript section.
What is above is very right, thanks a lot for the answers, and drive me the result, but I had some additionnal issues:
First it didn't work because I put partiel id. If my <apex:selectlist> is as the following
<apex:selectlist id="list2"...
Doing:
vSelectedItem = document.getElementById("list2").selectedIndex;
vFieldName = document.getElementById("list2").options[vSelectedItem].text;
Will not work (as mentionned somewhere above), I had to put the full ID. In my case:
vSelectedItem = document.getElementById("tPage:tForm:filterList:aPageBlockTable:iFieldName").selectedIndex;
vFieldName = document.getElementById("tPage:tForm:filterList:aPageBlockTable:iFieldName").options[vSelectedItem].text;
Question: How to get the full ID ? First, set the id of each element in the tree, then open Chrome Console (CTRL+SHIFT+I) and inspect the element, you'll find nearby the full ID (It seems obvious, except when you don't know it).
In my case, an other difficulty, the <apex:selectoption > was a row of a table, and could be row 1, row 2, row 3... Depending on the row, the id, which depends the path, is dynamic:
For row 1: "tPage:tForm:filterList:aPageBlockTable:0:iFieldName"
...
I dealt with this with a litlle of Javascript that set up a javascript variable with the row ID. See below:
In the apex code, I have a variable at the class level, that is accessible from outside (see default get and set).
public String vIndexToQuery { get; set; }
At the top of the page, I have javascript script to store the value locally:
<script type="text/javascript">
In the table, close to the apex:selectList tag, I have again a small piece of code:
<apex:selectList value="{!vSelectedField}" size="1" id="iFieldName">
<script>setIndexToQuery({!vIndexToQuery});console.log('INDEX TO QUERY '+{!vIndexToQuery});</script>
Dealing in such way will allow stuff to work even with partial page refresh (using the rerender tag). In my case, the main javascript is not rerendered but the value of vIndexToQuery is updated anyway when the part below is updated.
Hope this post will save few hours to some of you ;-)