[mayaa-user:427] Re: echo と insert の相性

2007年 1月 23日 (火) 01:16:23 JST

お世話になっております、山田です。

実際のコードを確認してみたところ、子ノード全体を<div></div>で囲み、それに対しても echo で id を付与していました。
（ツリーの展開・閉じるに対応して子の表示・非表示を切り替えるため）
つまり、echo の中で echo を使用し、その中で insert していました。


いただいたサンプルを以下のように書き換えると問題が再現します。

treeNode.html----------------------------------------------------------<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <title>treeNode component</title>
</head>
<body>
<div id="treeComponent">
<div id="treeNode">
    -<span id="nodeLabel">ラベル</span>
    <div id="childNodes"><!-- これが増えます -->
        <div id="childLoop">
            <div id="childNode">子ノード</div>
        </div>
    </div>
</div>
</div><!-- end of treeComponent -->
</body>
</html>

treeNode.mayaa---------------------------------------------------------
<?xml version="1.0" encoding="UTF-8"?>
<m:mayaa xmlns:m="http://mayaa.seasar.org">
    <m:doRender id="treeComponent" name="tree" />

    <m:echo id="treeNode">
        <m:attribute name="id" value="treeNode_${ binding.node.id }" />
    </m:echo>
    <!-- ↓のreplace="false"は結果簡略のため省略 -->
    <m:write id="nodeLabel" value="${ binding.node.label }" />
    
    <!-- これが増えます -->
    <m:echo id="childNodes">
        <m:attribute name="id" value="childNodes_${ binding.node.id }" />
    </m:echo>

    <!-- ↓のreplace="false"は意図した結果の邪魔だと考えて削除 -->
    <m:forEach id="childLoop" items="${ binding.node.children }" var="child" />
    <m:insert id="childNode" path="/treeNode.html" name="tree" node="${ child }" />
</m:mayaa>

結果(空白など調整済み)-------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <title>Welcome!</title>
    <style type="text/css"><!--
        div { margin-left: 16px; }
    --></style>
</head>
<body>
    
<div id="treeNode_R"><!-- これが増えます -->
    <div id="treeNode_N1"><!-- これが増えます -->
        <div id="treeNode_N1_C1"><!-- これが増えます -->
            <div id="treeNode_N1_C1_L1">
                -Leaf1
                <div id="childNodes_N1_C1_L1"><!-- これが増えます -->
                </div>
            </div>
            <div id="treeNode_N1_C1_L2">
                -Leaf2
                <div id="childNodes_N1_C1_L2"><!-- これが増えます -->
                </div>
            </div>
        </div>
        <div id="treeNode_N1_C2">
            -Child2
            <div id="childNodes_N1_C2"><!-- これが増えます -->
            </div>
        </div>
    </div>
    <div id="treeNode_N2"><!-- これが増えます -->
        <div id="treeNode_N2_C3"><!-- これが増えます -->
            <div id="treeNode_N2_C3_L3">
                -Leaf3
                <div id="childNodes_N2_C3_L3"><!-- これが増えます -->
                </div>
            </div>
        </div>
        <div id="treeNode_N2_C4"><!-- これが増えます -->
            <div id="treeNode_N2_C4_L4">
                -Leaf4
                <div id="childNodes_N2_C4_L4"><!-- これが増えます -->
                </div>
            </div>
        </div>
    </div>
    <div id="treeNode_N3">
        -Node3
        <div id="childNodes_N3"><!-- これが増えます -->
        </div>
    </div>
</div>

</body>
</html>


どうやらコメントは消えないようです。