0

我要完成的任务:

我有一个 Rails 3 应用程序,它为一家电信公司处理工作订单。工单控制器的索引页面以每页最多 30 行的形式显示分页工单。

客户希望能够从此页面更新两个字段。它们是Technician ETAWork Order Status。我编写了一些代码来使用 jquery 对话框弹出窗口来提供部分表单(每个字段一个)以进行更新。

到目前为止,我已经能够让弹出窗口为表单部分提供服务,但它们仅适用于第一行。页面上后续行的链接不起作用。我希望这是因为包含对部分调用的 div 必须为每一行(在这种情况下为每个工作订单)唯一命名。

目前我只是试图解决让每一行的对话框弹出迭代在前端工作的问题。这就是我目前的代码:

.js:

$(document).ready(function() {
$('div#status-chg-form').dialog({ autoOpen: false });
$('#statuslink').click(function(){ $('div#status-chg-form').dialog('open'); });
});

$(document).ready(function() {
$('div#eta-chg-form').dialog({ autoOpen: false });
$('#etalink').click(function(){ $('div#eta-chg-form').dialog('open'); });
});

渲染部分的 div(在我的索引视图中):

<div id="status-chg-form" title="CHANGE WORK ORDER STATUS" style="display:none"><%= render :partial => 'statusform' %></div>
<div id="eta-chg-form" title="CHANGE TECHNICIAN ETA" style="display:none"><%= render :partial => 'etaform' %></div>

和链接(在我的索引视图中):

<a href="#" id="statuslink"><%= status_display %></a>

(注意:status_display 变量已正确填充)

<% if work_order.soft_completion_datetime.blank? %>
    <a href="#" id="etalink"><%= "No ETA Entered" %></a>
<% else %>
    <a href="#" id="etalink"><%= work_order.soft_completion_datetime.strftime('%m/%d/%Y %I:%M %p') %></a>
<% end %>

我想我可以使用工作订单行中的 id 作为每次出现对话框的唯一标识符,但我不是一个经验丰富的 jquery 编码器,所以我需要更大的头脑来指出我正确的方向。

4

1 回答 1

0

好的,所以我对这个问题有部分解决方案,但我仍然对 jquery 有一些困难。

为了唯一标识对话框 div 和相应的链接,我这样做了:

对于状态:

            <% statusidname = "statuslink-" + work_order.id.to_s %>
            <%= link_to (status_display, "#", :id => statusidname, :onclick => "statusdialog('#{work_order.id.to_s}')") %>    
            <% statusdivname = "status-chg-form-" + work_order.id.to_s %>
            <%= content_tag :div, :class => statusdivname, :style =>"display:none" do %>
               <%= render :partial => 'statusform' %>
            <% end %>

对于预计到达时间:

       <% etaidname = "etalink-" + work_order.id.to_s %>    
       <% if work_order.soft_completion_datetime.blank? %>
         <%= link_to ("No ETA Entered", "#", :id => etaidname, :onclick => "etadialog('#{work_order.id.to_s}')") %>
       <% else %>
         <%= link_to (work_order.soft_completion_datetime.strftime('%m/%d/%Y %I:%M %p'), "#", :id => etaidname, :onclick => "etadialog('#{work_order.id.to_s}')") %>
       <% end %>
       <% etadivname = "eta-chg-form-" + work_order.id.to_s %>
       <%= content_tag :div, :class => etadivname, :style =>"display:none" do %>
          <%= render :partial => 'etaform' %>
       <% end %>

总之,基本上这段代码创建了名为 statuslink-999 和 etalink-999 的链接和名为 status-chg-form-999 和 eta-chg-form-999 的 div,其中 999 是 work_order.id 从而唯一地命名每个链接和 div每一行。

这是我的.js。它目前不工作。我无法弄清楚我在这里到底做错了什么,但脚本没有收到 rowid。

$(function statusdialog(rowid) {
$('div#status-chg-form-'+rowid).dialog({ autoOpen: false });
$('#statuslink-'+rowid).click(function(){ $('div#status-chg-form-'+rowid).dialog('open'); });
});

$(function etadialog(rowid) {
$('div#eta-chg-form-'+rowid).dialog({ autoOpen: false });
$('#etalink-'+rowid).click(function(){ $('div#eta-chg-form-'+rowid).dialog('open'); });
});
于 2012-04-14T21:15:00.987 回答