How will i get clicked Item? - Angular, Vue, React, Web Components, Javascript, HTML5 Widgets

This topic contains 1 reply, has 2 voices, and was last updated by Ivo Zhulev 7 years, 3 months ago.

Viewing 2 posts - 1 through 2 (of 2 total)

Author

How will i get clicked Item? Posts
February 7, 2016 at 2:59 pm How will i get clicked Item? #81207
zakstev
Participant
hi,

How will i get clicked menu item? I’m using 4.0 version.

Thanks in advance…

<%@ page language=”java” contentType=”text/html; charset=ISO-8859-1″
pageEncoding=”ISO-8859-1″%>
<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>

<html lang=”en”>
<head>
<meta name=”keywords” content=”jQuery Menu, Main Menu, Context Menu, Vertical Menu, Popup Menu, Menu, jqxMenu” />
<meta name=”description” content=”The jqxMenu widget makes it easy to add menus to your website or web application. With the jqxMenu you can create website menus, customized context menus, or application-style menu bars with just a small amount of scripting.” />
<title id=’Description’>Big Objectives</title>
<link rel=”stylesheet” href=”jqwidgets/styles/jqx.base.css” type=”text/css” />
<script type=”text/javascript” src=”scripts/jquery-1.11.1.min.js”></script>
<script type=”text/javascript” src=”scripts/demos.js”></script>
<script type=”text/javascript” src=”jqwidgets/jqxcore.js”></script>
<script type=”text/javascript” src=”jqwidgets/jqxmenu.js”></script>
<script type=”text/javascript” src=”jqwidgets/jqxcheckbox.js”></script>
<script type=”text/javascript” src=”jqwidgets/jqxradiobutton.js”></script>

<style>
.wrap {
Width: 100%;
overflow:auo;
}

.fleft {
float:left;
height: 100%;
width: 17.2%;
}

.fright {
float: right;
height: 100%;
width: 82.8%;
}
</style>

</head>
<body>
<div class=”wrap”>
<div class=”fright”><iframe style=”position:absolute;height:100%;width:100%; border:none” src =”http://www.rt.com” style=”height:100%;width:100%;”></iframe></div>
<div class=”fleft” id=’content’>
<script type=”text/javascript”>
$(document).ready(function () {
// Create a jqxMenu
$(“#jqxMenu”).jqxMenu({ width: ‘250px’, height: ‘900px’, mode: ‘vertical’});
$(“#jqxMenu”).css(‘visibility’, ‘visible’);

// create checkboxes
$(“#checkbox”).jqxCheckBox({ checked: true});
$(“#checkbox2”).jqxCheckBox({});
$(“#checkbox3″).jqxCheckBox({});
});
/* $(‘#jqxMenu’).on(‘itemclick’, function (event)
{
// get the clicked LI element.
var element = event.args;
alert(element);
}); */

$(‘#jqxMenu’).on(‘itemclick’, function (event) {
alert($(event.target).text());
});
</script>
<div id=’jqxWidget’ style=’height: 300px;’>
<div id=’jqxMenu’ style=”visibility: hidden;”>
- <span>Mail</span>
- <span>Calendar</span>
- <span>Contacts</span>
- <span>
  <span>Inbox</span></span>
  - <span>jQWidgets</span>
    
    <span>Admin</span>
    
    <span>Corporate</span>
    
    <span>Finance</span>
    
    <span>Other</span>
  - <span>Personal</span>
- <span>Deleted Items</span>
  - <span>Today</span>
  - <span>Last
    Week</span>
  - <span>Last
    Month</span>
- <span>Settings</span>
  <ul style=”width: 230px;”>
- <div style=’float: left; margin-right: 5px;’ id=’checkbox’>
  </div>
  Enable Auto-Save
- <div style=’float: left; margin-right: 5px;’ id=’checkbox2′>
  </div>
  Send email as anonymous
- <div style=’float: left; margin-right: 5px;’ id=’checkbox3′>
  </div>
  Save sent emails
<span>Notes</span>
<span>Favorites</span>

</div>
</div>
</div>
</div>
</body>
</html>