javascript - invoke primefaces context menu from java script -
javascript - invoke primefaces context menu from java script -
i have svg on webpage. elements when right clicked on should display context menu info fetched database. elements written in such way right click event triggers js function on page. , need invoke context menu java script. can please help me this. have been stuck issue 3 days. element :
<rect/><text>l</text></g><g id="118" onmousedown="rightclickexecute(event,118)">
java script :
function rightclickexecute(event, id) { if (event.button == 2) {document.getelementbyid("myform:selectedentityid").value = id; document.getelementbyid("myform:selectedobjecttype").value = 'entity'; document.getelementbyid("myform:rightaction").click(); } } function showcontextmenu(){ document.getelementbyid("myform:contextmenuitemid").click(); }
xhtml:
<p:contextmenu id="contextmenuid" for="svgcontainerpanel" widgetvar="contextmenuvar" rendered="#{mybean.objecttype=='entity' ? true : false}"> <p:menuitem id="contextmenuitemid" ></p:menuitem> </p:contextmenu> <p:contextmenu event="click" id="contextmenu2id" for="contextmenuid" widgetvar="contextmenu2var" model="#{my.model}" > </p:contextmenu> <p:commandbutton id="rightaction" style="visibility:hidden" action="#{mybean.populatemenu}" ajax="true" type="submit" oncomplete="showcontextmenu()" update="contextmenuid,contextmenu2id"> </p:commandbutton> <h:inputhidden id="selectedentityid" value="#{mybean.selectedentityid}"> </h:inputhidden> <h:inputhidden id="selectedobjecttype" value="#{mybean.objecttype}"> </h:inputhidden>
primefaces's contextmenu doesn't have alternative that, can utilize jquery that. if want show contextmenu, have alter contextmenu's position mouse's position(page load contextmenu default, have css display:none, need alter css). primefaces's contextmenu have widgetvar attribute utilize in client(it have method show show it).
primefaces's contextmenu
have widgetvar
attribute utilize in client(it have method show show it).
for example, show contextmenu when mouse hover component, have id rongnk
, have form(id:form), contextmenu(id:xxx)
<script type="text/javascript"> //<![cdata[ $(document).on('mouseover', '#form\\:rongnk', function(e) { $(primefaces.escapeclientid('form:xxx')).css({ top: e.pagey+'px', left: e.pagex+'px' }).show(); }); //]]> </script>
javascript xhtml contextmenu
Comments
Post a Comment