View Full Version : Updating store with ScriptTagProxy

29 Sep 2010, 10:22 PM
Hi, i'm trying to use the 'scripttag' proxy to update a store and let the associated list display the new content.
I can't understand why it doesn't work.
The app uses phonegap, too.
The php script that i use is running on localhost machine:

$callback = $_REQUEST['callback'];
$arr = array();
$query = "SELECT * FROM principles";
$result = mysqli_query($conn,$query);

if (mysqli_num_rows($result)==0)
echo "Nessun principio presente";
else {
while($row = mysqli_fetch_array($result, MYSQL_ASSOC)) {
$arr[] = $row;

if ($callback) {
header('Content-Type: text/javascript');
echo $callback.'({"principles":'.json_encode($arr).'});';
} else {
header('Content-Type: application/x-json');
echo json_encode($arr);

where in config.php i create a connection with database ($conn).

Then the JS code i inserted into index.js is:

onReady : function() {
Ext.regModel('Principle', {
fields: ['id', 'name', 'family', 'desc', 'notes', 'sponsorName', 'sponsorIcon']

var principleStore = new Ext.data.Store({
model: 'Principle',
storeId: 'principleStore',
autoLoad: true,
proxy: {
type: 'scripttag',
url: 'localhost:8888/farmaApp/principles.php',
reader: {
type: 'json',
root: 'principles',
idProperty: 'id'



var principlesList = new Ext.List({
itemId: 'principlesList',
store: principleStore,
tpl: '<tpl for="."><div class="principle-item"><div><img class="principle-icon" src="{sponsorIcon}"></img></div><div class="principle-item-name">{name}</div><div class="principle-item-subtitle">{family}</div></div></tpl>',
itemSelector: 'div.principle-item',
singleSelect: true,
grouped: false,
indexBar: false,

dockedItems: [{
title: 'Principles',
xtype: 'toolbar',
dock: 'top',



var updatePanel = new Ext.Panel({
layout: 'vbox',
iconCls: 'download',
title: 'Update',
dockedItems: [{

xtype: 'toolbar',
dock: 'top',
id: 'update',
ui: 'round',
text: 'Update',
handler: function(){

url: 'localhost:8888/farmaApp/principles.php',
callbackKey: 'callback',

callback: function(data) {
data = data.principles;



var mainPanel = new Ext.Panel({
layout: 'card',
iconCls: 'search',
title: 'Ricerca',
animation: 'slide',
fullscreen: true,


var tabPanel = new Ext.TabPanel({
fullscreen: true,
animation: 'slide',
{xtype: 'spacer'},

tabBar: {
dock: 'bottom',
scroll: false,
layout: {
pack: 'center'


if i run the php script on safari the output seems ok... it's like

callback({"principles":[{"id" : "1", "name": "name1", "family": "family1", "desc":"desc1", "notes":"notes1", "sponsorName":"sponsor1", "sponsorIcon":"icon1"},{...}, {...}]});

so what could be wrong?
is it correct to use a scripttag proxy or should i have to use an 'ajax' one?
i also tried to perform a json-p call using Ext.util.JSONP.request but callback function is not called...

can anybody help?

29 Sep 2010, 11:05 PM
Once you package it up with PhoneGap is there such a thing as localhost?

30 Sep 2010, 11:27 PM
Once you package it up with PhoneGap is there such a thing as localhost?

i have a php server that executes the php script on my pc.
i tried to launch the script in the browser safari and it returned the json file correctly.
if i create a link to localhost\farmaApp\principles.php in a phonegap-sencha app, i can reach this address too...

so i really don't understand what going wrong... to be true i need my store to be updated by a php script hosted on a remote server... i will try to load the php page on a server and see if it works... but for testing, i would anyway prefer to execute it locally...

just one question... do i need to specify "http://" before localhost?

3 Oct 2010, 11:02 PM
after adding 'http://' before localhost it worked...

url: 'http://localhost:8888/farmaApp/principles.php',