Apex Code Development You need to sign in to do that
Don't have an account?
Vandana Rattan 4 Weird JQuery issue
I am creating VF page to upload and save attachments. Issue I am facing is that when I include jquery-1.9.1.min.js the filename and body are not getting set in controller. When I remove this the attachments are uploaded fine. Has anyone faced such issue? Kindly suggest.
VF Code:
Controller:
Thanks,
Vandana
VF Code:
<apex:page standardController="Case" extensions="NERController" showHeader="false" standardStylesheets="false" docType="html-5.0" applyBodyTag="false" applyHtmlTag="true">
<link href='https://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'/>
<link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'/>
<apex:includeScript id="script2" value="{!URLFOR($Resource.ChargentCases__CreditCardJS, 'bililiteRange.js')}" loadOnReady="false"/>
<apex:stylesheet value="https://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" />
<!--<apex:includeScript value="https://code.jquery.com/jquery-1.9.1.min.js"/>-->
<apex:includeScript value="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"/>
<apex:includeScript value="https://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"/>
<meta http-equiv="X-Frame-Options" content="deny" />
<style>
.inactiveTab { background-color: white; color:black; background-image:none}
.header {
background-color: lightgray;
text-align: left;
color: black;
font-size: 20px;
height: 100px;
/*margin-bottom: 20px;*/
}
.activeTab {
background-color: #e6dead;
text-align: left;
color: black;
font-size: 15px;
height: 20px;
font-family: Open Sans;
font-weight: bold
}
.ui-btn-text{
text-align: left;
}
.requiredBlock {background-color: transparent; }
.requiredBlock::before { content: "*"; font-size: 1.5em; font-weight: bold; color: #c00; }
.inner{
display: block;
position: relative;
margin: .5em 0;
padding: 0;
background-clip: padding-box;
border-radius: 1em;
border: 1px solid #ccc;
background: #eee;
font-weight: bold;
color: #222;
text-shadow: 0 1px 0 #fff;
background-image: linear-gradient( #fff,#f1f1f1 );
z-index: 1;
width: 100%;
-webkit-user-select: none;
}
.ChooseFileContainer {
position:relative;
display:inline;
}
.OverlayButton {
position:absolute;
left:5px;
right:0;
}
</style>
<apex:form id="frm" style="width: 100%; height:100%; background-color: white; display: inline-block; text-align: center;">
<apex:outputPanel id="all" layout="block" style="display: inline-block; text-align: left; width:80%;">
<apex:outputPanel id="header" layout="block" style="background-color: white;">
<!-- This is a Header block. Paste your APEX or HTML code here. -->
<!-- APEX image example: -->
<!--<apex:image value="{!URLFOR($Resource.ChargentBase__ChargentStyling, 'img/Chargent.png')}" style="display: block; margin: 0 auto; margin-bottom: 20px;"/> <!-- height="100px" width="410px" -->
<apex:image url="{!$Resource.NERBanner}" style="display: block; "/>
</apex:outputPanel>
<br></br>
<apex:tabPanel switchType="client" selectedTab="regEligibility" id="tabPanel" tabClass="activeTab" inactiveTabClass="inactiveTab">
<apex:tab label="About You" name="abtYou1" id="abtYou" style="background-color: white;" >
<apex:outputPanel layout="block" styleClass="headersmall">
<h1><apex:outputText value="About You" style="font-family:Open Sans; font-weight:bold;"/></h1>
<apex:outputLabel value="Photo Identification" style="font-family:Open Sans; font-size:15px; font-weight:bold; color:black;"/>
</apex:outputPanel>
<br></br>
<!--<apex:outputPanel layout="block" styleClass="requiredBlock">-->
<div class = "ChooseFileContainer">
<apex:outputLabel value="Please upload a copy of a Primary identification document:" style="font-family:Open Sans; font-size:15px; font-weight:bold; color:black;" for="nerchck8"/>
<apex:inputFile value="{!fileBody}" filename="{!fileName}" />
<!--<input id="CustomChooseFileButton" type="text" size="23" name="CustomChooseFileButton" value="Choose File" class="OverlayButton btn" />-->
</div>
<!--<apex:outputLabel value="Photo Identification" style="font-family:Open Sans; font-size:15px; font-weight:bold; color:black;"/>-->
<!--</apex:outputPanel>-->
<br></br>
<apex:outputPanel layout="block" styleClass="requiredBlock">
<div class = "ChooseFileContainer">
<apex:outputLabel value="Please upload a Passport-style photo:" style="font-family:Open Sans; font-size:15px; font-weight:bold; color:black;" for="nerchck8"/>
<apex:inputFile value="{!fileBody}" filename="{!fileName}" style="padding-left:65px" />
<!--<input id="CustomChooseFileButton" type="text" size="23" name="CustomChooseFileButton" value="Choose File" class="OverlayButton btn" />-->
</div>
</apex:outputPanel>
<!--<input id="CustomChooseFileButton" type="text" size="23" name="CustomChooseFileButton" value="Upload Object Names File" class="OverlayButton btn" />-->
<!--<br></br>
<apex:outputPanel layout="block" styleClass="requiredBlock" id="primID">
<apex:outputText value="Please upload a copy of Primary identification document:" style="font-family:Open Sans; font-size:15px; font-weight:bold;"/>
<apex:actionRegion >
<apex:inputFile value="{!myfile.body}" filename="{!myfile.Name}" style="padding-left:65px" />
<apex:commandButton value="Upload" action="{!upload}"/>
</apex:actionRegion>
</apex:outputPanel>
<apex:outputPanel layout="block" styleClass="requiredBlock" id="pptPhoto">
<apex:outputText value="Please upload a Passport-style photo:" style="font-family:Open Sans; font-size:15px; font-weight:bold;"/>
<apex:actionRegion >
<apex:inputFile value="{!myfile.body}" filename="{!myfile.Name}" style="padding-left:65px" />
<apex:commandButton value="Upload" action="{!upload}"/>
</apex:actionRegion>
</apex:outputPanel>
</div>
<!--<apex:selectList id="stateWorkingIn" value="{!case.Australian_state_primarily_working_in__c}" title="Are you a Member of Engineers Australia" size="1" />-->
<!--</apex:outputPanel>
<apex:actionRegion >-->
<br></br>
<html>
<table style="width:100%">
<tr style="width=100%;">
<td style="align:left;width:20%;"><apex:commandButton id="contAbtYouBtn" value="Continue" action="{!upload}"/></td>
<td><apex:commandLink value="Previous" style="font-family:Open Sans; font-weight:bold;"/></td>
<!--<td style="align:right;width:20%;"><apex:commandButton id="subBtn" value="Submit" action="{!upload}"/></td>-->
</tr>
</table>
</html>
<!--</apex:actionRegion>-->
</apex:tab>
<script type="text/javascript">
$j = jQuery.noConflict();
$j = (function(){
// script that triggers the click of the standard
// choose file button
$('#CustomChooseFileButton').click( function(e) {
$('input[type="file"]').click();});
// script to hide the blinking cursor
$('input[type="text"]').mousedown(function(e) {
e.preventDefault();
$(this).blur();
return false;
});
});
</script>
</apex:page>
Controller:
public class NERController {
public ApexPages.StandardController standardContactController;
public String selectedTab;
public Case objCase;
public boolean val1 {get;set;}
public boolean val2 {get;set;}
public boolean val3 {get;set;}
public boolean val4 {get;set;}
public blob fileBody {get;set;}
public String fileName {get;set;}
// Public Attachment myfile{get;set;}
public List<SelectOption> types{
get{
System.debug('In getTypes>>>>>');
types = new List<SelectOption>();
Schema.sObjectType sobject_type = objCase.getSObjectType();
Schema.DescribeSObjectResult sobject_describe = sobject_type.getDescribe();
Map<String, Schema.SObjectField> field_map = sobject_describe.fields.getMap();
List<Schema.PicklistEntry> pick_list_values = field_map.get('Evidence_of_Engineering_qualification__c').getDescribe().getPickListValues();
//List<selectOption> options = new List<selectOption>();
for (Schema.PicklistEntry a : pick_list_values) {
types.add(new selectOption(a.getLabel(), a.getValue()));
}
System.debug('types>>>>>' + types);
return types;
}
set;}
/*public String getFileName()
{
return this.fileName;
}
public void setFileName(String fileName)
{
this.fileName = fileName;
}
public Blob getFileBody()
{
return this.fileBody;
}
public void setFileBody(Blob fileBdy)
{
this.fileBody = fileBdy;
//setFileSize(this.attach.size());
}
/*Public Attachment myfile{
get {
if (myfile == null)
myfile = new Attachment();
return myfile;
}
set{
System.debug('in set fillllllllllleeeeee'+ myfile);
}
}*/
/*Public Attachment getmyfile()
{
myfile = new Attachment();
return myfile;
}*/
public NERController.NERController(ApexPages.StandardController controller){
standardContactController = controller;
this.objCase =(Case) controller.getRecord();
//myfile = new Attachment();
selectedTab = 'regEligibility';
//System.debug('myfile >>>>' + myfile);
}
public string getselectedtab() {
return selectedtab;
}
public boolean getistab1disabled() {
return selectedTab <> 'regEligibility';
}
public boolean getistab2disabled() {
return selectedTab <> 'nerAreas';
}
public boolean getistab3disabled() {
return selectedTab <> 'abtYou';
}
public boolean getistab4disabled() {
return selectedTab <> 'qual';
}
public void enabletab1() {
selectedtab = 'regEligibility';
}
public void enabletab2() {
selectedtab = 'nerAreas';
}
public void enabletab3() {
selectedtab = 'abtYou';
}
public void enabletab4() {
selectedtab = 'qual';
}
public void find(){
System.debug('in find>>>>');
System.debug('in find>>>> val1' + val1);
}
public ApexPages.Pagereference upload()
{
Id caseId = createCase();
System.debug('caseId>>' + caseId);
System.debug('fileBody>>' + this.fileBody);
System.debug('fileName>>' + this.fileName);
//myfile.parentId = caseId;
Attachment a = new Attachment();
a.body = this.fileBody;
a.name = this.fileName;
a.parentId = caseId;
//myfile.ParentId = caseId;
//myfile.Body = attach;
//myfile.Name = fileName;
/* insert the attachment */
Database.SaveResult result = Database.insert (a);
return null;
}
public Id createCase(){
System.debug('In craete Case' );
Id ftRecTypeId = [SELECT Id from recordType where name='National Engineering Register' and sObjectType='Case' LIMIT 1].id;
//List<Contact> lstct = [Select Id from Contact where EA_Member_No__c=: msaCase.Applicatnt_s_EA_ID__c LIMIT 1];
//System.debug('lstct>>' + lstct[0].Id);
//Id ctId = [Select Id from Contact where EA_Member_No__c=: msaCase.Applicatnt_s_EA_ID__c LIMIT 1].Id;
//Id gatewayId = [Select Id frokm ChargentBase__Gateway__c where Name='eWay Gateway' LIMIT 1].Id;
Case insCase = new Case();
insCase.RecordTypeId = ftRecTypeId;
insCase.Status = 'New';
insCase.Origin = 'Web';
insert insCase;
return insCase.Id;
}
/* public List<SelectOption> getTypes(){
System.debug('In getTypes>>>>>');
Schema.sObjectType sobject_type = case.getSObjectType();
Schema.DescribeSObjectResult sobject_describe = sobject_type.getDescribe();
Map<String, Schema.SObjectField> field_map = sobject_describe.fields.getMap();
List<Schema.PicklistEntry> pick_list_values = field_map.get('Evidence_of_Engineering_qualification__c').getDescribe().getPickListValues();
//List<selectOption> options = new List<selectOption>();
for (Schema.PicklistEntry a : pick_list_values) {
types.add(new selectOption(a.getLabel(), a.getValue()));
}
System.debug('types>>>>>' + types);
return types;
}*/
}
Thanks,
Vandana
I used html controls to resolve this issue instead of apex.
<div class="uploadBox9"> <table cellpadding="0" cellspacing="0" class="uploadTable9"> <tr> <td><input type="file" multiple="false" id="filesInput9" name="file" /></td> <td class="buttonTD9"> <input id="uploadButton9" type="button" title="Upload" class="btn" value=" Upload " onClick="prepareFileUploads(this);"/> <input id="clear9" type="button" title="Clear" class="btn" value=" Clear " onClick="clearFiles(this);"/> </td> </tr> </table> <apex:outputText id="errStatDec" value="Error: Please select a file to upload" style="color:red;display:none;font-family:Open Sans;"/> </div>All Answers
Try fixing the $ selectors to $j and see if that fixes your issue. You can also add debugger; statements in your javascript to set breakpoints, which will help with debugging your jquery statements too.
Thank you for your reply. I replaced all the instances of $ with $j. But that didn't solve the issue either. In console I only get GET https://login.salesforce.com/17181/logo180.png 404 (Not Found). I tried putting in the console.log statements in javascript too but none comes in console. Any idea what could be the issue?
Regards,
Vandana
I used html controls to resolve this issue instead of apex.
<div class="uploadBox9"> <table cellpadding="0" cellspacing="0" class="uploadTable9"> <tr> <td><input type="file" multiple="false" id="filesInput9" name="file" /></td> <td class="buttonTD9"> <input id="uploadButton9" type="button" title="Upload" class="btn" value=" Upload " onClick="prepareFileUploads(this);"/> <input id="clear9" type="button" title="Clear" class="btn" value=" Clear " onClick="clearFiles(this);"/> </td> </tr> </table> <apex:outputText id="errStatDec" value="Error: Please select a file to upload" style="color:red;display:none;font-family:Open Sans;"/> </div>