Skip to content

Instantly share code, notes, and snippets.

@mrdanadams
Created March 28, 2012 20:41
Show Gist options
  • Save mrdanadams/2230354 to your computer and use it in GitHub Desktop.
Save mrdanadams/2230354 to your computer and use it in GitHub Desktop.
Updating a DIV with partials after remote AJAX form submit in Rails 3
$(function() {
/* Convenience for forms or links that return HTML from a remote ajax call.
The returned markup will be inserted into the element id specified.
*/
$('form[data-update-target]').live('ajax:success', function(evt, data) {
var target = $(this).data('update-target');
$('#' + target).html(data);
});
});
def preview
# ... do something meaningful here ...
render :partial => 'preview', :content_type => 'text/html'
end
<div id="update-container">
...
</div>
<%= form_tag({:action => 'preview'}, :remote => true, :'data-update-target' => 'update-container') do %>
<%= url_field_tag 'url', nil, :class => 'textinput', :placeholder => 'Paste the link URL here' %>
<%= submit_tag 'Submit', :disable_with => 'Please wait...', :class => 'submit' %>
<% end %>
@martinbarilik
Copy link

There is no such thing as "ajax:completed". How did you make it work ?

i keep getting data of undefined with the code bellow:

	$(document).on('ajax:success', 'form[data-update-list]', function(evt, data) {
		console.log('this:', this);
		console.log('evt:', evt);
		console.log("data:", data);

		let target = $(this).data('update-list');
		$('div#' + target).html(data);
	});

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment