1 answer

81 views

[Solved] Adding context menu dynamically giving error

I am trying to show a context menu on mouse over of an image control.

Below is my code

Dim ControlsContainer As New Panel

Dim InfoIcon As New Image

Dim InfoContextMenu As New RadContextMenu

Dim mi As New RadMenuItem

ControlsContainer.ID = "pnlInfoContainer"

InfoIcon.ID = "InfoImageIcon"

InfoIcon.ImageUrl = "/mb/admin/images/plus.png"

InfoIcon.Attributes.Add("onmouseover", "ShowInfoMenuOnLeftClick();")

InfoContextMenu.ID = "mb_InfoContents_ContentextMenu"

InfoContextMenu.ClientIDMode = System.Web.UI.ClientIDMode.Static

mi.Text = "Home"

InfoContextMenu.Items.Add(mi)

ControlsContainer.Controls.Add(InfoIcon)

ControlsContainer.Controls.Add(InfoContextMenu)

Dim script As String = "<script type=""text/javascript"

"> function ShowInfoMenuOnLeftClick(sender, args) {     var contextMenu = $find('mb_InfoContents_ContentextMenu'); console.log(contextMenu); contextMenu.show(args); } </script>"

If Not Me.Page.ClientScript.IsStartupScriptRegistered("InfocontentsMenu") Then

Me.Page.ClientScript.RegisterStartupScript(Me.Page.GetType, "InfocontentsMenu", script)

End If

Me.Controls.Add(ControlsContainer)

Dim MenuTargetConfiguration As New ContextMenuControlTarget()

MenuTargetConfiguration.ControlID = "InfoImageIcon"

InfoContextMenu.Targets.Add(MenuTargetConfiguration)

I am getting a java script error with this code..

Uncaught TypeError: Cannot read property 'target' of undefined Telerik.Web.UI.WebResource.axd:4660
1. a.RadContextMenu.showTelerik.Web.UI.WebResource.axd:4660
2. ShowInfoMenuOnLeftClickindex.aspx:560
3. onmouseover

Can you help me!!

Menu

answered on 07 Nov 2012

1 answer

91 views

Export Not working

Scenario:

Grid in Conditional Update Panel
Within a UserControl
On a SiteFinity Page
Custom Export Buttons within the PagerTemplate.

Events are not firing on the server side as I cannot declaratively add the Event Triggers.
Cannot use script mananger as it's on the SiteFinity Page not in this control

Events fire on the Client Side but do nothing when executed.

Clinet code is straightforward enough but does not error or work

function onClientExcelExportCommand(sender, eventArgs) {

var tableView = $find("<%= TransactionListGrid.ClientID %>").get_masterTableView();

tableView.exportToExcel();

}

Help is required.

Many thanks

Grid

answered on 07 Nov 2012

1 answer

82 views

Binding the RadGrid dynamically with RadEditor in javascript

Hello,

I have a RadGrid with 4 template columns.
1. ASP:TextBox
2. RadEditor
3. ASP:LinkButton (ADD)
4. ASP:LinkButton. (DELETE)

When we click on "ADD" button we are adding a new row next to the selected row. Same way we are deleting the selected row on click of "DELETE" button. This we are doing in postback by rebinding the RadGrid. We need to avoid the postback and Add/Delete rows dynamically in javascript. Please provide the solution. Please find herewith the sample code that we are doing in code behind.

FYI: we are using net framework 4.0 and the Telerik.Web.UI.dll version is v. 2011.2.915.40

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="RadGridTesting.WebForm1" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerikControls" %>

<!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 runat="server">

<title></title>

<link href="../../TelerikCSS_ETO/Grid.ETOGrid.css" rel="stylesheet" type="text/css" />

</head>

<body>

<form id="form1" runat="server">

<asp:ScriptManager ID="scrpt1" runat="server"></asp:ScriptManager>

<div>

<telerikControls:RadGrid ID="gvTest" runat="server" GridLines="None"

onitemcommand="gvTest_ItemCommand"

onneeddatasource="gvTest_NeedDataSource">

<MasterTableView AutoGenerateColumns="false" ShowFooter="true" Width="100%" TableLayout="Auto"

HeaderStyle-VerticalAlign="Middle" HeaderStyle-HorizontalAlign="Left" HeaderStyle-Font-Bold="true"

ViewStateMode="Enabled" ItemStyle-VerticalAlign="Middle" ExpandCollapseColumn-Display="false"

ExpandCollapseColumn-Visible="false">

<Columns>

<telerikControls:GridTemplateColumn>

<ItemTemplate>

<asp:TextBox ID="txtsno" MaxLength="3" runat="server" Width="25px" Text='<%# Eval("sno") %>'></asp:TextBox>

</ItemTemplate>

</telerikControls:GridTemplateColumn>

<telerikControls:GridTemplateColumn HeaderStyle-HorizontalAlign="Left">

<ItemTemplate>

<telerikControls:RadEditor ID="txt1" runat="server" Height="25px" ToolsWidth="130px"

Content='<%# DataBinder.Eval(Container.DataItem, "text") %>'

ToolbarMode="ShowOnFocus" EditModes="Design" ContentFilters="DefaultFilters" />

</ItemTemplate>

</telerikControls:GridTemplateColumn>

<telerikControls:GridTemplateColumn ItemStyle-VerticalAlign="Top">

<ItemTemplate>

<asp:LinkButton ID="lbtn1" CausesValidation="false" CommandName="DELETE" Text="Delete"

runat="server"></asp:LinkButton>

</ItemTemplate>

</telerikControls:GridTemplateColumn>

<telerikControls:GridTemplateColumn ItemStyle-VerticalAlign="Top">

<ItemTemplate>

<asp:LinkButton ID="lbtn2" CausesValidation="false" CommandName="ADD" Text="Add"

runat="server"></asp:LinkButton>

</ItemTemplate>

</telerikControls:GridTemplateColumn>

</Columns>

</MasterTableView>

</telerikControls:RadGrid>

</div>

</form>

</body>

</html>

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using Telerik.Web.UI;

namespace RadGridTesting

{

public partial class WebForm1 : System.Web.UI.Page

{

List<DataText> lstList = new List<DataText>();

protected void Page_Load(object sender, EventArgs e)

{

}

/// <summary>

/// Add and remove row

/// </summary>

/// <param name="sender"></param>

/// <param name="e"></param>

protected void gvTest_ItemCommand(object sender, Telerik.Web.UI.GridCommandEventArgs e)

{

if (e.CommandName == "ADD")

{

GridDataItem item = (GridDataItem)((LinkButton)e.CommandSource).NamingContainer;

lstList = BindGrid(item.ItemIndex, "Add");

this.gvTest.Rebind();

}

else if (e.CommandName == "DELETE")

{

GridDataItem item = (GridDataItem)((LinkButton)e.CommandSource).NamingContainer;

lstList = BindGrid(item.ItemIndex, "Delete");

this.gvTest.Rebind();

}

protected void gvTest_NeedDataSource(object sender, Telerik.Web.UI.GridNeedDataSourceEventArgs e)

{

if (!IsPostBack)

{

lstList = new List<DataText> {

new DataText{ sno = 1 , text = "A"},

new DataText{ sno = 2 , text = "B"},

new DataText{ sno = 3 , text = "C"},

new DataText{ sno = 4 , text = "D"},

new DataText{ sno = 5 , text = "E"}

};

}

this.gvTest.DataSource = lstList;

}

private List<DataText> BindGrid(int _RowID, string opAddDelete)

{

lstList = new List<DataText>();

int sno = 1;

foreach (GridDataItem item in this.gvTest.Items)

{

RadEditor txt1 = (RadEditor)item.FindControl("txt1");

DataText dt = new DataText();

if (opAddDelete == "Delete" && item.ItemIndex == _RowID)

{

}

else

{

dt.sno = sno;

dt.text = txt1.Text;

lstList.Add(dt);

sno++;

}

if (opAddDelete == "Add" && item.ItemIndex == _RowID)

{

dt = new DataText();

dt.sno = sno;

lstList.Add(dt);

sno++;

}

return lstList;

}

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

namespace RadGridTesting

{

public class DataText

{

public int sno { get; set; }

public string text { get; set; }

}

Grid

answered on 07 Nov 2012

0 answers

67 views

RadGrid - Show Group Panel

Hi,
I am trying to use the show group panel, allowing a user to drag the column names into it, however it keeps throwing an error:

"Error: Sys.WebForms.PageRequestManagerServerErrorException: Invalid group by expression: 'Group By' clause missing"

However if I define an item in the configuration manager it works, properly, So why can't I drag and Drop? :(

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Orders.aspx.vb" Inherits="Orders" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<!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>Work Orders</title>

</head>

<body>

<form id="form2" runat="server">

<telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server">

</telerik:RadStyleSheetManager>

<telerik:RadSkinManager ID="RadSkinManager1" runat="server">

</telerik:RadSkinManager>

<telerik:RadScriptManager ID="RadScriptManager1" runat="server">

</telerik:RadScriptManager>

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">

<script type="text/javascript">

function ShowEditForm(id, rowIndex) {

//alert("orderID" + ' ' + id);

var grid = $find("<%= RadGrid1.ClientID %>");

var rowControl = grid.get_masterTableView().get_dataItems()[rowIndex].get_element();

grid.get_masterTableView().selectItem(rowControl, true);

var t = document.getElementById("<%= lblTemplate.ClientID %>").value;

//alert("row = " + rowIndex);

var ow = window.radopen("OrderUpdate.aspx?OrderID=" + id + "&Template=" + t, "UpdateWorkOrder");

//alert("After window open");

ow.Maximize();

return false;

}

function ShowInsertForm() {

var t = document.getElementById("<%= lblTemplate.ClientID %>").value;

var ow = window.radopen("OrderUpdate.aspx?OrderID=0" + "&Template=" + t + "&OrderType=R", "UpdateWorkOrder");

//alert("After window open");

ow.Maximize();

return false;

}

function RowMouseOver(sender, eventArgs) {

var text = "";

text += "Work Order Description - ";

var i = eventArgs.get_itemIndexHierarchical();

//text += i

//var firstDataItem = $find("<%= RadGrid1.MasterTableView.ClientID %>").get_dataItems()[0];

//var keyValues = 'OrderID: "' + firstDataItem.getDataKeyValue("OrderID");

//

//<telerik:GridBoundColumn DataField="Text" HeaderText="Text" UniqueName="Text" Display="false">

// </telerik:GridBoundColumn>

//text += ", OrderID: " + keyValues

// following 3 lines worked

var Description = eventArgs.getDataKeyValue("Text")

text += Description

document.getElementById("OutPut").innerHTML = text;

}

function refreshGrid(arg) {

if (!arg) {

$find("<%= RadAjaxManager1.ClientID %>").ajaxRequest("Rebind");

}

else {

$find("<%= RadAjaxManager1.ClientID %>").ajaxRequest("RebindAndNavigate");

}

</script>

</telerik:RadCodeBlock>

<%--<div id="header">

<h1>

<asp:Label ID="lblVersion" runat="server" Text="Profess Roads Cost Manager" ForeColor="White"></asp:Label>

</h1>

</div>--%>

<div>

<telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" DecoratedControls="All"

ControlsToSkip="Textbox" />

<table width="100%">

<tr>

<td style="width: 100%; text-align: left;">

<telerik:RadButton ID="chkShowAll" runat="server" Text="Show All" ButtonType="ToggleButton"

ToggleType="CheckBox" />

<telerik:RadButton ID="chkRoutine" runat="server" Text="Reactive" ButtonType="ToggleButton"

ToggleType="CheckBox" />

<telerik:RadButton ID="chkProgrammed" runat="server" Text="Proactive" ButtonType="ToggleButton"

ToggleType="CheckBox" />

<telerik:RadButton ID="chkCyclic" runat="server" Text="Cyclic" ButtonType="ToggleButton"

ToggleType="CheckBox" />

<telerik:RadButton ID="chkProject" runat="server" Text="Related by Project" ButtonType="ToggleButton"