This question is locked. New answers and comments are not allowed.
Ravi Keshwani
Top achievements
Rank 1
Rank 1
Ravi Keshwani
asked on 05 Oct 2010, 05:58 AM
Hi,
I am new to telerik MVC. I have a project where I had add Jquery JS file in a page named /jquery.contextMenu.js for showing context menu on right click of the td. And when I am trying to access any function of it, the exception is thrown as "Object does'nt support this property or method " In IE on the line "$("td.showContext"). and "$("td.showContext").contextMenu is not a function" in Mozilla . When I copy the functions from /jquery.contextMenu.js in the page under $(document).ready it shows the context menu properly. Below is the code for it...
Master Page :
<head runat="server">
<title><asp:ContentPlaceHolder ID="TitleContent" runat="server" /></title>
<%= Html.Telerik().StyleSheetRegistrar()
.DefaultGroup(group => group.Add("telerik.common.css")
.Add("telerik.Office2007.css"))
%>
</head>
and also added
<%= Html.Telerik().ScriptRegistrar() %>
at the end of the master page.
Page inherited from master page :
<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
System Types
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<script src="../../Scripts/2010.2.825/jquery-1.4.2.min.js" type="text/javascript"></script>
<script src="../../Scripts/2010.2.825/jquery.contextMenu.js" type="text/javascript"></script>
<script type="text/javascript">
function contextMenuWork(action, el, pos) {
switch (action) {
case "delete":
{
alert("Clicked Delete");
break;
}
case "insert":
{
alert("Clicked insert");
break;
}
case "edit":
{
alert("Clicked edit");
}
}
}
$(document).ready(function () {
$("td.showContext").contextMenu({ menu: 'myMenu' }, function (action, el, pos) { contextMenuWork(action, el, pos); });
});
</script>
<%
Html.Telerik().Grid(Model)
.EnableCustomBinding(true)
.Name("SystemTypeGrid")
.DataKeys(d=>d.Add(c=>c.Id))
.ToolBar(commands => commands.Insert().ButtonType(GridButtonType.ImageAndText).ImageHtmlAttributes(new
{
style =
"margin-left:0"
})
)
.DataBinding(db=>db
.Server()
.Insert("New","SystemType")
.Update("Update","SystemType")
)
.Columns(cols =>
{
cols.Bound(col => col.Id).Hidden(true);
cols.Bound(col => col.Title).Width(200).HtmlAttributes(new { @class = "showContext" });;
cols.Bound(col => col.FinalSoftWare).Title("Final Software").Width(130);
cols.Bound(col => col.Description).Width(300);
cols.Command(commands => commands
.Edit()
);
})
.Sortable()
.Scrollable()
.Editable(e=>e.Mode(GridEditMode.PopUp))
.Selectable()
//.ClientEvents(events => events
// .OnRowSelect("Grid_onRowSelect")
// )
.Render();
%>
<table id="tbl1">
<tr class="row">
<td> Table Row </td>
</tr>
</table>
<ul id="myMenu" class="contextMenu">
<li class="insert"><a href="#insert">Add New</a></li>
<li class="edit"><a href="#edit">Edit</a></li>
<li class="delete"><a href="#delete">Delete</a></li>
</ul>
</asp:Content>
Also please tell me how can I add cssclass to the rows of the grid of telerik.
Thanks in Advance...
I am new to telerik MVC. I have a project where I had add Jquery JS file in a page named /jquery.contextMenu.js for showing context menu on right click of the td. And when I am trying to access any function of it, the exception is thrown as "Object does'nt support this property or method " In IE on the line "$("td.showContext"). and "$("td.showContext").contextMenu is not a function" in Mozilla . When I copy the functions from /jquery.contextMenu.js in the page under $(document).ready it shows the context menu properly. Below is the code for it...
Master Page :
<head runat="server">
<title><asp:ContentPlaceHolder ID="TitleContent" runat="server" /></title>
<%= Html.Telerik().StyleSheetRegistrar()
.DefaultGroup(group => group.Add("telerik.common.css")
.Add("telerik.Office2007.css"))
%>
</head>
and also added
<%= Html.Telerik().ScriptRegistrar() %>
at the end of the master page.
Page inherited from master page :
<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
System Types
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<script src="../../Scripts/2010.2.825/jquery-1.4.2.min.js" type="text/javascript"></script>
<script src="../../Scripts/2010.2.825/jquery.contextMenu.js" type="text/javascript"></script>
<script type="text/javascript">
function contextMenuWork(action, el, pos) {
switch (action) {
case "delete":
{
alert("Clicked Delete");
break;
}
case "insert":
{
alert("Clicked insert");
break;
}
case "edit":
{
alert("Clicked edit");
}
}
}
$(document).ready(function () {
$("td.showContext").contextMenu({ menu: 'myMenu' }, function (action, el, pos) { contextMenuWork(action, el, pos); });
});
</script>
<%
Html.Telerik().Grid(Model)
.EnableCustomBinding(true)
.Name("SystemTypeGrid")
.DataKeys(d=>d.Add(c=>c.Id))
.ToolBar(commands => commands.Insert().ButtonType(GridButtonType.ImageAndText).ImageHtmlAttributes(new
{
style =
"margin-left:0"
})
)
.DataBinding(db=>db
.Server()
.Insert("New","SystemType")
.Update("Update","SystemType")
)
.Columns(cols =>
{
cols.Bound(col => col.Id).Hidden(true);
cols.Bound(col => col.Title).Width(200).HtmlAttributes(new { @class = "showContext" });;
cols.Bound(col => col.FinalSoftWare).Title("Final Software").Width(130);
cols.Bound(col => col.Description).Width(300);
cols.Command(commands => commands
.Edit()
);
})
.Sortable()
.Scrollable()
.Editable(e=>e.Mode(GridEditMode.PopUp))
.Selectable()
//.ClientEvents(events => events
// .OnRowSelect("Grid_onRowSelect")
// )
.Render();
%>
<table id="tbl1">
<tr class="row">
<td> Table Row </td>
</tr>
</table>
<ul id="myMenu" class="contextMenu">
<li class="insert"><a href="#insert">Add New</a></li>
<li class="edit"><a href="#edit">Edit</a></li>
<li class="delete"><a href="#delete">Delete</a></li>
</ul>
</asp:Content>
Also please tell me how can I add cssclass to the rows of the grid of telerik.
Thanks in Advance...
3 Answers, 1 is accepted
0
Jigar
Top achievements
Rank 1
Rank 1
answered on 05 Oct 2010, 07:06 AM
Hi Ravi,
Try this
And You may have a look at "http://www.telerik.com/help/aspnet-mvc/getting-started-using-telerik-extensions-for-asp.net-mvc-in-your-project.htmlhelp" page. This will give you a better idea.
Regards,
Jigar.
Try this
<%= Html.Telerik().StyleSheetRegistrar()
.DefaultGroup(group => group.Add("telerik.common.css")
.Add("telerik.vista.css"))
%>
And You may have a look at "http://www.telerik.com/help/aspnet-mvc/getting-started-using-telerik-extensions-for-asp.net-mvc-in-your-project.htmlhelp" page. This will give you a better idea.
Regards,
Jigar.
0
Ravi Keshwani
Top achievements
Rank 1
Rank 1
answered on 05 Oct 2010, 09:52 AM
Dear Jigar,
I Know what you have described in ur post.. The scenario is if I use any other Jquery plugin into my application the js file is loaded but the functions are not accessible.
Please try to create such scenerio you will understand the issue.
Thanks
Ravi
I Know what you have described in ur post.. The scenario is if I use any other Jquery plugin into my application the js file is loaded but the functions are not accessible.
Please try to create such scenerio you will understand the issue.
Thanks
Ravi
0
Anderson
Top achievements
Rank 1
Rank 1
answered on 10 Dec 2010, 01:12 PM
I'm having the same trouble...
the jQuery is working fine, but it can't load the context menu...
if I put the context menu in another place out of the grid, it works fine,
but when I try to put it in a "td", it not work...
the jQuery is working fine, but it can't load the context menu...
if I put the context menu in another place out of the grid, it works fine,
but when I try to put it in a "td", it not work...