jQuery的對話框

我（在某種程度上）重新發布了這個問題，這是在此基礎上先前的問題：jQuery的對話框

multiple occurences of jquery dialog boxes on table rows in rails 3 - how do I do this?

我提供了一個鏈接僅供參考之用。

經過幾個小時的努力使這項工作，我決定採取一個巨大的退步，並重新開始，基本知識。我的背景是，我非常精通rails編程，而且在Javascript（la jQuery）方面並不那麼熱門。

我有一個表並希望能夠使用jquery對話框更新每行中的兩個字段提供部分更新。

我已經設法讓對話框彈出部分，但只在第一行。 指向後續行的字段的鏈接在點擊時不會產生任何結果（它們剛剛死亡）。

這裏是.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>

最後，這裏是鏈接，對於表中的每一行重複：

 <%= link_to work_order.soft_completion_datetime.strftime('%m/%d/%Y %I:%M %p'), "#", :id => "etalink" %> 
     <%= link_to status_display, "#", :id => "statuslink" %>

我知道我的問題是一個補救的方式，因爲我只是沒有抓住.js的東西。如果任何人都可以在這裏指出我的正確方向，讓這些對話框以最有效的方式爲表格的每一行工作，我將永遠在你的債務中。

我一直堅持在這愚蠢的日子。

來源

2012-04-18 user1214966

我猜你的問題是，所有的鏈接似乎有id=statuslink，你不能有重複的ID。如果你簡單地將:id設置爲:class，那麼更改jQuery使用.statuslink而不是#statuslink，它應該修復它。對於共享相同屬性的任何其他元素也是如此。

來源

2012-04-18 22:44:38 Jake

感謝哥們，我會給你一個鏡頭。 – user1214966 2012-04-18 23:31:13

謝謝！你是一個拯救生命的人。 – user1214966 2012-04-18 23:34:10

1-如果您在頁面上使用多個項目，請使用class而不是id來選擇要應用綁定的項目;
2-您可以將document ready事件的2個塊加入一個;
3-若要選擇行中對話框的div，可以使用closest()來獲取與您指定的選擇器最接近的父對象。

有了這個改變你的代碼應該是這樣的：

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

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

來源

2012-04-18 22:44:06 rcdmk

真棒，效率更高。 – user1214966 2012-04-19 02:06:20

jQuery的對話框

回答

相關問題