This is a migrated thread and some comments may be shown as answers.

Problem with nested RadGrid in PanelBar

4 Answers 46 Views

General Discussions

This is a migrated thread and some comments may be shown as answers.

Ugeen asked on 14 Mar 2014, 05:48 PM

insertcancelupdate-issue.png

delete-issue.png

Hello,
I'm using Telerik AJAX components. In my project I have PanelBar with User Names as panel items. Each User has assigned Tasks, which are in nested RadGrid.
The first problem is that grid Delete confirm dialog does't show. Instead of it i see blank space inside the PanelBar.
Second issue is concerned with Tasks editing/inserting. These commands are handled by RadWindow opening another aspx page with DetailsView. In that window when clicking Update/Insert/Cancel buttons the window doen't close and instead of it the page reloads. I can debug Javascript functions GetRadWindow() and CancelEdit(), but it doesn't help at all. Pictures of issues are attached.
Here is my code for EditFormCS

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="EditFormCS.aspx.cs" Inherits="ArconCalendar.EditFormCS" %> <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %><br

><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><

br><html xmlns="http://www.w3.org/1999/xhtml"> <head id="Head1" runat="server"> <title>Edit dialog</title></head> <body> <form id="form1" runat="server"> <div style="height: auto; width: 300px"> <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">

<telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager> <telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" DecoratedControls="All" Width="400px" /> <telerik:RadWindowManager ID="window1" runat="server" ReloadOnShow="true" > </telerik:RadWindowManager> <br /> <br /> <asp:DetailsView ID="DetailsView1" DataKeyNames="TaskID" runat="server" AutoGenerateRows="False"

<br>                Height="50px" Width="300px" OnItemCommand="DetailsView1_ItemCommand"  OnItemInserting="DetailsView1_ItemInserting" <

br

>                BorderWidth="0" CellPadding="0" CellSpacing="7" GridLines="None" OnItemUpdating="DetailsView1_ItemUpdating" OnModeChanging="DetailsView1_ModeChanging" ><

br> <Fields> <asp:BoundField DataField="Title" HeaderText="Title" SortExpression="Title" ReadOnly="false"/> <asp:BoundField DataField="ProjectName" HeaderText="ProjectName" SortExpression="ProjectName" ReadOnly="false" /> <asp:TemplateField HeaderText="Assigned Users"> <ItemTemplate> <telerik:RadComboBox runat="server" ID="Users" EnableCheckAllItemsCheckBox="true"

<br>                                CheckBoxes="true" DataTextField="UserName" DataValueField="UserID" OnLoad="Users_Load" ><

br> </telerik:RadComboBox> </ItemTemplate> </asp:TemplateField> <asp:TemplateField HeaderText="Deadline"> <ItemTemplate> <telerik:RadDatePicker EnableViewState="false" MinDate="01/01/1850" MaxDate="01/01/2100" Skin="Telerik" ID="DeadlineDate"<br

>                                DbSelectedDate='<%# DataBinder.Eval(Container.DataItem, "DeadlineDate") %>'<

br> runat="server"> </telerik:RadDatePicker> </ItemTemplate> </asp:TemplateField> <asp:TemplateField HeaderText="Note"> <ItemTemplate> <asp:TextBox ID="Note" runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"Note") %>' TextMode="MultiLine" Width="160px"> </asp:TextBox> </ItemTemplate> </asp:TemplateField> <asp:CheckboxField DataField="IsActive" HeaderText="IsActive" SortExpression="IsActive" ReadOnly="false" /> <asp:CommandField ShowEditButton="True" ButtonType="Button" EditText="Update" /> <asp:CommandField ShowInsertButton="True" ButtonType="Button" InsertText="Insert"/> <asp:CommandField ShowCancelButton="true" ButtonType="Button" CancelText="Cancel" /> </Fields> </asp:DetailsView> </div> </form> </body> </html>

CodeBehind

using System; using System.Collections.Generic; using System.Data; using System.Data.SqlClient; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using Telerik.Web.UI; namespace ArconCalendar {  public partial class EditFormCS : System.Web.UI.Page {  protected override void OnInit(EventArgs e) {  base.OnInit(e);  if (Request.QueryString["taskid"] == null

)<br>            {<br>                DetailsView1.DefaultMode = DetailsViewMode.Insert;<br>            }<br>

else { DetailsView1.DataSource = DB.GetData("Tasks_Select", "@TaskID", Request.QueryString["taskid"

]);<br>                DetailsView1.DefaultMode = DetailsViewMode.Edit;<br>                DetailsView1.DataBind();<br>               <br>            }<br>

this.Page.Title = "Editing record"; }  protected void DetailsView1_ItemCommand(object sender, DetailsViewCommandEventArgs e) {  if (e.CommandName == "Edit") { ClientScript.RegisterStartupScript(Page.GetType(), "mykey", "CloseAndRebind();", true); }  else if (e.CommandName == "Insert") { ClientScript.RegisterStartupScript(Page.GetType(), "mykey", "CloseAndRebind('navigateToInserted');", true); }  else { 

// ClientScript.RegisterStartupScript(Page.GetType(), "mykey", "CancelEdit();", true);<br>            }<br>        }<br><br>        protected void DetailsView1_ItemUpdating(object sender, DetailsViewUpdateEventArgs e)<br>        {<br>            /*<br>            //logic to truncate long string to prevent SQL error<br>            for (int i = 1; i < 4; i++)<br>            {<br>                string val = e.NewValues[i - 1].ToString();<br>                int maxLength = i * 10;<br>                if (val.Length > maxLength) e.NewValues[i - 1] = val.Substring(0, maxLength);<br>            }*/<br><br>            string ids = ConcatUserID();<br><br>            using (var conn = new SqlConnection(DB.connString))<br>            using (var command = new SqlCommand("Tasks_Update", conn) { CommandType = CommandType.StoredProcedure })<br>            {<br>                conn.Open();<br>                SqlDataAdapter da = new SqlDataAdapter(command);<br>                command.Parameters.Add(new SqlParameter("@TaskID", e.Keys[0].ToString()));<br>                command.Parameters.Add(new SqlParameter("@UserIDs",ids ));<br>               <br>                command.Parameters.Add(new SqlParameter("@Title",e.NewValues["Title"]));<br>                command.Parameters.Add(new SqlParameter("@ProjectName", e.NewValues["ProjectName"]));<br><br>                command.Parameters.Add(new SqlParameter("@DeadlineDate", (DetailsView1.FindControl("DeadlineDate") as RadDatePicker).SelectedDate));<br>                command.Parameters.Add(new SqlParameter("@IsActive", e.NewValues["IsActive"]));<br><br>                command.Parameters.Add(new SqlParameter("@Note", (DetailsView1.FindControl("Note") as TextBox).Text));<br>               <br>                command.ExecuteNonQuery();<br><br><br><br><br>            }<br><br><br><br><br>        }<br><br>        private string ConcatUserID()<br>        {<br>            RadComboBox d = (DetailsView1.FindControl("Users") as RadComboBox);<br>            string ids = "";<br>            string separator = ";";<br><br><br>            foreach (RadComboBoxItem item in d.Items)<br>            {<br>                if(item.Checked==true)<br>               ids += item.Value + separator;<br><br>            }<br>            return ids;<br>        }<br><br>        protected void DetailsView1_ItemInserting(object sender, DetailsViewInsertEventArgs e)<br>        {<br>            string ids = ConcatUserID();<br>            using (var conn = new SqlConnection(DB.connString))<br>            using (var command = new SqlCommand("Tasks_Insert", conn) { CommandType = CommandType.StoredProcedure })<br>            {<br>                conn.Open();<br>                SqlDataAdapter da = new SqlDataAdapter(command);<br>               <br>                command.Parameters.Add(new SqlParameter("@UserIDs", ids));<br><br>                command.Parameters.Add(new SqlParameter("@Title", e.Values["Title"]));<br>                command.Parameters.Add(new SqlParameter("@ProjectName", e.Values["ProjectName"]));<br><br>                command.Parameters.Add(new SqlParameter("@DeadlineDate", (DetailsView1.FindControl("DeadlineDate") as RadDatePicker).SelectedDate));<br>                command.Parameters.Add(new SqlParameter("@IsActive", e.Values["IsActive"]));<br><br>                command.Parameters.Add(new SqlParameter("@Note", (DetailsView1.FindControl("Note") as TextBox).Text));<br><br>                command.ExecuteNonQuery();<br><br><br><br><br>            }<br><br>        }<br><br>       <br><br>        protected void Users_Load(object sender, EventArgs e)<br>        {<br>            if (!IsPostBack)<br>            {<br>                RadComboBox rcb = (sender as RadComboBox);<br>                DataTable dt = DB.GetData("UsersToTask_Select");<br>                rcb.DataSource = dt;<br>                rcb.DataBind();<br><br>                <br>                if (DetailsView1.CurrentMode == DetailsViewMode.Edit)<br>                {<br>                    List<Guid> list = (from row in dt.AsEnumerable()<br>                                         where row.Field<Guid?>("TaskID") ==Guid.Parse( DetailsView1.DataKey.Value.ToString())<br>                                         select row.Field<Guid>("UserId")).ToList<Guid>();<br>                    foreach (RadComboBoxItem r in rcb.Items)<br>                    {<br>                        if (list.Contains(Guid.Parse(r.Value))) r.Checked = true;<br>                      <br>                    }<br><br>                }<br>            }<br>        }<br><br>        protected void DetailsView1_ModeChanging(object sender, DetailsViewModeEventArgs e)<br>        {<br>            if (e.CancelingEdit==true)<br>            {<br>               <br>                ClientScript.RegisterStartupScript(Page.GetType(), "mykey", "CancelEdit();", true);<br>            <br>            }<br>            else if (e.NewMode == DetailsViewMode.Edit)<br>            {<br>                ClientScript.RegisterStartupScript(Page.GetType(), "mykey", "CloseAndRebind();", true);<br>            }<br>            else if (e.NewMode == DetailsViewMode.Insert)<br>            {<br>                ClientScript.RegisterStartupScript(Page.GetType(), "mykey", "CloseAndRebind('navigateToInserted');", true);<br>            }<br><br>        }<br><br>        <br><br>       <br>    }<br>}<br>

4 Answers, 1 is accepted

answered on 14 Mar 2014, 06:10 PM

Sorry for awful code view
Codebehind
using System;
using System.Collections.Generic;
using System.Data;
using System.Data.SqlClient;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Telerik.Web.UI;

namespace ArconCalendar
{
public partial class EditFormCS : System.Web.UI.Page
{
protected override void OnInit(EventArgs e)
{
base.OnInit(e);


if (Request.QueryString["taskid"] == null)
{
DetailsView1.DefaultMode = DetailsViewMode.Insert;
}
else
{
DetailsView1.DataSource = DB.GetData("Tasks_Select", "@TaskID", Request.QueryString["taskid"]);
DetailsView1.DefaultMode = DetailsViewMode.Edit;
DetailsView1.DataBind();

}
this.Page.Title = "Editing record";
}

protected void DetailsView1_ItemCommand(object sender, DetailsViewCommandEventArgs e)
{
if (e.CommandName == "Edit")
{

ClientScript.RegisterStartupScript(Page.GetType(), "mykey", "CloseAndRebind();", true);
}
else if (e.CommandName == "Insert")
{
ClientScript.RegisterStartupScript(Page.GetType(), "mykey", "CloseAndRebind('navigateToInserted');", true);
}
else
{
// ClientScript.RegisterStartupScript(Page.GetType(), "mykey", "CancelEdit();", true);
}
}

protected void DetailsView1_ItemUpdating(object sender, DetailsViewUpdateEventArgs e)
{
/*
//logic to truncate long string to prevent SQL error
for (int i = 1; i < 4; i++)
{
string val = e.NewValues[i - 1].ToString();
int maxLength = i * 10;
if (val.Length > maxLength) e.NewValues[i - 1] = val.Substring(0, maxLength);
}*/

string ids = ConcatUserID();

using (var conn = new SqlConnection(DB.connString))
using (var command = new SqlCommand("Tasks_Update", conn) { CommandType = CommandType.StoredProcedure })
{
conn.Open();
SqlDataAdapter da = new SqlDataAdapter(command);
command.Parameters.Add(new SqlParameter("@TaskID", e.Keys[0].ToString()));
command.Parameters.Add(new SqlParameter("@UserIDs",ids ));

command.Parameters.Add(new SqlParameter("@Title",e.NewValues["Title"]));
command.Parameters.Add(new SqlParameter("@ProjectName", e.NewValues["ProjectName"]));

command.Parameters.Add(new SqlParameter("@DeadlineDate", (DetailsView1.FindControl("DeadlineDate") as RadDatePicker).SelectedDate));
command.Parameters.Add(new SqlParameter("@IsActive", e.NewValues["IsActive"]));

command.Parameters.Add(new SqlParameter("@Note", (DetailsView1.FindControl("Note") as TextBox).Text));

command.ExecuteNonQuery();

}

}

private string ConcatUserID()
{
RadComboBox d = (DetailsView1.FindControl("Users") as RadComboBox);
string ids = "";
string separator = ";";

foreach (RadComboBoxItem item in d.Items)
{
if(item.Checked==true)
ids += item.Value + separator;

}
return ids;
}

protected void DetailsView1_ItemInserting(object sender, DetailsViewInsertEventArgs e)
{
string ids = ConcatUserID();
using (var conn = new SqlConnection(DB.connString))
using (var command = new SqlCommand("Tasks_Insert", conn) { CommandType = CommandType.StoredProcedure })
{
conn.Open();
SqlDataAdapter da = new SqlDataAdapter(command);

command.Parameters.Add(new SqlParameter("@UserIDs", ids));

command.Parameters.Add(new SqlParameter("@Title", e.Values["Title"]));
command.Parameters.Add(new SqlParameter("@ProjectName", e.Values["ProjectName"]));

command.Parameters.Add(new SqlParameter("@DeadlineDate", (DetailsView1.FindControl("DeadlineDate") as RadDatePicker).SelectedDate));
command.Parameters.Add(new SqlParameter("@IsActive", e.Values["IsActive"]));

command.Parameters.Add(new SqlParameter("@Note", (DetailsView1.FindControl("Note") as TextBox).Text));

command.ExecuteNonQuery();

}

}

protected void Users_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
RadComboBox rcb = (sender as RadComboBox);
DataTable dt = DB.GetData("UsersToTask_Select");
rcb.DataSource = dt.AsDataView().ToTable(true, "UserId", "UserName");
rcb.DataBind();


if (DetailsView1.CurrentMode == DetailsViewMode.Edit)
{
List<Guid> list = (from row in dt.AsEnumerable()
where row.Field<Guid?>("TaskID") ==Guid.Parse( DetailsView1.DataKey.Value.ToString())
select row.Field<Guid>("UserId")).ToList<Guid>();
foreach (RadComboBoxItem r in rcb.Items)
{
if (list.Contains(Guid.Parse(r.Value))) r.Checked = true;

}

}
}
}

protected void DetailsView1_ModeChanging(object sender, DetailsViewModeEventArgs e)
{
if (e.CancelingEdit==true)
{

ClientScript.RegisterStartupScript(Page.GetType(), "mykey", "CancelEdit();", true);

}
else if (e.NewMode == DetailsViewMode.Edit)
{
ClientScript.RegisterStartupScript(Page.GetType(), "mykey", "CloseAndRebind();", true);
}
else if (e.NewMode == DetailsViewMode.Insert)
{
ClientScript.RegisterStartupScript(Page.GetType(), "mykey", "CloseAndRebind('navigateToInserted');", true);
}

}

}
}

answered on 20 Mar 2014, 02:08 PM

And .aspx code. Please, help me!
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="EditFormCS.aspx.cs" Inherits="ArconCalendar.EditFormCS" %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!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>Edit dialog</title></head>
<body> <form id="form1" runat="server">
<div style="height: auto; width: 300px">
<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
<script type="text/javascript">
function CloseAndRebind(args)
{ GetRadWindow().BrowserWindow.refreshGrid(args); GetRadWindow().close(); }
function GetRadWindow() {
var oWindow = null; if (window.radWindow) oWindow = window.radWindow; //Will work in Moz in all cases, including clasic dialog
else if (window.frameElement.radWindow) oWindow = window.frameElement.radWindow; //IE (and Moz as well)

return oWindow;
}
function CancelEdit() {
var oWindow = GetRadWindow();
oWindow._windowManager.CloseAll();
oWindow.arguments = null;
oWindow.close(null);

return false;
}

</script>
</telerik:RadCodeBlock>
<telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager>
<telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" DecoratedControls="All" Width="400px" />
<telerik:RadWindowManager ID="window1" runat="server" ReloadOnShow="true" > </telerik:RadWindowManager>
 
 
<asp:DetailsView ID="DetailsView1" DataKeyNames="TaskID" runat="server" AutoGenerateRows="False"
Height="50px" Width="300px" OnItemCommand="DetailsView1_ItemCommand" OnItemInserting="DetailsView1_ItemInserting"
BorderWidth="0" CellPadding="0" CellSpacing="7" GridLines="None" OnItemUpdating="DetailsView1_ItemUpdating" OnModeChanging="DetailsView1_ModeChanging" >
<Fields>
<asp:BoundField DataField="Title" HeaderText="Title" SortExpression="Title" ReadOnly="false"/>
<asp:BoundField DataField="ProjectName" HeaderText="ProjectName" SortExpression="ProjectName" ReadOnly="false" />
<asp:TemplateField HeaderText="Assigned Users">
<ItemTemplate>
<telerik:RadComboBox runat="server" ID="Users" EnableCheckAllItemsCheckBox="true"
CheckBoxes="true" DataTextField="UserName" DataValueField="UserID" OnLoad="Users_Load" >

</telerik:RadComboBox>

</ItemTemplate>
</asp:TemplateField>

<asp:TemplateField HeaderText="Deadline">

<ItemTemplate>
<telerik:RadDateTimePicker EnableViewState="false" MinDate="01/01/1850"
MaxDate="01/01/2100" Skin="Telerik" ID="DeadlineDate"
DbSelectedDate='<%# DataBinder.Eval(Container.DataItem, "DeadlineDate") %>'
runat="server">
</telerik:RadDateTimePicker>

</ItemTemplate>

</asp:TemplateField>


<asp:TemplateField HeaderText="Note">
<ItemTemplate>
<asp:TextBox ID="Note" runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"Note") %>' TextMode="MultiLine" Width="160px">
</asp:TextBox>
</ItemTemplate>
</asp:TemplateField>

<asp:TemplateField HeaderText="History">
<ItemTemplate>
<asp:TextBox ID="History" runat="server" Text='<%#DataBinder.Eval(Container.DataItem,"Message") %>' ReadOnly="true" TextMode="MultiLine" Width="160px">
</asp:TextBox>
</ItemTemplate>
</asp:TemplateField>

<asp:CheckboxField DataField="IsActive" HeaderText="IsActive" SortExpression="IsActive" ReadOnly="false" />

<asp:CommandField ShowEditButton="True" ButtonType="Button" EditText="Update" />
<asp:CommandField ShowInsertButton="True" ButtonType="Button" InsertText="Insert"/>
<asp:CommandField ShowCancelButton="true" ButtonType="Button" CancelText="Cancel" />

</Fields>

</asp:DetailsView>

</div>

</form>

</body>

</html>

answered on 25 Mar 2014, 09:49 AM

Hello Ugeen,

I have carefully revised the provided code but am unable to pin-point what is causing the problematic behavior. In general a problem using a popup window may occur in scenarios where a JavaScript error is present on the page. Could you ensure that this is not the case?

Note that it would be best to try and assemble a sample project which we can locally debug. That would greatly facilitate us in resolving the matter more quickly. If this is not possible please share with us the markup and code-behind of the grid page so we could further research the issue.

Regards,
Angel Petrov
Telerik

Build cross-platform mobile apps using Visual Studio and .NET. Register for the online webinar on 03/27/2014, 11:00AM US ET.. Seats are limited.

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

Problem with nested RadGrid in PanelBar

4 Answers, 1 is accepted