2

我正在尝试使用 jQuery 动态插入行。除了组合框没有出现在行中之外，它可以与以下代码一起正常工作。我已经解析了组合框，但它仍然没有出现并在行中显示“Design Abbr [Widget dijit.form.ComboBox，solutionAbbr1]”。实际上我在这里期待一个组合框。谁能给我一些帮助来解决这个问题。我对 jquery 和 dojo 都使用 1.8 版本。

 var maxcount = 0;
 require(["dojo/parser", "dojo/dom", "dojo/store/Memory", "dijit/form/ComboBox", "dojo/domReady!"],
 function(parser, dom, Memory, ComboBox){
        this.addBlock =  function() {
        maxcount += 1;
        var stateStore = new Memory({data: [{name:"Alabama", id:"AL"},
{name:"Alaska", id:"AK"},{name:"Armed Forces the Americas", id:"AA"},
{name:"California", id:"CA"},{name:"Connecticut", id:"CT"}]});
        var comboBoxId = "solutionAbbr"+maxcount;
        var comboBox = new ComboBox({id: comboBoxId, name: "solutionAbbr",
value: "California",store: stateStore,searchAttr: "name"}, "stateSelect");
        //parser.parse.then(function(comboBox) {document.getElementById("solutionAbbr"+maxcount)});
        parser.parse(dijit.byId(comboBoxId));
        //alert(dijit.byId(comboBoxId).get('value'));


    $('<tr id="idForNewRow'+maxcount+'">'
        +'<td colspan="4">'
            +'<table id="idForBorder">'
                +'<tr class="even">'
                    +'<th align="left"><font color="red">Design Abbr</font></th>'
                    +'<td align="left" valign="bottom" colspan="3">'
                    +comboBox+'</td>'
                +'</tr>'
        +'</table></td></tr><tr><td colspan="4"><a href="javascript:removeRow('
            +maxcount+')">Remove</a>').insertAfter("[id*=idForNewRow]:last");
    }
});
4

1 回答 1

0

在您的插入中，您必须使用 comboBox.domNode::

 $('<tr id="idForNewRow'+maxcount+'">'
    +'<td colspan="4">'
        +'<table id="idForBorder">'
            +'<tr class="even">'
                +'<th align="left"><font color="red">Design Abbr</font></th>'
                +'<td align="left" valign="bottom" colspan="3">'
                +comboBox.domNode+'</td>'
            +'</tr>'
    +'</table></td></tr><tr><td colspan="4"><a href="javascript:removeRow('
        +maxcount+')">Remove</a>').insertAfter("[id*=idForNewRow]:last");

此外，如果您手动将其放置在页面上，您不妨从新的 ComboBox 构造函数中取出“stateSelect”。当您希望小部件将自身放置在页面上时，这就是您放置 domid 的位置。

另外，不要使用 parser.parse 命令，您应该只在将应用程序插入页面后调用应用程序启动:: comboBox.startup()

编辑（以上将不起作用，因为 comboBox.domNode 创建了一个节点对象）:: 为了使其更简单，我只需颠倒顺序即可。首先添加您的html然后创建小部件，然后小部件将能够将自己添加到页面中

    $('<tr id="idForNewRow' + maxcount + '">' + '<td colspan="4">' + 
      '<table id="idForBorder">' + 
      '<tr class="even">' + 
      '<th align="left"><font color="red">Design Abbr</font></th>' + 
      '<td align="left" valign="bottom" colspan="3" id="select' + maxcount + '"></td>'+
      '</tr>'+
    '</table></td></tr><tr><td colspan="4">'+
      '<a href="javascript: removeRow('+maxcount+')">Remove</a>').insertAfter("[id*=idForNewRow]:last");

    var stateStore = new Memory({data: [{name:"Alabama", id:"AL"},
    {name:"Alaska", id:"AK"},
    {name:"Armed Forces the Americas", id:"AA"},
    {name:"California", id:"CA"},
    {name:"Connecticut ", id:"CT"}]});

    var comboBoxId = "solutionAbbr"+maxcount;
    var comboBox = new ComboBox({id: comboBoxId, name: "solutionAbbr",
    value: "California",store: stateStore,searchAttr: "name"}, "select"+maxcount);
    comboBox.startup();

如http://jsfiddle.net/uLCS6/3/所示

于 2013-07-16T14:48:54.503 回答