Best way to do enable drag and drop for nested resources for ActiveAdmin in Show page? - ruby-on-rails-3

I am trying to implement a drag and drop to reorder from the show page in active admin. I have seen a lot of tutorial for the index page but nothing for the show page. What is the best way to do it?

jQuery UI has a drag and drop functionality that you can customize to run a callback function to send an AJAX request that updates the ordering of your form.

Related

How to generate Facebook Share buttons to dynamically fetched content?

Here we have an article on how to add share buttons to a web page and it works:
https://developers.facebook.com/docs/plugins/share-button/
But on my website, I have a "Load more" button to fetch content dynamically and I have no idea how to add a Share button to newly generated items.
Obviously adding this div does not make any effect so I probably need to call some Facebook function to the newly created divs.
<div class="fb-share-button"
data-href="https://www.your-domain.com/your-page.html"
data-layout="button_count">
</div>
Is anyone aware what is the name of this magic function?
OK, found the solution here:
https://developers.facebook.com/docs/javascript/examples#dialogs
It shows how to trigger a share popup. It also gives more control over the look of the share button which is also what I've been looking for.

Rails partial page update

I have List of Users with friends/unfriends button (there are 4 states for this button according to user's relationship) I need to update button status with ajax call to server.
What is the best practice here:
Use remote: true for button and write update in users.js.erb
Add handler for button state and click in .js file and send requests with ajax
Another option I didn't mention (I'm new to Rails)
Ultimately, I think you will find that the first option (remote: true and update via a *.js.erb template) is the best approach.
In general, this option is easy and quick to implement. As you move farther and farther down the Rails Rabbit Hole, you can play with other approaches (straight jQuery or other JS, etc.).

How to use/handle a loader in an MVC app?

in a ASP.NET MVC application that I am currently working there are multiple places in a single page that the user can click. So there is a main menu that's in _layout and for each inidividual page there can be links associated with that page.
I am trying to use a loader which will be shown on every click, mainly where the response takes time but for now it's for every click.
For example in the home page, from the main menu the user can click Students and the loader should come up and hide when the page loads completely. On the students page there can be an ajax call that gets data and binds it to the grid.
So from the time the user clicks on a menu link and the page loads the loader is active/shown. It's hidden once the page loads completely.
The grid can have editing functionality and when the user clicks on any of the CRUD links the loader should show and hide.
I am looking at suggestions on implementing this requirement.
If I can hookup any of the MVC events, that would be cool as I want less of Javascript/jQuery stuff but if Javascript/jQuery is the way then that's fine too.
Currently I don't have anything so anypointers are appreciated.
Assuming AJAX is being used
I don't see a way to keep this server-side without a middle page with a redirect being used (which would just be unnecessary bloat). And, since you're not opposed, you can implement this fairly easily using jQuery and something like blockUI.
I'll let you play with refining the binding to only links you care about, but for now we'll assume all links. Also, MVC should be using jQuery for things like Ajax.Actionlink so we can hijack events like $.ajaxStart and $.ajaxStop:
function showLoadingScreen(enabled){
return enabled ? $.blockUI() : $.unblockUI();
}
$(document).ajaxStart(function(){
showLoadingScreen(true);
}).ajaxStop(function(){
showLoadingScreen(false);
});
Later on you can maybe apply classes to the links you care about and just bind to them (instead of $.ajaxStart) but I'll leave that up to you.

dojox.mobile.ListItem Drag and Drop implementation with dojo

I have dojox.mobile.ListItem inside an dojox.mobile.RoundRectList got from web service. I need to implement drag and drop functionality for the list and handle that event.
Normal drag and drop in dojo is working fine with dojo.dnd.Source. But in mobile.ListItem I dont find any links. I'm not sure whether its possible or not.
It would be great if any one provide sample code or useful link regarding.
Thanks,
Siva.
Enable the editable property on your dojox/mobile/RoundRectList and subscribe the "/dojox/mobile/deleteListItem" when removing an item.
The explanation is here and there are examples here under EdgeToEdgeList

Would like to add some custom ajax & javascript to activeadmin based application

Hi guys I'm working on this application using activeadmin. I've come to a point where I would like to add in some ajax based functions. I have the basic form set up using teh activeadmin resource and it generates a very pretty form.
I would like to while the user is entering the details on the form - run a ajax call which would retrieve some html based on the values being entered and populate it on the page.
More likely I would like a way to add custom javascript to the page. Whats the best way to do this - I'm facing issues with returning html without the entire activeadmin layout coming with it.
You can use the /config/initializers/active_admin.rb
You can add javascript resources like this:
config.register_javascript 'my_functions.js'
I use to put code directly to /app/assets/javascripts/active_admin.js
You can also include script in /config/initializers/active_admin.rb