You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
While dynamically creating elements via JS, which in my case, included a dropdown inside a segment/label, the dropdown fails to render properly, even after refreshing the dropdown js via $(...).dropdown(...);
When adding on: 'click' to .dropdown(...), it fails to process the click event. However, it seems to work with on: 'hover click', although not 100%.
However, while creating the fiddle, I realized that the issue also occurs on statically created elements, as such, the static version is posted here to simplify the code example.
Fiddle: http://jsfiddle.net/Airforce111/40khyfL6/
For reference...
<divid="test"><!-- Default Test Case --><divid="record-index-1" class="ui segment"><divclass="ui top attached label"><span>Label Test</span><divclass="options ui dropdown top right pointing transparent icon button" style="position: absolute; right: 0em; top: 0.3em;"><iclass="setting icon"></i> Click Me! Not Working!?
<divclass="menu"><divclass="header">Options</div><aclass="item"><iclass="edit green icon"></i> Option 1
</a><aclass="item"><iclass="warning red icon"></i> Option 2
</a></div></div></div><divclass="ui items"><divclass="item"><divclass="content"><divclass="ui header">Test Header</div><divclass="description">Some Random Text Here. Nothing to See.</div></div></div></div></div><!-- Click Fails --><divid="record-index-1" class="ui segment"><divclass="ui top attached label"><span>Label Test</span><divclass="options2 ui dropdown top right pointing transparent icon button" style="position: absolute; right: 0em; top: 0.3em;"><iclass="setting icon"></i> Click Me! Click Event Fails =(
<divclass="menu"><divclass="header">Options</div><aclass="item"><iclass="edit green icon"></i> Option 1
</a><aclass="item"><iclass="warning red icon"></i> Option 2
</a></div></div></div><divclass="ui items"><divclass="item"><divclass="content"><divclass="ui header">Test Header</div><divclass="description">Some Random Text Here. Nothing to See.</div></div></div></div></div><!-- Hover/Click Working Somewhat --><divid="record-index-1" class="ui segment"><divclass="ui top attached label"><span>Label Test</span><divclass="options3 ui dropdown top right pointing transparent icon button" style="position: absolute; right: 0em; top: 0.3em;"><iclass="setting icon"></i> Click Me! Hover Event Override Works Somewhat...
<divclass="menu"><divclass="header">Options</div><aclass="item"><iclass="edit green icon"></i> Option 1
</a><aclass="item"><iclass="warning red icon"></i> Option 2
</a></div></div></div><divclass="ui items"><divclass="item"><divclass="content"><divclass="ui header">Test Header</div><divclass="description">Some Random Text Here. Nothing to See.</div></div></div></div></div></div>
Hellos again~
While dynamically creating elements via JS, which in my case, included a dropdown inside a segment/label, the dropdown fails to render properly, even after refreshing the dropdown js via $(...).dropdown(...);
When adding on: 'click' to .dropdown(...), it fails to process the click event. However, it seems to work with on: 'hover click', although not 100%.
However, while creating the fiddle, I realized that the issue also occurs on statically created elements, as such, the static version is posted here to simplify the code example.
Fiddle: http://jsfiddle.net/Airforce111/40khyfL6/
For reference...
The text was updated successfully, but these errors were encountered: