Click here to Skip to main content
Rate this: bad
good
Please Sign up or sign in to vote.
See more: C# ASP.NET
I have a scenario where a user can select particular text and right click on a textbox, a context menu is
displayed and he can select a particular item from the list. Then, that text
will be appended to the appropriate textbox.
 
Ex:Context Menu have items like Name,Address,Number,Country..If i selected text as chennai and right click then selected Address in the menu list then the selected text(Ex:Chennai) display in the address textbox....
 
Here is My coding for context menu wil appear
 
Menu.aspx
 
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Menu.aspx.cs" Inherits="RightClickMenu.Menu" %>
 

 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
 
   <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.js" type="text/javascript"></script>    <script src="http://labs.abeautifulsite.net/archived/jquery-contextMenu/demo/jquery.contextMenu.js"        type="text/javascript"></script>    <link href="http://labs.abeautifulsite.net/archived/jquery-contextMenu/demo/jquery.contextMenu.css"        rel="stylesheet" type="text/css" />
  <%-- <link href="SampleScripts/Menu.css" rel="Stylesheet" type="text/css" />--%>
     <script type="text/javascript">
         $(document).ready(function () {
 
             $("input:text").focus(function () { $(this).select(); });
 
             $("#<%= txtEnterUrl.ClientID%>").contextMenu({
                 menu: 'myMenu'
             }, function (action, el, pos) {
 
             });
             $('#Name').click(clickHandler);
             $('#live').live('click', clickHandler);
 
             function clickHandler() {
                 alert("Clicked");
                 return false;
             }
 
         });
 

 

    </script>
</head>
<body>
 
    <ul id="myMenu" class="contextMenu">
    <li id="Name"><a href="#Name">Name</a></li>
    <li id="Number"><a href="#Number">Number</a></li>
    <li id="Address"><a href="#Address">Address</a></li>
    <li id="Country"><a href="#Country">Country</a></li>
</ul>
 
    <form id="form1" runat="server">
    <table style="width:100%; height:411px;">
    <tr>
       <td style="width:100%; height:20%">
 <asp:Panel ID="pnlHeader" runat="server" Height="59px">
    <asp:Label ID="lblEnterUrl" runat="server" Text="Enter Url" Font-Bold="true"
            style="z-index: 1; left: 271px; top: 66px; position: absolute" ></asp:Label>
    <asp:TextBox ID="txtEnterUrl" runat="server" Text="Chennai;
 
         style="z-index: 1; left: 405px; top: 59px; position: absolute; width: 505px; height: 32px"  ></asp:TextBox>
    </asp:Panel>
       </td>
    </tr>
    <tr>
       <td style="width:100%; height:80%">
       <asp:Label ID="lblName" runat="server" Text="Name"
    style="z-index: 1; left: 278px; top: 161px; position: absolute"></asp:Label>
<asp:TextBox ID="txtName" runat="server"
    style="z-index: 1; left: 376px; top: 159px; position: absolute" ></asp:TextBox>
<asp:TextBox ID="txtNumber" runat="server"
    style="z-index: 1; left: 375px; top: 256px; position: absolute"></asp:TextBox>
<asp:Label ID="lblAddress" runat="server" Text="Address"
 
    style="z-index: 1; left: 585px; top: 160px; position: absolute; height: 19px; width: 64px"></asp:Label>
<asp:TextBox ID="txtAddress" runat="server"
    style="z-index: 1; left: 707px; top: 158px; position: absolute" ></asp:TextBox>
<asp:Label ID="lblCountry" runat="server" Text="Country"
    style="z-index: 1; left: 584px; top: 259px; position: absolute"></asp:Label>
<asp:TextBox ID="txtCountry" runat="server"
    style="z-index: 1; left: 699px; top: 261px; position: absolute" ></asp:TextBox>
<asp:Label ID="lblNumber" runat="server" Text="Number"
    style="z-index: 1; left: 275px; top: 256px; position: absolute"></asp:Label>
</td>
    </tr>
    </table>
 
    </form>
</body>
</html>
Posted 2-Oct-12 20:42pm
__PP__598
Edited 2-Oct-12 21:09pm
v3
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 1

  Permalink  
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 2

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Menu.aspx.cs" Inherits="RightClickMenu.Menu" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
 
   <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.js" type="text/javascript"></script>    <script src="http://labs.abeautifulsite.net/archived/jquery-contextMenu/demo/jquery.contextMenu.js"        type="text/javascript"></script>    <link href="http://labs.abeautifulsite.net/archived/jquery-contextMenu/demo/jquery.contextMenu.css"        rel="stylesheet" type="text/css" />
   <%--<link href="SampleScripts/Menu.css" rel="Stylesheet" type="text/css" />--%>
     <script type="text/javascript">
         $(document).ready(function () {
 
             $("input:text").focus(function () { $(this).select(); });
 
             $("#<%= txtEnterUrl.ClientID%>").contextMenu({
                 menu: 'myMenu'
             }, function ShowSelection(action, el, pos) {
                 var textComponent = document.getElementById("<%= txtEnterUrl.ClientID%>");
                 var selectedText;
 
                 if (document.selection != undefined) {
                     textComponent.focus();
                     var sel = document.selection.createRange();
                     selectedText = sel.text;
                 }
                    else if (textComponent.selectionStart != undefined) {
                     var startPos = textComponent.selectionStart;
                     var endPos = textComponent.selectionEnd;
                     selectedText = textComponent.value.substring(startPos, endPos)
                 }
 

 
                 if (action === "Name") {
                     document.getElementById('<%= txtName.ClientID %>').value = selectedText;
                 } else if (action === "Number") {
                     document.getElementById('<%= txtNumber.ClientID %>').value = selectedText;
                 } else if (action === "Address") {
                     document.getElementById('<%= txtAddress.ClientID %>').value = selectedText;
                 }
                 else if (action === "Country") {
                     document.getElementById('<%= txtCountry.ClientID %>').value = selectedText;
                 }
 
             });
             $('#Name').click(clickHandler);
             $('#live').live('click', clickHandler);
 

         });
 

 

    </script>
</head>
<body>
    <ul id="myMenu" class="contextMenu">
    <li id="Name"><a href="#Name">Name</a></li>
    <li id="Number"><a href="#Number">Number</a></li>
    <li id="Address"><a href="#Address">Address</a></li>
    <li id="Country"><a href="#Country">Country</a></li>
</ul>
 
    <form id="form1" runat="server">
    <table style="width:100%; height:411px;">
    <tr>
       <td style="width:100%; height:20%">
 <asp:Panel ID="pnlHeader" runat="server" Height="59px">
    <asp:Label ID="lblEnterUrl" runat="server" Text="Enter Url" Font-Bold="true"
            style="z-index: 1; left: 271px; top: 66px; position: absolute" ></asp:Label>
    <asp:TextBox ID="txtEnterUrl" runat="server"
 
         style="z-index: 1; left: 405px; top: 59px; position: absolute; width: 505px; height: 32px"  ></asp:TextBox>
    </asp:Panel>
       </td>
    </tr>
    <tr>
       <td style="width:100%; height:80%">
       <asp:Label ID="lblName" runat="server" Text="Name"
    style="z-index: 1; left: 278px; top: 161px; position: absolute"></asp:Label>
<asp:TextBox ID="txtName" runat="server"
    style="z-index: 1; left: 376px; top: 159px; position: absolute" ></asp:TextBox>
<asp:TextBox ID="txtNumber" runat="server"
    style="z-index: 1; left: 375px; top: 256px; position: absolute"></asp:TextBox>
<asp:Label ID="lblAddress" runat="server" Text="Address"
 
    style="z-index: 1; left: 585px; top: 160px; position: absolute; height: 19px; width: 64px"></asp:Label>
<asp:TextBox ID="txtAddress" runat="server"
    style="z-index: 1; left: 707px; top: 158px; position: absolute" ></asp:TextBox>
<asp:Label ID="lblCountry" runat="server" Text="Country"
    style="z-index: 1; left: 584px; top: 259px; position: absolute"></asp:Label>
<asp:TextBox ID="txtCountry" runat="server"
    style="z-index: 1; left: 699px; top: 261px; position: absolute" ></asp:TextBox>
<asp:Label ID="lblNumber" runat="server" Text="Number"
    style="z-index: 1; left: 275px; top: 256px; position: absolute"></asp:Label>
</td>
    </tr>
    </table>
 
    </form>
</body>
</html>
  Permalink  

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
0 BillWoodruff 330
1 Mathew Soji 309
2 Maciej Los 295
3 DamithSL 225
4 Afzaal Ahmad Zeeshan 217
0 OriginalGriff 6,369
1 Sergey Alexandrovich Kryukov 5,973
2 DamithSL 5,183
3 Manas Bhardwaj 4,673
4 Maciej Los 4,025


Advertise | Privacy | Mobile
Web03 | 2.8.1411019.1 | Last Updated 3 Oct 2012
Copyright © CodeProject, 1999-2014
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100