Showing posts with label Jquery. Show all posts
Showing posts with label Jquery. Show all posts

Sunday, June 12, 2011

Fixing the delete method in Jquery

Here's a little problem I ran into the other day. I've switched to Jquery from Prototype, and while I was initially able to get Javascript working with Jquery, my :delete method stopped working. Rather than destroying the thing it was called to destroy, it redirected me to the show page.

After a few google searches, I found this is a fairly common problem. However, none of the solutions I found fixed my problem entirely, but a combination of suggestions DID fix the problem.

I'd installed the jquery gem, as suggested here but the problem was in the javascript_includ_tag in the header of my application.html.erb file.

At first I had <%= javascript_include_tag :defaults %>, which I assumed would work since Jquery was the new default Javascript library after installing the gem, but I had to edit it like so:

<%= javascript_include_tag :defaults, 'jquery_ujs' %>

Bingo! Once again, my :delete method works, and my flash[:notice] script is working, too.

Now for a little question.

You may recall my previous question about passing multiple values to a hidden_field. David showed me this code:

  def status
    finished? ? 'finished' : 'unfinished'
  end
end


This goes in the Task model and defines these two statuses. However, I don't know how to call them and mark a Task as finished or unfinished then have that change updated in the view.

Here's the code I've got now:

<%= form_for(task) do |f| %>
  <%= f.hidden_field :finished, :value => !task.finished %>
  <div class="actions">
    <% if task.finished %>
      <%= image_submit_tag 'finished.png' %>
    <% else %>
      <%= image_submit_tag 'unfinished.png' %>
  <% end %>


Basically, I want it to work this way: A new Task is defined as unfinished by default, a user can mark a task as finished by clicking on 'unfinished.png', or mark it as unfinished again by clicking on 'finished.png'. This change should mark the Task with that status, either 'finished' or 'unfinished.'

Will I need to update the table for Task and add this as a field? Or can this information be stored in the database just by using the hidden_field? I want to be able to manipulate Tasks based on whether they're marked as finished or unfinished later.

I didn't do much coding this weekend, but it definitely felt good to sit down and fix my Jquery problem after thinking about it most of the day today.

Thursday, June 9, 2011

Working with Jquery in Rails

Still working on Chorenivore. After getting some help from Matt and David, I'm using some jquery for handling flash :notice messages. At first, I just wanted to make it so the :notice would fade away after a few seconds.

I initially tried this with some Prototype code David showed me, but couldn't get it to work for one reason or another. After a bit more digging (and prodding from both David and Matt) I decided I should just switch over to Jquery. Everything I've read says it's got a much wider development base than Prototype, and Rails 3.1 will be using it as the default javascript library, anyway. Might as well get used to it now!

Switching to Jquery from Prototype proved a bit tricky. Good thing I don't have tons and tons of code that had to be converted, huh? Here's a page I found that helped me:

Switching from Prototype to Jquery

Easy enough! This didn't take long to find (third page on a google search, but that's an eternity by today's standards) so I'm hoping it might help others out.

Anyway, back to Chorenivore! Here's the Jquery script Matt showed me that I modified and ended up using:

setTimeout(function() {
$('#flash_notice').fadeOut('slow');}, 800
);


I'm not super familiar with Javascript, but a couple of things made sense. 'slow' refers to how quickly the message fades away, and 800 refers to how long it stays on the screen. '#flash_notice' refers to every flash[:notice] and this could just as easily be applied to flash[:error] or flash[:alert]. It's funny how becoming familiar with one coding language makes others easier to read and manipulate.

After I got this script running, I decided I didn't want my flash:notice running across the top of the application. I pulled that code out of application.html.erb, threw it into index.html.erb, slapped a div on it and called it macaroni! Problem solved. It feels AWESOME to mark things off the functionality and features checklist I made for Chorenivore.

Now, how about a couple of questions? You ready?

Here's the code I've got for updating whether a task is finished or not.

<%= form_for(task) do |f| %>
  <%= f.hidden_field :finished, :value => !task.finished %>
  <div class="actions">
    <% if task.finished %>
      <%= image_submit_tag 'finished.png' %>
    <% else %>
      <%= image_submit_tag 'unfinished.png' %>
  <% end %>


Is there a way to pass multiple values to a hidden_field? Right now, I can define a task as finished, but there's no definition for being unfinished. It's just displaying the unfinished button if a task is not marked as finished. I'd like to do this so I can define custom flash :notice messages for when a task is marked as finished from unfinished and vice versa.

I had lunch with Eli today and it's always great to talk to programmers about programming. I find the fact that I've signed up for a never ending stream of headaches, frustrations and triumphs oddly comforting. This is that coding crack I've heard so much about, right?