Question

我目前正在尝试创建一个简单的下拉列表，其中包含姓名和电话号码，然后当您单击所选选项时，它会更新页面上包含所选选项的子对象的部分内容已经使用Ajax进入。

即。如果您从下拉菜单中选择User1 | 555-555-5555，则应该从第二部分中的User1返回所有报告批准的列表。

我知道这是一个简单的问题，但我不太清楚如何编写JavaScript以使其正常工作。

这是我的下拉列表部分代码：

下拉视图：

<select id="adminDropDown" onchange= "chooseManager();" class="form-control">
  <% if current_admin.manager_approvals.blank? %>
    <option>No Sub-Accounts added, Add one today!</option>
  <% elsif current_admin.manager_approvals.all? { |ma| ma.manager_approved == false }%>
    <option>No Sub-Accounts approved yet!</option>
  <% else %>
    <% current_admin.manager_approvals.where(manager_approved: true).each do |ma| %>
      <option value="<%= ma.id %>"><%= ma.manager_company %>&nbsp;|&nbsp;<%= number_to_phone(ma.manager_phone) %></option>
    <% end %>
  <% end %>
</select>

我的控制器看起来像这样......

class Admins::ReportapprovalsController < ApplicationController

  def index
    @reportapprovals = Reportapproval.all(table:params[:table], per_table: 4)
  end

  def show
    @reportapproval = Reportapproval.find(params[:id])
  end
end

第二个名单部分......

report_list.html.erb
 ....
      <tbody>
        <% if @selected_manager_approval.reportapprovals.blank? %>
         <tr>
          <td width="100%">No reports available</td>
         </tr>
        <% else %>
          <% @selected_manager_approval.reportapprovals.each do |ra| %>
              <% if ra.report.present? %>
                <tr>
                    <td width="25%"><%= ra.tenant_last_name.truncate(17) %></td>
                    <td width="25%"><%= number_to_phone(ra.tenant_phone) %></td>
                    <td width="25%"><%= ra.date_approved %></td>
                    <td width="25%"><%= link_to "View Report", {:controller => "admins/reports", :action => "show", :id => ra.report_id}, :method => :get, class: "btn-default btn-sm" %></td>
                </tr>
              <% end %>
            <% end %>
    <% end %>
  </tbody>

我的js档案......

$(chooseManager() {
  $('#adminDropDown')change(chooseManager() {
    value = $(this).val()
    $.post("admins/reportapprovals/manager_select", {manager_id: value}, chooseManager(data) );
  })
})

UPDATE-这个js文件给了我这个错误

 SyntaxError: [stdin]:6:5: unexpected (

如何选择其中一个下拉菜单选项并刷新第二部分？现在，所选值应该将实例ID传递为＆＃34; @ selected_manager_approval＆＃34;到第二部分，然后自动刷新页面上的第二部分？我该怎么做？

Answer 1

在您的控制器中添加如下操作：

class Admins::ReportapprovalsController < ApplicationController

  def index
    @reportapprovals = Reportapproval.all(table:params[:table], per_table: 4)
  end

  def show
    @reportapproval = Reportapproval.find(params[:id])
  end

  def manager_select
    @selected_manager_approval = ManagerApproval.find(params[:manager_approval_id])       
  end
end

在app / views / admins / report_approvals中创建manager_select.js.erb并在该文件中添加以下代码。

// reportlist_wrapper_div_id is just an example you have to replace this with id of the div where you are rendering report_list partial.

$('#reportlist_wrapper_div_id').html('<%= escape_javascript render(:partial =>"report_list")%>');

更改您的chooseManager功能，如下所示：

chooseManager = ->
  managerApprovalId = $(this).val()
  $.ajax
    type: 'POST'
    url: 'admins/reportapprovals/manager_select'
    data: manager_approval_id: managerApprovalId
  return

使用ajax更新rails中的部分内容

1 个答案: