在Google Apps脚本中以编程方式通过ID附加到div

Question

我正在尝试构建一个下拉菜单，其中的内容将填充来自数据库的数据。 我在纯html / jquery中工作，但是在Google Apps脚本中不工作。

代码：

function buildDropDown(inTitle, inName, inMenuId, inFilterId, inArray)
{
    // Create the drop down menu
    var div = $('<div id="' + inMenuId + '" class="funnelFiltermenu">');
    var input = $('<input type="text" name="' + inName + '" value="All" class="field" readonly />').appendTo(div);
    var ul = $('<ul class="funnelFilterlist">').appendTo(div);

    // Add the items of the drop down menu
    $.each(inArray, function(index,item) {
        $(ul).append('<li>'+item+'</li>')
    });

    // Add the drop down menu to the funnel
    $( div).appendTo(".dropdown");
}

这在Google脚本之外有效。 它在Google Apps脚本中不起作用。 我想这与caja的东西有关。 因此，我更改了代码，以便查找类似以下的类：

function buildDropDown(inTitle, inName, inMenuId, inFilterId, inArray)
{
    // Create the drop down menu
    var div = $('<div id="' + inMenuId + '" class="funnelFiltermenu">');
    $( div).appendTo(".dropdown");
    var theId = app.getElementById(div);

    var input = $('<input type="text" name="' + inName + '" value="All" class="field" readonly />').appendTo(theId);
    var ul = $('<ul class="funnelFilterlist">').appendTo(".funnelFiltermenu");

    // Add the items of the drop down menu
    $.each(inArray, function(index,item) {
        $(".funnelFilterlist").append('<li>'+item+'</li>')
    });
}

由于将有多个下拉列表（使用相同的类），所以我不能使用类。 我必须改用Ids。 但是caja更改了ID。

关于如何解决这个问题有什么想法吗？

Answer 1

我创建了以下解决方法：

我在html代码中硬编码了更多元素：

<div class="SSCheader"><h1>Project Eigenschappen</h1></div>
<div class="SSCcontent">
    <table>
        <tbody>
            <tr>
                <td><b>Project Nr</b></td>
                <td><?= getProjectData(2, 1) ?></td>
            </tr>
            <tr>
                <td><b>Project Initiatief</b></td>
                <td>
                    <div id="dropdown2" class="dropdown">
                        <div id="dd2" class="funnelFiltermenu">
                            <input type="text" name="aansturing" value="<?= getProjectData(2, 5) ?>" class="field" readonly />
                            <ul id="ul2" class="funnelFilterlist"></ul>
                        </div>
                    </div>
                </td>
            </tr>
            <tr>
                <td><b>Primair domein</b></td>
                <td>
                    <div id="dropdown3" class="dropdown">
                        <div id="dd3" class="funnelFiltermenu">
                            <input type="text" name="aansturing" value="<?= getProjectData(2, 6) ?>" class="field" readonly />
                            <ul id="ul3" class="funnelFilterlist"></ul>
                        </div>
                    </div>
                </td>
            </tr>
            <tr>
                <td><b>Aansturing door</b></td>
                <td>
                    <div id="dropdown4" class="dropdown">
                        <div id="dd4" class="funnelFiltermenu">
                            <input type="text" name="aansturing" value="<?= getProjectData(2, 7) ?>" class="field" readonly />
                            <ul id="ul4" class="funnelFilterlist"></ul>
                        </div>
                    </div>
                </td>
            </tr>

        </tbody>
    </table>
</div>

并且只添加

在javascript中：

 var gDomains = ["Rapportage", "Relaties", "Leden", "Projecten", "Personeel", "Boekhouding", "Faciliteren", "Verkoop", "Inkoop"]; var gInitiatief = ["SSC", "BIP", "ICCO", "C&F", "IO", "FZ", "KIA", "KIO", "JOP", "MWK", "HRM"]; var gAansturing = ["RegieOverleg", "Beleidstafel", "Lijnmanagement", "Stuurgroep"]; // Add the items of the drop down menu $.each(gInitiatief, function(index,item) { $("#ul2").append('<li>'+item+'</li>') }); // Add the items of the drop down menu $.each(gDomains, function(index,item) { $("#ul3").append('<li>'+item+'</li>') }); // Add the items of the drop down menu $.each(gAansturing, function(index,item) { $("#ul4").append('<li>'+item+'</li>') }); 

我认为，因为ID现在已经过硬编码，所以问题不再存在。