Apex Code Development You need to sign in to do that
Don't have an account?
Tyler Harris 8 actionFunction not rerendering values
I'm running into an issue with an Action Function rerendering, but values do not appear. Upon selection of a country this should rerender the State section and the corresponding state values should appear. Instead I'm not seeing anything. This is working in VF API version 29, but not 40.
On the country field, onchange, it fires a function displayStates() which calls rerenderStates();. However, when rerender occurs, no state values appear. Any help would be appreciated.
Apex
Visualforce
On the country field, onchange, it fires a function displayStates() which calls rerenderStates();. However, when rerender occurs, no state values appear. Any help would be appreciated.
Apex
public class complianceInquiryTool {
objCase = new Case();
objCase.RecordTypeId = Schema.SObjectType.Case.getRecordTypeInfosByName().get('Compliance').getRecordTypeId();
characters = new List<String>{'a','b','c','d','e','f','g','h',
'i','j','k','l','m','n','o','p','q','r','s','t','u','v','w',
'x','y','z','1','2','3','4','5','6','7','8','9','0'};
useragent = ApexPages.currentPage().getHeaders().get('User-Agent');
strLanguageCode = apexpages.currentpage().getparameters().get('lang');
getCountriesSelectList();
}
public List<SelectOption> getCountriesSelectList(){
options = new List<SelectOption>();
options.add(new SelectOption('', 'Select Country'));
// Find all the countries in the custom setting
Map<String, Countries__c> countries = Countries__c.getAll();
// Sort them by name
List<String> countryNames = new List<String>();
for(Countries__c cntry :countries.values()){
countryNames.add(cntry.Country__c);
}
countryNames.sort();
// Create the Select Options.
for (String countryName : countryNames) {
//Countries__c country = countries.get(countryName);
//options.add(new SelectOption(country.Name, country.Country__c));
options.add(new SelectOption(countryName, countryName));
}
return options;
}
public List<SelectOption> getStatesSelectList() {
List<SelectOption> options = new List<SelectOption>();
// Find all the states we have in custom settings.
Map<String, States__c> allstates = States__c.getAll();
// Filter states that belong to the selected country
Map<String, States__c> states = new Map<String, States__c>();
for(States__c state : allstates.values()) {
system.debug(this);
if (state.Country__c == this.country) {
states.put(state.Name, state);
}
}
// Sort the states based on their names
List<String> stateNames = new List<String>();
stateNames.addAll(states.keySet());
stateNames.sort();
// Generate the Select Options based on the final sorted list
for (String stateName : stateNames) {
States__c state = states.get(stateName);
options.add(new SelectOption(state.State__c, state.Name));
}
// If no states are found, just say not required in the dropdown.
if (options.size() > 0) {
options.add(0, new SelectOption('', '-- N/A --'));
} else {
options.add(new SelectOption('', system.label.Case_State_Not_Req));
//options.add(new SelectOption('', 'Not Required'));
}
return options;
}
public Integer randomNumber(){
Integer random = Math.Round(Math.Random() * characters.Size());
if(random == characters.size()){
random--;
}
return random;
}
public String getChar1(){
char1 = characters[randomNumber()];
secCode = char1;
return char1;
}
public String getChar2(){
Char2 = characters[randomNumber()];
secCode += char2;
return Char2;
}
public String getChar3(){
char3 = characters[randomNumber()];
secCode += char3;
return char3;
}
public String getChar4(){
char4 = characters[randomNumber()];
secCode += char4;
return char4;
}
public String getChar5(){
char5 = characters[randomNumber()];
secCode += char5;
return char5;
}
public String getChar6(){
char6 = characters[randomNumber()];
secCode += char6;
return char6;
}
public PageReference validate(){
if(input.length() == 6 && input.subString(0,1) == char1 && input.subString(1,2) == char2 && input.subString(2,3) == char3 && input.subString(3,4) == char4 && input.subString(4,5) == char5 && input.subString(5,6) == char6){
// result = 'Whoohoo! You got it right.';
return saveCase();
}else{
// result = 'Come on...the letters aren\'t matching the image.';
return null;
}
}
public PageReference saveCase(){
// Datetime cDT = System.now();
// LongDate = cDT.format('EE MMM dd yyyy HH:mm:ss Z');
Countries__c con = [SELECT Region__c From Countries__c Where Country__c =:country];
PageReference pr = null;
List<Contact> conList = new List<Contact>();
conList = [SELECT Id FROM Contact WHERE Email =: email AND Phone =: objCase.Contact_Phone_Web__c AND Status__c = 'Active'];
if(conList.size() == 1){
objCase.ContactId = conList[0].Id;
}
objCase.Region__c = con.Region__c;
objCase.SuppliedEmail = email;
objCase.Subject = objCase.Description.abbreviate(20);
objCase.Origin = 'Web Form: Compliance Tool';
objCase.Description = 'Problem: '+ '\n \n' + 'First Name: '+ first_name + '\n' + 'Last Name: '+last_name+'\n'+ 'Title: '+ title + '\n' + '\n' + 'Product: '+ objCase.Product__c + '\n'+ 'Model: ' + objCase.Model__c + '\n' + '\n' +
'Company: '+ company +'\n' + 'City: '+city +'\n';
if(State == null){
State = '';
}
objCase.Description = objCase.Description + 'State: '+ State + '\n'+ 'Country: '+ country + '\n' + 'Region: '+ con.Region__c + '\n' + 'ZIP Code: '+ zipCode +'\n'+ 'Telephone: ' + objCase.Contact_Phone_Web__c +'\n'+ 'Fax: '+ fax+'\n'+'Email: '+email+'\n'+'Confirm Email: '+confirmEmail+'\n'+'Remedy Problem: ' + + 'Submit Time: ' + '\n'+ 'IP Address: '+ ipAddress + '\n' + 'User Agent: ' + useragent + '\n';
if(objCase.Priority == null){
objCase.Priority = '';
}
objCase.Description = objCase.Description + 'Language: '+ objCase.Case_Language__c + '\n' + 'Product: '+ objCase.Product__c + '\n'+ 'Model: ' + objCase.Lumidigm_Part__c + '\n';
objCase.RecordTypeId = Schema.SObjectType.Price_Authorization_Form__c.getRecordTypeInfosByName().get('Compliance').getRecordTypeId();
AssignmentRule AR = new AssignmentRule();
AR = [select id from AssignmentRule where SobjectType = 'Case' and Active = true limit 1];
if(AR != null){
//Creating the DMLOptions for "Assign using active assignment rules" checkbox
Database.DMLOptions dmlOpts = new Database.DMLOptions();
dmlOpts.EmailHeader.TriggerUserEmail = true;
dmlOpts.assignmentRuleHeader.assignmentRuleId= AR.id;
dmlOpts.EmailHeader.triggerAutoResponseEmail = true;
objCase.setOptions(dmlOpts);
insert objCase;
CaseNumber = [SELECT CaseNumber FROM Case where id =: objCase.Id].CaseNumber;
//pr.getParameters().put('cid',objCase.id);
pr = new PageReference('/apex/ThankYouPage' + '?cid=' + objCase.Id);
}
return pr;
}
}
Visualforce
<apex:page docType="html-5.0" standardStylesheets="false"
</head>
<body>
<apex:actionFunction name="rerenderStates" rerender="compTool" >
<apex:param name="firstParam" assignTo="{!country}" value="" />
</apex:actionFunction>
<div class="container">
<div class="col-md-8">
<div class="form-area">
<br style="clear:both"/>
<p style="margin-bottom: 25px; text-align: left;">Please let us know what product you need support with below:</p>
<div class="alert alert-warning" id="alertz" role="alert" style="display:none;" >
</div>
<div class="form-group">
<label class="">Nature of Request</label>
<span class="required">*</span>
<apex:inputField styleClass="form-control" id="nature" html-placeholder="Nature of Request" value="{!objCase.Nature_of_Request__c}" required="true" />
</div>
<div class="form-group">
<label class="">{!$Label.Case_Language}</label>
<span class="required">*</span>
<apex:inputField styleClass="form-control" id="language" html-placeholder="{!$Label.Case_Language}" value="{!objCase.Case_Language__c}" required="true" />
</div>
<div class="form-group ">
<label class="">Product Family</label>
<span class="required">*</span>
<apex:inputField styleClass="form-control " id="product" html-placeholder="Product Family" value="{!objCase.Product__c}" required="true" />
</div>
<div class="form-group ">
<label class="">Model and P/N</label>
<span class="required">*</span>
<apex:inputField styleClass="form-control " id="model" html-placeholder="Model & PN" value="{!objCase.Lumidigm_Part__c}" required="true" />
</div>
<div class="form-group">
<label class="">Please describe the problem you are having</label>
<span class="required">*</span>
<apex:inputTextarea styleClass="form-control " id="message" html-placeholder="Please describe the problem you are having:" rows="7"/>
</div>
<div>
<p>Tell us how we can reach you below:</p>
</div>
<div class="form-group ">
<label class="">{!$Label.conFirstName}</label>
<span class="required">*</span>
<apex:inputText id="first_name" styleClass="form-control" html-placeholder="{!$Label.conFirstName}" value="{!first_name}" required="true" />
</div>
<div class="form-group ">
<label class="">{!$Label.conLastName}</label>
<span class="required">*</span>
<apex:inputText id="last_name" styleClass="form-control" html-placeholder="{!$Label.conLastName}" value="{!last_name}" required="true" />
</div>
<div class="form-group ">
<label class="">{!$Label.conTitle}</label>
<span class="required">*</span>
<apex:inputText id="title" styleClass="form-control" html-placeholder="{!$Label.conTitle}" value="{!title}" />
</div>
<div class="form-group ">
<label class="">{!$Label.conCompany}</label>
<span class="required">*</span>
<apex:inputText id="company" styleClass="form-control" html-placeholder="{!$Label.conCompany}" value="{!company}" />
</div>
<div class="form-group">
<label class="">{!$Label.conCity}</label>
<span class="required">*</span>
<apex:inputText id="city" styleClass="form-control" html-placeholder="{!$Label.conCity}" value="{!city}" />
</div>
<div class="form-group ">
<label class="">{!$Label.conCountry}</label>
<span class="required">*</span>
<apex:selectList styleClass="form-control" size="1" id="country" html-placeholder="{!$Label.conCountry}" value="{!country}" required="true" onchange="return displayStates(this.value);">
<apex:selectOptions value="{!options}"/>
</apex:selectList>
</div>
<apex:outputPanel id="statePanel">
<div class="form-group">
<label class="">State</label>
<span class="required" style="display:none;">*</span>
<apex:selectList styleClass="form-control" id="stateList" size="1" value="{!State}" >
<apex:selectOptions value="{!StatesSelectList}"/>
</apex:selectList>
</div>
</apex:outputPanel>
<div class="form-group">
<label class="">{!$Label.conPostalCode}</label>
<span class="required">*</span>
<apex:inputText id="zip" styleClass="form-control" html-placeholder="{!$Label.conPostalCode}" value="{!zipCode}" />
</div>
<div class="form-group ">
<label class="">Phone Number</label>
<span class="required">*</span>
<div class="input-group">
<span class="input-group-addon"><span class="glyphicon glyphicon-phone-alt" aria-hidden="true"></span></span>
<apex:inputText id="tel" styleClass="form-control" html-placeholder="Phone Number" value="{!phone}" required="" />
</div>
</div>
<div class="form-group ">
<label class="">Email</label>
<span class="required">*</span>
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-envelope" aria-hidden="true"></i></span>
<apex:inputText id="email" styleClass="form-control" html-placeholder="Email @" value="{!email}" required="true" />
</div>
</div>
<div class="form-group">
<label class="">Confirm Email</label>
<span class="required">*</span>
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-envelope" aria-hidden="true"></i></span>
<apex:inputText id="confirmemail" styleClass="form-control" html-placeholder="Confirm Email @" value="{!confirmEmail}" required="true" />
</div>
</div>
<div class="form-group">
<label class="">Match Security Code</label>
<span class="required">*</span><div style="float: right;">
<apex:outputPanel layout="block" styleClass="boxHolder" id="code">
<apex:outputText value="{!char1}" styleClass="coolBlue"/>
<apex:outputText value="{!char2}" styleClass="coolBlue"/>
<apex:outputText value="{!char3}" styleClass="coolBlue"/>
<apex:outputText value="{!char4}" styleClass="coolBlue"/>
<apex:outputText value="{!char5}" styleClass="coolBlue"/>
<apex:outputText value="{!char6}" styleClass="coolBlue"/>
</apex:outputPanel>
</div>
<apex:inputText styleClass="form-control" id="secuCode" html-placeholder="Match Security Code" value="{!input}" style="float:left;"/>
</div>
<center>
<apex:commandButton styleClass="btn btn-primary pull-right" id="submit" value="Submit" onclick="validateEmail()">
<apex:actionFunction name="callValidate" action="{!validate}" />
</apex:commandButton>
</center>
</div>
</div>
</div>
</body>
</apex:form>
<script>
function validateEmail() {
var emailText = document.getElementById('{!$Component.compTool:email}').value;
var pattern = /^[a-zA-Z0-9\-_]+(\.[a-zA-Z0-9\-_]+)*@[a-z0-9]+(\-[a-z0-9]+)*(\.[a-z0-9]+(\-[a-z0-9]+)*)*\.[a-z]{2,4}$/;
var droptext = document.createElement('p');
droptext.innerHTML="{!$Label.conEmailmessage}" + emailText ;
var alertGrab = document.getElementById('alertz');
if (emailText != ''){
if (pattern.test(emailText)) {
confirmEmail();
} else {
alertGrab.appendChild(droptext);
alertGrab.style.display="block";
}
}else{
validate();
}
//validate();
return false;
}
function confirmEmail(){
var email = document.getElementById('{!$Component.tktForm:email}').value;
var confEmail = document.getElementById('{!$Component.tktForm:confEmail}').value;
var droptext = document.createElement('p');
droptext.innerHTML="{!$Label.conEmailmessage2}" + emailText ;
var alertGrab = document.getElementById('alertz');
if(email != confEmail){
alertGrab.appendChild(droptext);
alertGrab.style.display="block";
return false;
}else{
validate();
}
return false;
}
function displayStates(selcntry){
console.log(selcntry);
setStatelanguage();
rerenderStates(selcntry);
return false;
}
</script>
</apex:page>