2013-03-25 79 views
3

我在我的應用程序中使用grails richui autocomplete字段。 它適用於我的靜態文本框,但是當我克隆文本框時,此功能對克隆的文本框無效,甚至不顯示任何錯誤。Grails richui自動完成克隆文本框

的如何解決這一問題

這裏的任何想法是我的代碼:

<resource:autoComplete skin="default" /> 

在頂部

<richui:autoComplete name="filterLocation1" id="filterLocation1" delimChar=";" class="location_txtbox" action="${createLinkTo('dir': 'abc/yyy')}" style="margin-left:5px;"/> 

這是我的自動完成場

,我克隆樣這

var counter = 1; 
$("#addRow").click(function() { 
counter++; 
var cln = $('#static_table tbody>tr:last').clone(true); 
cln.find("[id^='filterLocation']").each(function(i, val) { 
    val.id = val.id.match(/^([^0-9]+)[0-9]*$/)[1] + "" + counter; 
}); 

return false; 
}); 

我克隆整個行,做一些隱藏/顯示操作並增加id。

+0

關於如何解決它的很多想法...但你需要向我們展示你的代碼.... – bipen 2013-03-25 05:28:40

+0

我已編輯並給我的代碼bipen ..... – user1934095 2013-03-25 05:43:07

+0

你怎麼在jQuery中調用自動完成? ? – bipen 2013-03-25 05:47:40

回答

0

當你克隆tr它克隆所有的內容,它包括由插件創建的javascript。此克隆腳本使用text fieldid使其成爲auto complete。此id和文本字段需要更改以進行克隆的自動完成工作。

我用下面的腳本來改變這種IDS:

<script type="text/javascript"> 
    var counter = 1; 
    function asd() { 
     var cloneContent = "<tr>" + $("#firstTrToClone").html().replace(/giveAUniqueId/g, "giveAUniqueId" + counter++) + "</tr>"; 
     $("#tableId").append(cloneContent); 
    } 
</script> 

以下是我的全部工作頁:

<!DOCTYPE html> 
<html> 
<head> 
<resource:autoComplete skin="default"/> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
<script type="text/javascript"> 
    var counter = 1; 
    function asd() { 
     var cloneContent = "<tr>" + $("#firstTrToClone").html().replace(/giveAUniqueId/g, "giveAUniqueId" + counter++) + "</tr>"; 
     $("#tableId").append(cloneContent); 
    } 
</script> 
</head> 

<body> 
<g:form> 
<table id="tableId"> 
    <tr id="firstTrToClone"> 
     <td> 
      <richui:autoComplete name="name" id="giveAUniqueId" action="${createLinkTo('dir': 'oauthCallBack/test')}"/> 
     </td> 
    </tr> 
</table> 
</g:form> 

<button onclick="asd()">Clone</button> 

</body> 
</html> 

試試吧..,。