View Full Version : Storing a MessageBox in a variable.

29 Mar 2011, 1:40 PM
Hi all, I'm very new to Ext JS, so go easy on me! haha. Anyway, what I'm trying to do is the following:

var msg = Ext.Msg.show({
title: "Question.",
msg: "Do you want to delete your account?",
buttons: Ext.Msg.YESNO
So I want to store this messagebox in a variable because I will be calling it at several places, and instead of repeating code, I want to just call this variable... however, when the page loads, the message box just pops up. I'm assuming that's because I'm storing the Ext.Msg with the '.show' option, but I'm not sure how to prevent this message from popping up or if there's another way of going about this. I also can't seem to call the variable to make the box show up... I've tried:


None of them seem to work, but 'msg.hide()' seems to hide the message from popping up when the page loads. I think that's just by luck of some error, haha.

Another question (for when this one is resolved) is calling a PHP script when the user selects 'yes'. Could anyone link me to where I can learn about calling a PHP script? I was messing around with the Ext.form.formPanel, but I feel like I can just do an AJAX call or something easier.

Any help would be appreciated. Thanks!

29 Mar 2011, 3:02 PM
The reason it shows when you load your page is because you are actually calling "show" when you create var msg = Ext.Msg.show(...

Note, Ext.Msg is a singleton so there's no need for a seperate variable. If you are going to be using the same title/msg/buttons throughout your app then just create a config var and use that as necessary:

var configShow = {
title: "...",
msg: "...",
buttons: ...

// ...


29 Mar 2011, 3:52 PM
Brilliant! Works like a charm. Now, is there a good tutorial out there for an AJAX call to a PHP script?

30 Mar 2011, 2:52 AM
Now, is there a good tutorial out there for an AJAX call to a PHP script?

Plenty of info on this in the Learning Center (http://www.sencha.com/learn/Learn_About_the_Ext_JavaScript_Library).



30 Mar 2011, 1:20 PM
Oh wow, that looks really simple... I guess I was looking at the wrong tutorials before. Thanks a lot!

I do have another question though, and it goes along with the whole storing an object in a variable idea. So is there any way to do this:

var AJAX = new Ext.Ajax.request({
url: 'myScript.php',
timeout: 3000,
method: 'GET',
success: function(xhr) {
alert('Response is "' + xhr.responseText + '"');

// Then later on somewhere in the code...
AJAX.params({"id": "19"}); // not proper syntax, but I'm looking for something similar.
So I want to make an AJAX variable and then be able to dynamically change the parameters later on in the code... since I'll be calling this variable several times, I don't want to create a new variable every time, but if it's the only way, then that's what it'll have to be. I'm just curious, can I modify a variable after it's been defined?

****EDIT, I also would want this dynamic update to get rid of any other params that I had put in there.

31 Mar 2011, 2:31 AM
As with Ext.Msg, Ext.Ajax (http://dev.sencha.com/deploy/dev/docs/?class=Ext.Ajax) is a singleton (http://dhtmlkitchen.com/learn/js/singleton/) so you wouldn't be creating a variable instance of it. There's no problem changing the params on each request. From the docs:

// Basic request
Ext.Ajax.request (http://dev.sencha.com/deploy/dev/docs/output/Ext.data.Connection.html#Ext.data.Connection-request)({
url: 'foo.php',
success: someFn,
failure: otherFn,
headers: {
'my-header': 'foo'
params: { foo: 'bar' }

// Simple ajax form submission
Ext.Ajax.request (http://dev.sencha.com/deploy/dev/docs/output/Ext.data.Connection.html#Ext.data.Connection-request)({
form: 'some-form',
params: 'foo=bar'

31 Mar 2011, 11:54 AM
Hmmm, ok... I think I used the wrong example. What if I had something like this:

var simple = new Ext.form.Form({
labelWidth: 75, // label settings here cascade unless overridden

Is there anyway to access the url and change that?

31 Mar 2011, 12:07 PM
Could you be a bit clearer about what you want to do? Load the form fields contents from a url? (Or save them after?) If it's load, then when you call load, you can specify the new params there:

foo: 'bar'

// ... later

foo: 'blah'

Take a look at the docs for Ext.form.FormPanel load (http://dev.sencha.com/deploy/dev/docs/?class=Ext.form.FormPanel&member=load) - it'll direct you to Ext.form.BasicForm's doAction (http://dev.sencha.com/deploy/dev/docs/?class=Ext.form.BasicForm&member=doAction) which explains everything that can be passed to load.

7 Apr 2011, 1:36 PM
Sorry, I totally forgot to respond to this. Yeah, that definitely did the trick. I always look through the documentation but can never find what I'm looking for, which is why I've come here yet again.

So I have a viewport that's embedded in some PHP code, like so:

print'<HTML, etc. all my tags are correct so omitting the rest of the HTML tags>
<script type=text/Javascript>

//...somewhere down the line I create a viewport, and creating it isn't the issue,
// it's if one of my PHP variables changes, so excuse the unfinished code,
// but like I said, the viewport creation isn't my problem.

var viewport = new Ext.Viewport({
layout: "border",
items: [{
region: "north",
html: '; // this breaks out of the PHP's print

if ($blah == 1) {
print' "<h1 class=x-panel-header>Page Title</h1>",';
else {
print' "<h3 class=x-panel-header>Different Page Title</h1",';

print' autoHeight: true,
border: false,
margins: "0 0 5 0"
'; // Ends PHP print.

So what I want to accomplish is basically a redraw of the viewport because my variable blah could be changing, which would alter my viewport. Is there such a function to redraw/render? Again, sorry if my explanation is awful, just ask if I sound stupid, haha.

**Please note, I'm not specifically after changing the HTML portion of the viewport. Ideally, I could apply this to any of the parameters, I'm just using that as an example.

10 Apr 2011, 10:51 AM