用 ajax 更新 rails 中的部分内容
Update a partial in rails with ajax
我目前正在尝试创建一个简单的下拉列表,其中包含一个名称和 phone 编号,然后当您单击 selected 选项时,它会更新另一个部分包含您使用 Ajax.
输入的 selected 选项的子对象的页面
即如果您从下拉菜单中选择 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 %> | <%= 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) );
})
})
更新-这个 js 文件给我这个错误
SyntaxError: [stdin]:6:5: unexpected (
如何select下拉菜单选项之一并刷新第二部分?现在 selected 值应该将实例 ID 作为“@selected_manager_approval”传递给第二部分,然后仅自动刷新页面上的第二部分?我应该怎么做?
在您的控制器中添加如下操作:
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
我目前正在尝试创建一个简单的下拉列表,其中包含一个名称和 phone 编号,然后当您单击 selected 选项时,它会更新另一个部分包含您使用 Ajax.
输入的 selected 选项的子对象的页面即如果您从下拉菜单中选择 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 %> | <%= 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) );
})
})
更新-这个 js 文件给我这个错误
SyntaxError: [stdin]:6:5: unexpected (
如何select下拉菜单选项之一并刷新第二部分?现在 selected 值应该将实例 ID 作为“@selected_manager_approval”传递给第二部分,然后仅自动刷新页面上的第二部分?我应该怎么做?
在您的控制器中添加如下操作:
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