Hi All,
First off, I have to mention that I love prototype, it makes my life
so much easier and has taught me quite a few things. I am having one
problem though, how do I use Ajax.Request with in a class that I have
created? Here's a little more information:
First an example class:
var MyClass = Class.create();
MyClass.prototype = {
initialize: function (element)
{
this.element = element;
this.get_some_data();
},
get_some_data: function ()
{
new Ajax.Request('/path/to/action', {method:"get",
onSuccess:this.handle_the_data });
},
handle_the_data: function (t)
{
$(this.element).update(t.reponseText);
}
}
Now, the xhtml:
<div id="my_widget_holder"></div>
<script type="text/javascript">
//<![CDATA[
var widget = new MyClass('my_widget_holder');
//]]>
</script>
The handle_the_data function cannot access any properties or methods
from MyClass if it is called by Ajax.Request. I realize that I can do
widget.element.update, but then I would have to always name an
instance of MyClass "widget" and I could not have more that one
instance on the page.
To rephrase my question, how can I use Ajax.Request in my own Class,
and still be able to access methods and properties withing my own
class?
If you need more information, I am creating a file browser widget for
my application. The widget will live in a div and will be started by:
var widget1 = new fsW('id of the div to live in');
All of the structure for the widget is created in the set_up_widget
method, which is called internally by initialize. The widget uses
Ajax.Request to get some json from the server describing files and
folders and created icons within the fileArea div. The problem is
that this no longer refers to my object when I use Ajax.Request.
/*
File Browser Widget Class
Objects:
host = the element that hosts the widget
container = the main widget container, child of the host element
*/
var fsW = Class.create();
fsW.prototype = {
initialize: function (element, folder)
{
this.host = $(element);
this.set_up_widget();
this.set_up_menu();
this.current_folder_id = folder;
this.get_ff(this.current_folder_id);
return this;
},
set_up_widget: function ()
{
this.container = document.createElement('div');
this.container.className = 'fsw_container';
this.host.appendChild(this.container);
this.titleBar = document.createElement('div');
this.titleBar.className = 'fsw_titlebar';
this.container.appendChild(this.titleBar);
$(this.titleBar).update('Workspace');
this.menuBar = document.createElement('div');
this.menuBar.className = 'fsw_menubar';
this.container.appendChild(this.menuBar);
this.fileArea = document.createElement('div');
this.fileArea.className = 'fsw_filearea';
this.container.appendChild(this.fileArea);
},
set_up_menu: function ()
{
this.field_newfolder = document.createElement('input');
this.field_newfolder.name = 'name';
this.button_newfolder = document.createElement('span');
this.button_newfolder.className = 'fsw_button';
$(this.button_newfolder).update('New Folder');
this.button_uploadFile = document.createElement('span');
this.button_uploadFile.classname = 'fsw_button';
$(this.button_uploadFile).update('Upload File');
this.menuBar.appendChild(this.field_newfolder);
this.menuBar.appendChild(this.button_newfolder);
this.menuBar.appendChild(this.button_uploadFile);
$(this.button_newfolder).observe('click',
this.newfolder.bindAsEventListener(this));
$(this.button_uploadFile).observe('click', function ()
{ alert('button_uploadFile clicked!'); });
},
get_ff: function (folder)
{
var folders = new Ajax.Request('/fs/get_ff/' + folder,
{method:"get", onSuccess:this.get_ff_success });
},
get_ff_success: function (t, json)
{
var folders = json.folders_json;
$(this.fileArea).update(t.responseText);
},
add_folder: function (folder)
{
alert('folder');
$(this.fileArea).update('newfolder');
},
newfolder: function ()
{
var parameters = { name: $(this.field_newfolder).value, parent:
this.current_folder_id };
new Ajax.Request('/fs/newfolder', {method:"post",
parameters:parameters, onSuccess:this.newfolder_success});
},
newfolder_success: function (t)
{
if (t.responseText != 'ok')
{
alert('There was a problem adding the folder!');
}
else
{
alert('Folder added successfully!');
this.test_function();
}
}
}
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups "Ruby
on Rails: Spinoffs" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
