使用Rails在form_tag中使用text_field_tag的Jquery UI datepicker实现 [英] Jquery UI datepicker implementation using text_field_tag in form_tag using Rails

问题描述

问题：我需要在单击特定按钮时为每个表单包含一个特定的日期选择器。我不确定我在下面的日期选择器的代码的jquery部分中做的是正确的吗？有人可以指导我吗？谢谢



详细信息：我目前正在使用一个隐藏的表单（使用css ===> display：none隐藏）进行用户输入，该表单显示在按钮点击表中。我试图通过指定一个类（datepicker）在相应的Jquery代码中使用，在表单的text_field_tag中包含一个datepicker（使用jquery-ui-rails gem（gemfile））。我正在使用Rails，Ruby，Jquery和HTML。



我的application.js文件中的当前JQuery代码（仅显示相应单个的相应隐藏'td'元素按钮）包括datepicker：

QUESTION: My need is to include a specific datepicker for EACH form when a specific button is clicked. Im not sure whether what im doing below in the jquery portion of the code for the datepicker is correct? Can someone please guide me with this? Thanks

DETAILS: I am currently using a hidden form(hidden using css ===> display: none) for user input which displays on button click within table. I am trying to include a datepicker (using the jquery-ui-rails gem (gemfile)) in the text_field_tag of the form by specifying a class(datepicker) for use in the corresponding Jquery code. I am using Rails, Ruby, Jquery and HTML.

Current JQuery code in my application.js file (displays only the corresponding hidden 'td' element for that corresponding single button) including the datepicker:

$(document).ready(function(){
         $( "button.edit_description" ).on( "click", function( event ) {
         $(this).closest('td').find( "div.file_description_update" ).show();

         });
         $(function() {
         $('.datepicker').datepicker({ dateFormat: 'yy-mm-dd' });
         });

         });

我的申请表中还有以下内容：

I also have the following in my application.js :

//= require jquery.ui.all
           //= require jquery.ui.datepicker

以及我的申请中的以下内容.css.scss：

and also the following in my application.css.scss:

*= require_self
     *= require_tree .
     *= require bootstrap-datepicker
     *= require jquery.ui.all

查看代码：

Code for View:

<h2>Files</h2>
              <table class="table">
              <tr>
              <th>Filename</th>
             <th>Description</th>
             <th>Download Link</th>
             </tr>
             <% @files.each do |file| %>
             <% filename = file.split('/').last %>
             <% object = @bucket.objects[file] %>

             <tr>
             <td><%= filename %></td>

             <td>
             <div class="file_description"><%= object.metadata['description']%>
             <button id     ="file3" type="button"  class= "btn btn-default
             edit_description"    önclick="Window(this)">Edit</button>
             </div>

             <div id = file2 class="file_description_update" >
             <%= form_tag({:action => 'update_file_info'}, multipart: true) do %>
             Update File Description: <%= text_area_tag :description %>
             <%= hidden_field_tag :s3_path, file %>
             <%= hidden_field_tag :prefix, @prefix %>
             <%= text_field_tag 'data', nil, :class => 'datepicker' %>
             <%= submit_tag 'Submit' %> </td> <br />
             <% end %>
             </div>

             </td>

推荐答案

（document）.ready（function（）{

(document).ready(function(){

（ button.edit_description）。on（click，function（event）{

( "button.edit_description" ).on( "click", function( event ) {

（this）.closest（'td'）。find（div.file_description_update）。show （）;

}）;

(this).closest('td').find( "div.file_description_update" ).show(); });

这篇关于使用Rails在form_tag中使用text_field_tag的Jquery UI datepicker实现的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！