JQuery Datepicker-Daten an Rails Controller übergeben
Ich bin neu in Rails und JQuery, daher werde ich versuchen, dies so gut wie möglich zu erklären. Ich versuche, meine JQuery-Datepicker-Werte an meinen Rails-Controller zu übergeben. Auf der Seite befinden sich Daten, nach denen der Benutzer basierend auf einem Datumsbereich filtern kann. Es gibt verschiedene Beiträge zu diesem Thema:
Übergabe der Variablen von jquery an Rails Controller
Wie übergebe ich Variablen aus dem AJAX-Formular in den Controller?
Ich habe versucht, den Anweisungen dieser Posts zu folgen, aber ich habe immer noch Probleme.
Hier ist mein Teil _dateFilter.html.erb =>
<%= form_tag({:controller => 'events', :action => 'dateFilter', :class => 'date_form'}, :remote => true) do %>
<%= datepicker_input "event", :start_date, :class => 'dateFilter', :dateFormat => 'mm/dd/y' %>
<%= datepicker_input "event", :end_date, :class => 'dateFilter', :dateFormat => 'mm/dd/y' %>
<%= submit_tag "Submit" %>
<% end %>
Hier wird das generiertHTML =>
<form accept-charset="UTF-8" action="/events/dateFilter?class=date_form" data-remote="true" method="post">
<input class="dateFilter" id="event_start_date" name="event[start_date]" size="30" type="text" /><script type="text/javascript">
//<![CDATA[
jQuery(document).ready(function(){jQuery('#event_start_date').datepicker({"dateFormat":"mm/dd/y"})});
//]]>
</script>
<input class="dateFilter" id="event_end_date" name="event[end_date]" size="30" type="text" /><script type="text/javascript">
//<![CDATA[
jQuery(document).ready(function(){jQuery('#event_end_date').datepicker({"dateFormat":"mm/dd/y"})});
//]]>
</script>
<input name="commit" type="submit" value="Submit" />
</form>
Hier ist derdateFilter.js.erb =>
$('.dateFilter').append('<%= escape_javascript(render(@events)) %>');
Hier ist derevents_controller =>
def dateFilter
@events = Event.find(:all, :conditions => ["EVENT_DATE_TIME_LOCAL BETWEEN ? AND ?", params[:start_date], params[:end_date]])
respond_to do |format|
format.html
format.json { render json: @events }
format.js
end
end
Endlich ist da dasapplication.js =>
$(document).ready(function() {
$('#date_form').submit(function (){
$.ajax({
type: 'POST',
url: "/events/dateFilter",
beforeSend: function (xhr) {xhr.setRequestHeader("Accept", "text/javascript");},
data: { 'start_date' : $("input[name='event[start_date]']").datepicker(), 'end_date' : $("input[name='event[end_date]']").datepicker()}
success: function(data) { <%= render "events/dateFilter" %>}
});
});
Das istLogdaten vom Server =>
Started POST "/events/dateFilter?class=date_form" for 127.0.0.1 at 2012-12-12 15:09:39 -0500
Processing by EventsController#dateFilter as JS
Parameters: {"utf8"=>"✓", "authenticity_token"=>"J/HU+DxNmIwEhu3keN071k6MGCCD/n/1UhXUD0MkH1Q=", "event"=>{"start_date"=>"12/06/12", "end_date"=>"12/13/12"}, "commit"=>"Submit", "class"=>"date_form"}
Event Load (1.7ms) SELECT "TBLEVENT".* FROM "TBLEVENT" WHERE (EVENT_DATE_TIME_LOCAL BETWEEN NULL AND NULL)
Rendered collection (0.0ms)
Rendered events/dateFilter.js.erb (0.3ms)
Completed 200 OK in 8ms (Views: 3.4ms | ActiveRecord: 1.7ms)
Eines der Probleme ist, dass ich für die Werte der Daten, die ich zu übergeben versuche, immer wieder "NULL" erhalte. Ich bin mir nicht mal sicher, ob ich das richtig mache. Jede Hilfe / jedes Feedback dazu wäre sehr dankbar. Vielen Dank.