3

grails richui autocompleteアプリでフィールドを使用しています。私の静的テキストボックスでは問題なく動作しますが、テキストボックスを複製すると、この機能は複製されたテキストボックスでは機能せず、エラーも表示されません。

これを修正する方法のアイデア

これが私のコードです:

<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 をインクリメントします。

4

1 に答える 1

0

クローンを作成するtrと、すべてのコンテンツがクローンjavascriptされ、プラグインによる作成が含まれます。この複製されたスクリプトは、idの を使用してtext fieldを作成しauto completeます。複製されたオートコンプリートを機能させるには、このidフィールドとテキスト フィールドを変更する必要があります。

次のスクリプトを使用して、その ID を変更します。

<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>

それを試してみてください..、。

于 2013-11-12T18:31:35.483 に答える