AJAX without Rails

[Miki Vz]

Hi, I'm pretty new to Ajax.

I need to do some simple web interfaces for some project I have. A
friend told me Rails was a bit to much for what I need, so I'm using
eruby and markaby, and I'm pretty happy, and things are kept pretty
sweet and simple for now.

However I would like to use a little of Ajax, what is the best way to go
about it? How do Ajax work for ruby? seems like rails has support for
Ajax that makes it simple. Can i have the same for my eruby scripts
without having to install any MVC system like Rails or anything?

I would basically would like to use Ajax to send parts of the page to be
process on the server and use the results to modify how this parts are
shown. For example, send a paragraph from the page to perform named
entity extraction, and then use the results to highlight these named
entities.

Thanks for your time.

- mikisvaz

 

[Miki Vz]

Actually, I'm not sure I'm using eruby, I'm using mod_ruby and
generating the html with markaby. I'm a bit lost with all the technology
.

 

[Miki Vz]

Isn't this precisely a rails tutorial? I'm trying not to use rails,
since I really have no database or anything.

 

[Miki Vz]

:'(. Ok then, thanx.

Ruby on Rails is the only Ajax framework for Ruby.
http://ajaxpatterns.org/Ruby_Ajax_Frameworks

Isn't this precisely a rails tutorial? I'm trying not to use rails,
since I really have no database or anything.

 

[Eivind Eklund]

Hi, I'm pretty new to Ajax.

I need to do some simple web interfaces for some project I have. A
friend told me Rails was a bit to much for what I need, so I'm using
eruby and markaby, and I'm pretty happy, and things are kept pretty
sweet and simple for now.

However I would like to use a little of Ajax, what is the best way to go
about it? How do Ajax work for ruby? seems like rails has support for
Ajax that makes it simple. Can i have the same for my eruby scripts
without having to install any MVC system like Rails or anything?

AJAX is fairly simple, at least as long as you ignore the "XML" part
of it and use HTML or JSON (Javascript Over Network) to deal with it.

The very easiest way to do AJAX is to just have a new command
handler/new script that output the HTML you want to replace with, and
do something like this (example with the jQuery library):

<!-- Include jQuery library, replace with your own copy -->
<script type=3D"text/javascript"
src=3D"/publish/files/jquery-nightly-20070801.js"></script>

<!-- Add a method to jQuery for pure replace; this can also be done
other ways, I just included this because this is how my code was
structured already -->
<script type=3D"text/javascript">
jQuery.fn.replace =3D function() {
var stack =3D [];
return this.domManip(arguments, true, 1, function(a){
this.parentNode.replaceChild( a, this );
stack.push(a);
}).pushStack( stack );
};
</script>

<!-- Actual AJAX (actually, AJAH - Asynchronous Javascript And HTML) -->
<!-- Notice: the ready setup here is to call this stuff when the page
DOM is ready.
What happens here is that the POST equivalent of
approve.wa2?_cmd=3Dclose_edition;EditionId=3D2747 gets called,
outputs some HTML, and the #editioncloser input element shown
below gets replaced with
whatever that HTML describes. You can trivially replace what
script gets called, what args it takes, and which element it replace.
-->
<script type=3D"text/javascript">
<!--
$(document).ready(function(){
$("#editioncloser").click(function(){
$.post("approve.wa2", { EditionId: 2474, _cmd: "close_edition" },
function(data) {
=09$("#editioncloser").replace(data);
});
return false;
});
});
-->

</script>

<!-- HTML code for the input element that I will be replacing -->
<input type=3D"submit" value=3D" Lukk utgave " id=3D"editioncloser">


That's simple AJAX.

If you want to include JSON data and do DOM manipulation directly, you
can do JSON calls like this:

$.getJSON("/autodb/ajaxapi.wa2",{_cmd: cmd, xBoatType: xBoatType,
xBrand: xBrand, xModel: xModel}, function(j) {
var elm =3D document.forms['search'].elements[id];
RemoveChildren(elm);
for (var i=3D0; i<j.length; i++) {
AddOption(j.optValue, j.optDisplay, j.optSelected, elm=
);
}
})

