function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
PrazPraz 

javascript & ajax not working in my vf page

Hi,

 

I have simply copy and pasted this ajax code from the tutorial in a vf page yet it does not seem to be working. Help will be appreciated

 

 

<apex:page>
    <script type="text/javascript">
var __sfdcSessionId = '{!GETSESSIONID()}';
</script>
<script src="../../soap/ajax/18.0/connection.js"
type="text/javascript"></script>
<script type="text/javascript"> window.onload = setupPage;
alert("hi");
function log(message) {
alert(message);
}
function setupPage() {
//function contains all code to execute after page is rendered
var state = { //state that you need when the callback is called
output : document.getElementById("output"),
startTime : new Date().getTime()};
var callback = {
//call layoutResult if the request is successful
onSuccess: layoutResults,
//call queryFailed if the api request fails
onFailure: queryFailed,
source: state};
sforce.connection.query(
"Select Id, Name, Industry From Account order by Industry",
callback);
}
function queryFailed(error, source) {
source.output.innerHTML = "An error has occurred: " + error;
}
/**
* This method will be called when the toolkit receives a successful
* response from the server.
* @queryResult - result that server returned
* @source - state passed into the query method call.
*/
function layoutResults(queryResult, source) {
if (queryResult.size > 0) {
var output = "";

The AJAX Toolkit Sample Visualforce Page Using the AJAX Toolkit
//get the records array
var records = queryResult.getArray('records');
//loop through the records and construct html string
for (var i = 0; i < records.length; i++) {
var account = records[i];
output += account.Id + " " + account.Name +
" [Industry - " + account.Industry + "]<br>";
}
//render the generated html string

source.output.innerHTML = output;
}
}
</script>
<div id="output"> </div>
</apex:page>
 
 I cannot see any output not even that alert("hi") message!!!
 


Best Answer chosen by Admin (Salesforce Developers) 
Jon Mountjoy_Jon Mountjoy_
Sure - check out the Force.com Workbook - http://developer.force.com/workbook
Look at Tutorial 7
 
Notice how in the Visualforce it has something like this, which iterates over the results for display:
 
<apex:dataTable value="{!products}" var="pitem" rowClasses="odd,even"> 
 
The {!products} is the key.  This will automatically call a method getProducts() in the controller, which they've got as:
 
 
public DisplayMerchandise[] getProducts() {     if (products == null) {products = new DisplayMerchandise[]{};         for (Merchandise__c item : 				[SELECT id, name, description__c, price__c 				 FROM Merchandise__c 				 WHERE Total_Inventory__c > 0]) {products.add(new DisplayMerchandise(item));       }     }     return products;      }
 
Check out the Visualforce developer guide for even more.  
 
 
 


All Answers
imuinoimuino
You have an error on line 40 where it says:
 The AJAX Toolkit Sample Visualforce Page Using the AJAX Toolkit
It should be
//The AJAX Toolkit Sample Visualforce Page Using the AJAX Toolkit
I mean you need to comment that line or the script get broken
 
 If you are using Firefox you can download the firebug plug-in, you can seethe javascript error with it. 


ocortinasocortinas
I see one issue on your code and is this one (let me know if this solve your issue): 
  • Comment this line and then your page should be working now 

The AJAX Toolkit Sample Visualforce Page Using the AJAX Toolkit


PrazPraz
tnx guys
 
one more help is appreciable:
 
How can I call and use Apex variable and SObject variable in AJAX?
 
As I am trying here to  write
 
 
{!View.Ppack__Start_Date__c}==> sObject field

or {!StartDate} and {!endDate} as Apex class properties
 
 
 
 It has stop responding like getting no value or on alert shwoing nothing not even other properties in alert which was showing earlier.
 
Regards
 
Praz 
 


ocortinasocortinas
can you copy/paste part of the code you add and that's not working for you?


PrazPraz
<apex:page standardController="TCI__c" title="View COntroller" extensions="ChannelViewController">
<html>
<head>
<script type="text/javascript">
var __sfdcSessionId = '{!GETSESSIONID()}';
</script>
<script src="../../soap/ajax/18.0/connection.js" type="text/javascript"></script>
<script type="text/javascript">
window.onload = setupPage;
var Hi="Hi";

var startTime = new Date.getTime();
var output = document.getElementById("output");


function setupPage() {
alert(Hi);

var endDate = new Date()
var startDate = new Date(endDate.getDate()-91);


alert(endDate);
alert(startDate);
alert(__sfdcSessionId);

alert({!View.Pack__Start_Date__c});

    try {
        var queryResult = sforce.connection.query("select pack__Date_of_Entry__c,pack__Sales__c,pack__Product__c from pack__TCI__c where pack__Date_of_Entry__c>="+{!startDate}+" AND pack__Date_of_Entry__c <="+{!endDate}+" AND pack__Report_Type__c="+report_type);
        alert(queryResult);
        layoutResults(queryResult, output);
    } catch(error) {
        alert(error);
        queryFailed(error, output);
    }
}
        
