View Full Version : Duplicate call to JS

21 Feb 2009, 9:21 PM

My Ext.onReady(function() is called twice. But am not able to figure from where the call is going twice. Due to which everything in my form is printed twice. Can anybody help me please.
My html page


<title>Introduction to Ext 2.1: Starter Page</title>

<!-- Include Ext and app-specific scripts: -->

<script type="text/javascript" src="../adapter/ext/ext-base.js"></script>

<script type="text/javascript" src="../ext-all-debug.js"></script>

<script type="text/javascript" src="StartApp.js"></script>

<script type="text/javascript" src="listOrders.js"></script>

<!-- Include Ext stylesheets here: -->

<link rel="stylesheet" type="text/css" href="../resources/css/ext-all.css">

<link rel="stylesheet" type="text/css" href="ExtStart.css">

<h1>Read, Add, Edit and Delete Persons - Ajax with JSON</h1>

<div id="content">



Ext.onReady(function() {
alert('am here');
new listOrders();
//new ListPersons();


listOrders = function() {

alert('now am here');
// Provides attractive and customizable tooltips for any element.
// Init the singleton. Any tag-based quick tips will start working.

// Define the fields on the form.

var lastName = new Ext.form.TextField({
fieldLabel: 'Customer Last Name',
allowBlank: false,
name: 'lastName',
anchor: '80%'

var firstName = new Ext.form.TextField({
fieldLabel: 'Customer First Name',
allowBlank: false,
name: 'firstName',
anchor: '80%'

// By default, Ext Forms are submitted through Ajax, using Ext.form.Action.
// To enable normal browser submission of the Ext Form contained in this

// FormPanel, override the Form's onSubmit, and submit methods. The onSubmit
// method is overridden here with an empty function (does nothing). The submit
// method is overridden in the savePerson function below.
var formPanel = new Ext.form.FormPanel({
baseCls: 'x-plain',
labelWidth: 75,
url:'/ExtJsSampleNew/searchServlet', // When the form is submitted call this url.
onSubmit: Ext.emptyFn,
items: [ // Add the fields defined above to the form.

layout: 'form',
items: [firstName]
layout: 'form',
items: [lastName]
},{buttons: [{
text: 'Search',
handler: searchOrder

var orderColumnModel = new Ext.grid.ColumnModel([

new Ext.grid.RowNumberer(),
id: 'id',
header: "Identify",
dataIndex: 'id',
width: 50,
hidden: true
header: "Order ID",
width: 100,
sortable: true,
dataIndex: 'orderID'
header: "Customer First Name",
width: 100,
sortable: true,
dataIndex: 'firstName'
header: "Customer Last Name",
width: 100,
sortable: true,
dataIndex: 'lastName'
header: "Orderdate",
width: 100,
sortable: true,
// Format to display.
renderer: Ext.util.Format.dateRenderer('m/d/Y'),
dataIndex: 'orderdate'

function searchOrder() {

// Check if the form is valid.
if (formPanel.form.isValid()) {

waitMsg: 'In processing',

failure: submitFailed,

success: submitSuccessful

} else {
// If the form is invalid.
Ext.MessageBox.alert('Error Message', 'Please fix the errors noted.');

function submitSuccessful(form, action) {
Ext.MessageBox.alert('Confirm', action.result.message);

function submitFailed(form, action) {

var failureMessage = "Error occurred trying to save data.";

if (action.failureType == Ext.form.Action.LOAD_FAILURE) {

failureMessage = action.result.message;

else if (action.failureType == Ext.form.Action.CONNECT_FAILURE) {

failureMessage = "Please contact support with the following: " +
"Status: " + action.response.status +
", Status Text: " + action.response.statusText;
// Failure type returned when server side validation of the Form fails

// indicating that field-specific error messages have been returned in
// the response's errors property.
else if (action.failureType == Ext.form.Action.SERVER_INVALID) {
// Validation on the server side will include an error message in
// the response.
failureMessage = action.result.message;
// Failure type returned when client side validation of the Form fails
// thus aborting a submit action.
else if (action.failureType == Ext.form.Action.CLIENT_INVALID) {
failureMessage = "Please fix any and all validation errors.";
// Since none of the failure types handled the error, simply retrieve
// the message off of the response. The response from the server on a
// failed submital (application error) is:
// {success: false, message: 'Person was not saved successfully. Please try again.')
else {
failureMessage = action.result.message;

Ext.MessageBox.alert('Error Message', failureMessage);

// Create the grid panel using the cached data in the store and the

// grid configuration parameters.
var gridPanel = new Ext.grid.GridPanel({

cm: orderColumnModel,
renderTo: 'content',
title: 'Order',
frame: true,
height: 300,
width: 500,
viewConfig: {
forceFit: true
enableColumnMove: true,
collapsible: true,
// The default SelectionModel used by Ext.grid.GridPanel.
// It supports multiple selections and keyboard selection/navigation.
// The objects stored as selections and returned by getSelected, and
// getSelections are the Records which provide the data for the
// selected rows.
sm: new Ext.grid.RowSelectionModel({singleSelect: true}),
//tbar: formPanel



22 Feb 2009, 1:44 AM
I would have a quick look at your code but please:

- read this (http://extjs.com/learn/Ext_Forum_Help)first
- put your code between proper CODE or PHP tags