views:

61

answers:

1

Okay I have an extensive ruby application running behind Ruby on Rails right now. This application needs form input but I don't want to refresh the page when I update the text box. What I mean is:

I have a form that has two text boxes, one is called "starttime" and one is called "endtime". I somehow need to get the value of these text boxes (what a user has typed in) into ruby when a button is pressed. Is there some sort of equivalent to javascript's document.form.starttime.value command but for ruby? Or is there some way to submit the form data, retrieve it, but not refresh the page such as using ajax? I know ajax is used to manipulate the DOM dynamically without refreshing the page, but I really just need to retrieve data. Any help would be greatly appreciated, I simply cannot find this anywhere.

+1  A: 

You can do this quite easily with jQuery. Give the start time and end time form elements a distinct ID (I use startDate and endDate below) and you can easily retrieve them, then send the data to a Rails action that can process them in the background and if necessary, update the DOM with any relevant data when you click on a button (below assumes an input button with the ID SendDateValues).

Something like this: (Not tested)

<script type="text/javascript">
//<![CDATA[

$("#SendDateValues").click(function() {
  $.ajax({
    url: '/SomeController/ProcessDateData/",
    data: 'startDate=' + $("#startdate").val() + "&endDate=" + $("#endDate").val(),
    success: function(html) { //DO SOMETHING WITH THE RESULT },
    type: 'post'
  });
});

//]]>$
</script>

Play with the results... Use Firebug or something similar to check what gets passed. Check your Rails event log to see what data your action gets.

Andrew Flanagan
Thanks for the quick response. If I use something like this, won't it move the browser to another page? I need to stay on the same page and manipulate another object after checking the values of the text boxes.
Daryl
That's the beauty of the AJAX call -- it will make the request in the background. The user may see activity in their status bar, but nothing will change on the page they're on unless you explicitly change it (somewhere in the success function).
Andrew Flanagan
Ah Okay I'll try this out, thanks a lot.
Daryl
If you've not used jQuery before, be aware that you'll need to include the jQuery libraries for the above to work. In theory you could write the AJAX call in ordinary Javascript, but the jQuery library abstracts this beautifully and makes it simple.
Andrew Flanagan
Okay I added:<%= javascript_include_tag 'jquery' %><%= javascript_include_tag 'jquery-ui' %><%= javascript_include_tag 'jrails' %>to my layout. Of course I'll need to modify the code you posted but where exactly does this code go?
Daryl
Oh I guess I don't need jrails, it's just something I found online.
Daryl
Just create a new <script> tag on the page that this applies to (put it at the bottom). I'll update my answer.
Andrew Flanagan