Mam powtarzaną kontrolę, która zawiera proste pole wyboru i pole obliczone (tak naprawdę nie ma znaczenia), tak jak: [ ] text1 [x] text2 [ ] text3 [x] text4 [x] text5

Chcę pokazać dodatkową klikalną ikonę obok bieżącego elementu / wiersza po najechaniu wskaźnika myszy nad nim [ ] text1 (*) [x] text2 [ ] text3 [x] text4 [x] text5

Czy to jest możliwe? Dzięki

Str.s. Muszę pokazać tę ikonę, niezależnie od tego, gdzie kursor myszy (pole wyboru lub pole tekstowe). Chcę to pokazać na bieżący wiersz (gdy kursor myszy gdzieś w obecnym rzędzie)

1
VladP 13 sierpień 2014, 23:53

2 odpowiedzi

Najlepsza odpowiedź

Jest to możliwe dzięki łatwej sztuczce CSS. Jako przykład, wykonaj następującą kontrolę powtarzania:

<xp:table>
    <xp:tr>
        <xp:td></xp:td>
        <xp:td>
            <xp:label
                value="Some Header"
                id="label1">
            </xp:label>
        </xp:td>
    </xp:tr>
    <xp:repeat
        id="repeat1"
        rows="30"
        var="textValue"
        indexVar="index">
        <xp:this.value><![CDATA[#{javascript:["text1", "text2", "text3", "text4", "text5"] }]]></xp:this.value>
        <xp:tr
            styleClass="magicRow">
            <xp:td>
                <xp:button
                    value="x"
                    id="button1"
                    styleClass="magicButton">
                </xp:button>
            </xp:td>
            <xp:td>
                <xp:checkBox
                    text=""
                    id="checkBox1">
                </xp:checkBox>
                <xp:text
                    escape="true"
                    id="computedField1"
                    value="#{textValue}">
                </xp:text>
            </xp:td>
        </xp:tr>
    </xp:repeat>
</xp:table>

Użyliśmy regulacji powtarzania w tabeli, więc powtarza elementy wiersza 5 razy. Teraz użyjemy następujących CSS, aby ukryć przycisk Magic i pokazać tylko wtedy, gdy wskaźnik myszy jest nad rzędem:

tr.magicRow .magicButton { visibility:hidden; } 
tr.magicRow:hover .magicButton { visibility:visible; }

:hover jest przydatnym CSS Wybór.

3
Serdar Basegmez 14 sierpień 2014, 06:32

Jestem pewien, że jest to możliwe. Nie mam przykładu kodu Handy, ponieważ nie jestem świetny z JavaScript Klienta JavaScript, ale muszę myśleć, że możesz, z Dojo lub JQuery, dołączyć zdarzenie na Hover, a może nawet "OnMouseout" i w tym wydarzeniu Możesz użyć Dojo / jQuery, aby dodać / usunąć CSS do przycisku.

0
David Leedy 13 sierpień 2014, 20:32