Here, you need to have your callback method output "JSON", JavaScript
structures outputted over net. You can find examples of it on the
net; for a simple example, here's something that the above script
("ajaxapi.wa2") outputs for one of our structures:
[{optSelected: 0, optValue: 0, optDisplay: 'Alle (80)'},{optSelected:
0, optValue: 8001005, optDisplay: 'Fiskeb=E5t/Sjark (2)'},{optSelected:
0, optValue: 8001008, optDisplay: 'Gummib=E5t (0)'},{optSelected: 0,
optValue: 8001006, optDisplay: 'Jolle/=C5pen b=E5t (4)'},{optSelected: 0,
optValue: 8001010, optDisplay: 'Kano/Kajakk (0)'},{optSelected: 0,
optValue: 8001001, optDisplay: 'Motorb=E5t (64)'},{optSelected: 0,
optValue: 8001003, optDisplay: 'Motorseiler (0)'},{optSelected: 0,
optValue: 8001009, optDisplay: 'RIB (0)'},{optSelected: 0, optValue:
8001012, optDisplay: 'Seilbrett, (0)'},{optSelected: 0, optValue:
8001002, optDisplay: 'Seilb=E5t (8)'},{optSelected: 0, optValue:
8001007, optDisplay: 'Skj=E6rg=E5rdsjeep (0)'},{optSelected: 0, optValue:
8001004, optDisplay: 'Snekke (2)'},{optSelected: 0, optValue: 8001011,
optDisplay: 'Vannscooter (0)'}]

Notice how close it is to Ruby array/hash structure? The only thing
is that hash keys must be followed by : instead of =3D>. Remember to
escape your single-quotes; they almost certainly WILL show up even if
you're sure they won't. (Or at least they did for us...)

Hope that helped a bit.

Eivind.

 

[Michael Neumann]

:'(. Ok then, thanx.

Keep smiling

AJAX can be so simple with just Mongrel (no Rails required at all!!!!!):

require 'rubygems'
require 'mongrel'
require 'json'

class AjaxHandler < Mongrel::HttpHandler
def process(req, res)
res.start(200) do |header, out|
out << JSON.dump({"Hello" => "AJAX!"})
end
end
end

Mongrel::Configurator.new :host => '127.0.0.1' do
listener ort => 5000 do
uri '/', :handler => AjaxHandler.new
run
join
end
end


All you need are the 'json' and 'mongrel' gems. In your HTML page simply use
jquery (www.jquery.com), and make a AJAX call to the server. That's so easy!

Regards,

Michael

 

[Miki Vz]

Thanks a lot for your replies guys, I have a lot of information here to
digest but I think I know what to look for.

Miki

 

[Nicolas Antoniades]

Hall=E5 Eivind.
E du svensk m=E5nne?
Har sv=E5rt o f=E5 tag p=E5 n=E5gon som faktskt kan f=F6rklara saker o ting=
...
/Nico

 

[Giles Bowkett]

The Ajax support in Rails is definitely more fully-developed than in
any other Ruby framework, but any Ruby framework can be used to
develop Ajax, and Rails' Ajax support is something of a mixed
blessing. Although it's in some respects very powerful, I've often had
to resort to feeding it BS commands just so it would generate its
code, which I would then copy, paste, and edit. It enables a lot of
stuff that seemed really cool in 2006 automatically, but any time you
need to do something even slightly different from what comes in the
box, you have to go to JavaScript to work with it manually. So Rails'
Ajax support is always *useful*, but it's really only *powerful* if
you understand how it works and have the ability to actually write
JavaScript when you need to.

I don't know how the Ajax support in other Ruby frameworks stacks up,
but I do know you have equivalent shortcuts in Seaside, and I did
attempt unsuccessfully to use Rails' Ajax shortcuts outside of Rails
the other day. In theory it should be really simple, but apparently
the theory must have been wrong, because in practice it was involved.

