title: Adding additional data to Kendo UI Context Menu items
body: <p>I want to utilize the Kendo UI Context Menu in my app. I was expecting the standard behavior of having text displayed in the menu itself but a different value (an ID or key) being returned to the <code>select</code> event handler.</p>
  
  <p>For instance, the menu displays a list of names but when I click on one of them, I get the ID associated with the name.</p>
  
  <p>I've tried adding additional properties besides <code>text</code> to the array of items in the context menu but I don't see them on the event object in the handler.</p>
  
  <p>I can't use the text to find the appropriate id that matches it since there could be entries with the same text but different IDs.</p>
  
  <p>Any ideas?
  <br><br><br>
  <strong>Edit:</strong></p>
  
  <p>Currently I build the context menu like this:</p>
  
  <pre><code>open: (e) =&gt; {
      let itemKeys = [1, 2, 3];
  
      let menu = e.sender;
      menu.remove(".context-menu-item");
      menu.append(itemKeys.map((itemKey) =&gt; {
          return {
              text: "&lt;div data-item-key='" + itemKey + "'&gt;Test Text&lt;/div&gt;",
              cssClass: "context-menu-item",
              encoded: false
          };
      }));
  }
  </code></pre>
  
  <p>While this solution does satisfy my needs, it adds an extra element to the DOM which, while being insignificant, isn't perfect...</p>