+ Start a Discussion
SteveAtGFISteveAtGFI 

Pass data to controller when select is changed

I have a select that is a list of products. I'd like to make it to where I could select a product and the product I've chosen would be sent to my controller.

 

From what I've read, you can do this with a form submission. However, I want it to happen as soon as the user selects something. This is because I have a submission form I'm building that needs to have custom elements displayed, based on which product is selected.

 

Here's some code I have for the select:

 

           <th> {!productPrompt} </th>
                <td>
                     <apex:selectList id="products" value="{!products}" size="1" >
                        <apex:actionSupport event="onchange" rerender="thepage" />
                        <apex:selectOptions value="{!items}"/>
                    </apex:selectList><br/>
                </td>

 

And here's part of the controller:

 

public String[] products = new String[] {};  

public String[] getProducts() {
        return products;
    }
   
    public void setProducts(String[] products) {
        this.products= products;
    }
   

 

This seems like it should be simple, but it simply won't work. Any advice?

 

 

Best Answer chosen by Admin (Salesforce Developers) 
SteveAtGFISteveAtGFI

I found this thread that answered how to do it:

 

http://boards.developerforce.com/t5/Visualforce-Development/Hiding-the-section-based-on-Picklist-value/td-p/203392

 

The trick is that the variable is set through the controller and you can then access it through an if statement. Simple enough.

All Answers

TejTej

you can do this through <apex:actionFunction>

 

where you can send the parameter to controller on click or on change , in your case the pick list value.

 

You have tow rite a simple javascript function to invoke the controller method with the sent parameter.

 

refer to that tag in component library.

Cory CowgillCory Cowgill

You almost have it already.

 

Just add action="{!setProductVal}" attribute in your <apex:actionSupport> tag.

 

<apex:selectList style="font-size:24pt;" value="{!radiusValue}" size="1">
    <apex:actionSupport id="radiusChangeId" event="onchange" action="{!iFoundYou}" status="searchStatus" rerender="jsvalues1"/>
    <apex:selectOptions value="{!radiusOptions}"/>
</apex:selectList>

 

That will use AJAX to execute the method on your controller without completely rerendering the page.

SteveAtGFISteveAtGFI

Hi Cory,

 

I've tried every combination I can think of, but it's still not seeming to work - or even save. Here's the revamped select:

 

                     <apex:selectList id="products" value="{!products}" size="1" >
                        <apex:actionSupport event="onchange" action="{!setProduct}" />
                        <apex:selectOptions value="{!items}"/>
                    </apex:selectList><br/>

 I do not have any "Setproductval" method to call. And I'm not sure what you're referencing in "FoundYou?" Do I need to write another method? How could I pass a value to that method? I just feel like I'm missing something rather obvious that is available in other programming languages like C++/C#/Java.

Cory CowgillCory Cowgill

Take a look at the tag example here:

 

 

http://www.salesforce.com/us/developer/docs/pages/Content/pages_compref_actionSupport.htm



 

Visualforce and Apex is a wrapper on top of JSF (Java Server Faces). In fact, if you look at the generated HTML you'll see its JSF generated id's.

 

If you are familiar with Java and JSF which are industry standards for Web Development, you'll see it's almost identical in many respects ( bean names, render attibute, status atttribute etc) since under the hood it is Java and JSF, but a layer of abstraction on top to allow multi-tenancy.

 

<apex:actoinSupport> will fire the controller method set in the action attribute when the onchange event fires for the <apex:selectList>.

 

Values that you have bound between the Visualforce PAge (View) and Apex Class(Controller) are available to the method to perform work on. You need to specify a rerender attribute with an ID of an HTML element (<apex:blockSection> or whatever) to update the view layer (Visualforce PAge) so that your updates are displayed on the screen.

 

 

 

 

 

 

SteveAtGFISteveAtGFI

Right - good example. But the issue is here that I need to pass a value to the method in the controller. If someone changes the list, the method needs to take the value in that select and then hand that value to the controller. Otherwise, how can the controller tell what the user in the view has selected?

 

Basically:

 

1. I pick something

2. I fire the method in my controller and pass something like a "this" or "selected item"

3. Do stuff on the backend

4. ???

5. Profit

 

Make sense? I hate asking such newbie stuff. hah! :)

SteveAtGFISteveAtGFI

I found this thread that answered how to do it:

 

http://boards.developerforce.com/t5/Visualforce-Development/Hiding-the-section-based-on-Picklist-value/td-p/203392

 

The trick is that the variable is set through the controller and you can then access it through an if statement. Simple enough.

This was selected as the best answer
Michael SobczakMichael Sobczak
This is a really old post, but I stumbled into the same issue today.  The id attribute of the apex:SelectList can't be the same as the controller property you're trying to set. For example, this will work:
 
​<th> {!productPrompt} </th> 
<td> 
<apex:selectList id="productsField" value="{!products}" size="1" > 
<apex:actionSupport event="onchange" rerender="thepage" /> 
<apex:selectOptions value="{!items}"/> 
</apex:selectList><br/> </td>

VisualForce and Apex seems to get confused when the field "id" matches the controller property associated with the field's value property.