function queryFailed(error, output) {
   output.innerHTML = "<font color=red>An error has occurred:</font> <p>" + error;
}
     
        
function layoutResults(queryResult, output) {
       
        if (queryResult.size > 0) {
            var output = "";
            var records = queryResult.getArray('records');
            for (var i = 0; i < records.length; i++) {
                var pack= records[i];
                output += pack.pack__Date_of_Entry__c+ " " + pack.pack__Sales__c
                + pack.pack__Product__c + "<BR>";
            }
            output.innerHTML = output
        } else {
            output.innerHTML = "No records matched.";
        }
}

</script>
</head>
<body>
<div id="output"> </div>
</body>
</html>
</apex:page>
 
two problems here..when I am trying to put the alert for the SObject field the whole code is showing no response  and I am not able to get any value from start date and end Date and also no inner html is also getting set to the div..please see
 
 
public class ChannelViewController {
    public pack__TCI__c channelView = new pack__TCI__c();
    
    
    public  pack__TCI__c getChannelView (){
        return this.channelView ;
    }
    public  void setChannelView (pack__TCI__c channelView ){
        this.channelView =channelView ;
    } 
    
    public Date startDate = date.today();
    public Date endDate = startDate.addDays(6);


public ChannelViewController(ApexPages.StandardController controller) {

    this.channelView.pack__Start_Date__c  = date.today();



    }
    
 so I have given code for both visualforce and apex..please check where to correct 
 
 


Jon Mountjoy_Jon Mountjoy_
Praz, why you are using the Ajax toolkit to do the query - ie. sforce.connection.query ....  
 
I suggest simply putting the query in your controller.  Much faster. 


PrazPraz
Hi,
 
I need to get the grid of information or the query result on load...how can I do that...
 
1>How can I do queries on load in apex class?
2>How to show them in the page on load? 
 
Can you give me some examples... 


Jon Mountjoy_Jon Mountjoy_
Sure - check out the Force.com Workbook - http://developer.force.com/workbook
Look at Tutorial 7
 
Notice how in the Visualforce it has something like this, which iterates over the results for display:
 
<apex:dataTable value="{!products}" var="pitem" rowClasses="odd,even"> 
 
The {!products} is the key.  This will automatically call a method getProducts() in the controller, which they've got as:
 
 
public DisplayMerchandise[] getProducts() {     if (products == null) {products = new DisplayMerchandise[]{};         for (Merchandise__c item : 				[SELECT id, name, description__c, price__c 				 FROM Merchandise__c 				 WHERE Total_Inventory__c > 0]) {products.add(new DisplayMerchandise(item));       }     }     return products;      }
 
Check out the Visualforce developer guide for even more.  
 
 
 
This was selected as the best answer
PrazPraz
Tnx :)
 
I have another problem:
 
I can see the date in text in the following way
 
 
Thu Mar 11 00:00:00 GMT 2010 
 I want to see it in the following way
 
yyyy:mm:dd
 
How can I format it? 

 


Jon Mountjoy_Jon Mountjoy_
Hi Praz
 
I'm not sure on that.  I've seen it somewhere on the boards - I'd just do a search.
 
Jon 


ocortinasocortinas
If you check on Apex Tutorial Basics page under Datetime Methods exists a format function that could help you on that:
format    String dateFormat    String    Returns a Datetime as a string using the supplied Java simple date format and the local time zone of the current user. If the time zone cannot be determined, GMT is used. For example:
datetime myDT = Datetime.now();
String myDate = myDT.format('h:mm a');
Java simple date format: http://java.sun.com/j2se/1.4.2/docs/api/java/text/SimpleDateFormat.html

Let me know if this works for you and that case mark as solved to help pthers to find this solutions.
Regards.



PrazPraz
I am using the following format to display
 
 
<apex:dataTable value="{!listing}" var="item" rowClasses="odd,even">
    <apex:column headerValue="Start Date" style="width:100px">
        <apex:outputText value="{!item.Date_of_Entry__c}"/>
    </apex:column>
    <apex:column headerValue="Sales" style="width:100px">
        <apex:outputText value="{!item.Sales__c}"/>
    </apex:column>
    <apex:column headerValue="Opportunity" style="width:100px">
        <apex:outputText value="{!item.Opportunity__c}"/>
    </apex:column>
</apex:dataTable> 
 
 and corresponding class is
 
 
public Pack__TCI__c[] getListing(){
        
            listing= new Pack__TCI__c[]{};
        
        List<Pack__TCI__c> tcis = [select Pack__Date_of_Entry__c,Pack__Sales__c,Pack__Opportunity__c from Zymepack__TCI__c limit 13];
        if(tcis!=NULL){
            for(Pack__TCI__c tci:tcis){
                listing.add(new Pack__TCI__c(Pack__Date_of_Entry__c = tci.Pack__Date_of_Entry__c, Pack__Sales__c = tci.Pack__Sales__c, Pack__Opportunity__c = tci.Pack__Opportunity__c));
            }
        }
        
        return listing;
        
    }
 
 so how can I format the sObject field here?
 
 


imuinoimuino
Lets say you have a var on your controller named actualDate if you want to format it on the vf page
you need to do the next
 
<apex:outputText value="{0,date,MM,dd,yyyy}">
      <apex:param value="{!actualDate}" />
</apex:outputText>


PrasenPrasen
Tnx man :manhappy: