unobtrusive-javascript

One thing I don't understand about unobtrusive javascript

I like the idea of separating functionality and this seems like the way of the future. But I'm used to integrating javascript inside loops in an embedded language like Rails ERB or PHP, where I can use the ID of a particular object as a reference in the javascript. Rails example: <% @comments.each do |comment| %> <div id="comment_<%...

ujs link problem in rails3

hi I want to add a remote link via javascript(mootools). This code adds the link, but the click on this new link('delete foo 1') sends an html request and not an ajax request. Why doesn't it send an ajax request? Can anyone help me. Thanks <div id="add_link"> add link </div> <%= javascript_tag do %> $('add_link').addEvents({ 'cl...

Simple UJS with jQuery not working in Rails 3

I'm creating a basic message board app with Rails 3. I want posts to be created with UJS/jQuery (submit the post with AJAX and clear the form). I thought this would be simple but I'm getting this error: Rendered posts/create.js.erb (64.5ms) Completed in 1771ms ActionView::Template::Error (undefined local variable or method `posts' fo...

How I get the Railscasts episode "#229: Polling for Changes" to work with a nested route?

I have a rails 3 application very similar to the one in Railscasts episode #229 the only difference is that in my code Articles is called Posts and I have a nested route: routes.rb: Myapp::Application.routes.draw do resources :posts do resources :comments end root :to => "tags#index" end I receive this error in the terminal...

window.onload vs document.ready

what is the difference between window.onload and document.ready. ...

jquery datepicker not working properly with js.erb views in ruby on rails

Hi i have two js.erb views, namely new.js.erb and edit.js.erb with both use a form partial to be rendered in a dialog box. Two of the fields in the form are start date and end date to which i have added the datepicker from jquery ui as shown below $("#event_startDate").datepicker({dateFormat: 'yy-mm-dd'}); $("#event_endDate").datepicker(...

Javascript: Module Pattern vs Constructor/Prototype pattern?

Hi there, I have been reading a little bit about the Module pattern and i wonder if applicable for what i need to do or should i use the Constructor/protoType pattern. Basically I am using unobstrusive javascript so i have a reference to my .JS file in my HTML document. If i understand it correctly then I can call a INIT method (which...

ASP.NET MVC editor template javascript location

Hi, We have an editor template that contains approx 40 lines of jquery. I tried dropping this script into a <asp:Content> block to keep all of the javascript in one location within the page. However, I get the following error message content controls have to be top-level controls in a content page. Is there any way to get this workin...

Refreshing images on a page periodically

Hi, I'm building a page to display a bunch of webcam images and update them periodically so that the page can be used for at-a-glance monitoring. However, I'm having issues getting the periodic reload working. My code looks something like: <div class='cameras'> <div class='camera'> <h4>Desk</h4> <img height='240' src...

trigger js function from inside another in an anchor tag

var game = (function() { function start() { //somefunction } function save_count(someparamt) { //somefunction } })(); How could I trigger savecount() from the browser url? javascript:savecount(); won't work and neither game.savecount() and neither window.game.savecount(); ...

jQuery vs CSS Preferred or Accepted Style Best Practices

I have the following loading image: <img id="loading" src="loading.gif" /> To show/hide it during an AJAX call, I have several solutions. For example, I can hide it by adding a class which corresponds to a CSS style: $('#loading').addClass('hidden'); .hidden { display: none; } Alternatively, I can use jQuery .show() and .hide(). I...

UL toggle working in FF and not in IE 7

I have an list that toggles with no problem in FF. I need this working IE for it to be production ready. It seems (IE) to apply the js to the first #orderItem and the first #familiy only. The rest of the items in the list are ignored. Any help would be great. A piece of the HTML (large list): <div class="classificationContainer"> ...

Is there an unobtrusive way to do make the condition of link_to_unless depend on the value of another form item?

I have this, and it works but it's pretty obtrusive. I am essentially mimicking tabs where each one holds one step in a 5 step process. If the previous step has been completed then I want the tab text to be a link, otherwise just text without a link. So the first step might be to select a service, which sets the service_id. If the se...

Hrefs vs JavaScript onclick (with regard to Unobtrusive JavaScript)

What is best practice with regard to using links/<a> tags with explicit hrefs to other pages in your site (i.e. href="/blah/blah/blah.html) vs having hrefs/divs/etc. that don't have an explicit href and have their onclick set within the document ready handler with JavaScript in say a main.js file. I'm not an expert when it comes to web ...