The Ajax support is mainly a set of JavaScript helper methods which
live in a library called ActionView, but I had to require its
companion library ActionController as well, and first - it has to come
first - in order for ActionView to properly load, or initialize, or
something. (Since both libraries live in a gem called actionpack, I
thought I could just require actionpack, but that doesn't work.) Once
you have both libraries required, and in the proper order, you can now
get to the JavaScript helper methods, but you still can't actually use
them. They implode due to the lack of a content_tag method. There's a
content_tag method within ActionView, so you can get to it, but I
didn't bother - I think probably you have to go through some more
steps to mimic Rails' loading process, and it seemed like an awful lot
of work.

Most of Rails' JavaScript helpers don't actually have any deep ties to
Rails, and would be useful for other frameworks as well, so it's a
pity this isn't easier to do. I do know where to look, probably - the
jRails plugin allows you to swap out Prototype and Scriptaculous with
jQuery instead, so the code for that is probably a good place to
start.

--
Giles Bowkett

Podcast: http://hollywoodgrit.blogspot.com
Blog: http://gilesbowkett.blogspot.com
Portfolio: http://www.gilesgoatboy.org
Tumblelog: http://giles.tumblr.com

 

[Miki Vz]

I ended up using Camping and calling the Ajax by hand. I din't know how
good the Ajax libraries where, prototype, etc. It's easy enogh actually.
I still have trouble doing some things, but I hope to figure them out as
soon as I have a little time.

Cheers

-Miki

 

[Tony De]

That expression always makes me think of this:

http://xkcd.com/123/

I just ran across this post. I am taking swimming lessons in Ruby,
Rails, AJAX, and the like. I was looking for some help on how to take
advantage of AJAX using Ruby. I'm wanting to start off simple with a
call to a cgi script which will pass data back to the page updating a
<div>. I found Michael Neumann's post of interest as I have zero Java
or Javascript experience. I'm an old salt at VB & Delphi coding Database
apps. I googled json as I didn't know what that was and also JQuery.
So I think this all sounds pretty cool. One question I have. Looking
at the JQuery info, it seems that all the page magic is coded into the
web page itself. I didn't see any info (perhaps that's not how JQuery
works) on accessing the DOM elements from a cgi or ruby code. My need
is to process one or more files on a syslog server for information and
pass the info back to the browser. I could use some clarification on
what I need to be looking for to accomplish this. Thanks so much for
any feedback you may have.

tonyd

 

[Hassan Schroeder]

......................... it seems that all the page magic is coded into the
web page itself. I didn't see any info (perhaps that's not how JQuery
works) on accessing the DOM elements from a cgi or ruby code.

That's not how it works, period. JavaScript running in the browser
sends a request to a server process, which returns a response; it's
up to the in-page JS to handle the response appropriately.

But there's no way for the server to directly manipulate anything on
the client.

 

[Tony De]

That's not how it works, period. JavaScript running in the browser
sends a request to a server process, which returns a response; it's
up to the in-page JS to handle the response appropriately.

But there's no way for the server to directly manipulate anything on
the client.

@ Hassan,

Ok, I get that part.
So, for example, looking at the examples on the JQuery website. When I
look at the source or any of the example page demos, which as I
understand it is using AJAX, I don't see any call to an external script.
It appears it is handling things locally, perhaps sending the request to
the "local" AJAX server, but not a a server script (say cgi) and the
script sending a request back to the AJAX server on the client.

tonyd

 

[Hassan Schroeder]

So, for example, looking at the examples on the JQuery website. When I
look at the source or any of the example page demos, which as I
understand it is using AJAX, I don't see any call to an external script.

Then you haven't actually found any AJAX examples. JQuery is a
library of functions, not all of which have anything to do with AJAX.

It appears it is handling things locally, perhaps sending the request to
the "local" AJAX server, but not a a server script (say cgi) and the
script sending a request back to the AJAX server on the client.

There is no "local" or "client" AJAX server. There's the client where
the JS is running, and the server the page was loaded from, which
can also serve AJAX requests.

I don't use JQuery, but there's gotta be some examples there

 

[Tony De]

Then you haven't actually found any AJAX examples. JQuery is a
library of functions, not all of which have anything to do with AJAX.


There is no "local" or "client" AJAX server. There's the client where
the JS is running, and the server the page was loaded from, which
can also serve AJAX requests.

I don't use JQuery, but there's gotta be some examples there

Thanks Hassan, I'll keep searching...

tonyd

 

[James Britt]

Hassan Schroeder wrote:

Thanks Hassan, I'll keep searching...

You should dig up a tutorial on the XmlHttpRequest object.

It is not the only way to do this sort of thing, but is likely the most
common. It's not complicated.

Basically, some javascript running in the browser makes a request of a
URL. What gets returned from the server is (typically) used to alter
the browser DOM.

There are, I believe, some examples of this shipped with the Ramaze
source code.


www.ramaze.net

 

[Marc Heiler]

Have to agree with the one writing about some replies ago, in that
Michael Neumann's example is very beautiful IMO.

 

[Peña, Botp]

From: James Britt [mailto:[email protected]]=20
# www.ramaze.net

ah, the mention of that humble big little framework called ramaze makes =
me smile; lightweight, open, multiple engines, helpers, templates, and =
very rubyish, even rubyish than ruby's webrick, imho. ruby amaze-ing =
indeed

kind regards -botp