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

RadGrid Popup not showing correctly with PopUpSettings-Modal="true"

3 Answers 441 Views

Grid

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

Neha asked on 24 Mar 2011, 10:30 PM

FAQPopUpIssue.JPG

FAQPopUpIssueExpected.JPG

<%@ Page Language="C#" MasterPageFile="~/MasterPage.Master" AutoEventWireup="true"

Codebehind="ManageFAQsNew.aspx.cs" Inherits="TRAC.Connect.WebSite.ManageFAQsNew"

Title="TRAC Connect :: Manage FAQs" %>

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

<%@ Register Src="Caption.ascx" TagName="Caption" TagPrefix="cap" %>

<asp:Content ID="Content1" ContentPlaceHolderID="MasterContentPlaceHolder" runat="server">

<asp:Panel ID="HeightAdjusterPanel" runat="server" Height="660" Width="98%">

<cap:Caption ID="MyCaption" runat="server" CaptionText="Manage FAQs" />

<telerik:RadWindowManager ID="RadWindowManager1" runat="server" EnableShadow="true">

</telerik:RadWindowManager>

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="radGridManageFAQs">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="radGridManageFAQs" LoadingPanelID="RadAjaxLoadingPanel1" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" InitialDelayTime="20"

MinDisplayTime="20">

</telerik:RadAjaxLoadingPanel>

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

<script type="text/javascript">

function PopUpShowing(sender, eventArgs) {

var popUp = eventArgs.get_popUp();

var popUppopUpWidth = popUp.style.width.substr(0, popUp.style.width.indexOf("px"));

var popUppopUpHeight = popUp.style.height.substr(0, popUp.style.height.indexOf("px"));

var windowHeight = (typeof window.innerHeight != 'undefined' ? window.innerHeight : document.body.offsetHeight);

var windowWidth = document.body.offsetWidth;

if (popUppopUpHeight == "") popUppopUpHeight = 300; // if the height isn't set on the popup, default to 300px

popUp.style.position = "fixed";

popUp.style.left = (Math.floor((windowWidth - popUppopUpWidth) / 2)).toString() + "px";

popUp.style.top = (Math.floor((windowHeight - popUppopUpHeight) / 2)).toString() + "px";

}

</script>

</telerik:RadCodeBlock>

<telerik:RadGrid ID="radGridManageFAQs" runat="server" AutoGenerateColumns="False"

PageSize="15" AllowSorting="True" ShowStatusBar="True" AllowMultiRowEdit="true"

OnNeedDataSource="radGridManageFAQs_DataSource">

<MasterTableView CommandItemDisplay="TopAndBottom" TableLayout="Fixed" EditMode="PopUp"

DataKeyNames="FaqId,FaqPosition,Category">

<NoRecordsTemplate>

<div>

There are no records to display

</div>

</NoRecordsTemplate>

<GroupByExpressions>

<telerik:GridGroupByExpression>

<SelectFields>

<telerik:GridGroupByField FieldName="CategoryCode.Description" HeaderText="Category"

FieldAlias="CategoryCode.Description" />

</SelectFields>

<GroupByFields>

<telerik:GridGroupByField FieldName="CategoryCode.ResultPosition" FieldAlias="CategoryCode.ResultPosition" />

<telerik:GridGroupByField FieldName="CategoryCode.Description" FieldAlias="CategoryCode.Description" />

</GroupByFields>

</telerik:GridGroupByExpression>

</GroupByExpressions>

<Columns>

<telerik:GridEditCommandColumn ButtonType="ImageButton" FilterControlAltText="Filter EditCommandColumn column"

EditImageUrl="~/images/Edit.bmp">

<HeaderStyle Width="20px" />

</telerik:GridEditCommandColumn>

<telerik:GridBoundColumn DataField="FaqId" Display="False" HeaderText="Faq Id" UniqueName="FaqId"

FilterControlAltText="Filter FaqId column" />

<telerik:GridBoundColumn DataField="FaqPosition" Display="False" UniqueName="FaqPosition"

HeaderText="Faq Position" FilterControlAltText="Filter FaqPosition column" />

<telerik:GridBoundColumn DataField="CategoryCode.Description" Display="False" UniqueName="Desc"

HeaderText="Category Description" FilterControlAltText="Filter Desc column" />

<telerik:GridBoundColumn DataField="CategoryCode.ResultPosition" Display="False"

HeaderText="Category ResultPosition" UniqueName="ResPos" FilterControlAltText="Filter ResPos column" />

<telerik:GridBoundColumn DataField="Text" HeaderText="FAQ Text" UniqueName="Text"

FilterControlAltText="Filter Text column" Display="false">

<HeaderStyle Width="300px" />

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Category" HeaderText="Category" Display="False"

UniqueName="Category" FilterControlAltText="Filter Category column" />

<telerik:GridBoundColumn DataField="Subject" HeaderText="Subject" UniqueName="Subject"

FilterControlAltText="Filter Subject column">

<HeaderStyle Width="600px" />

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Author" HeaderText="Author" UniqueName="Author"

FilterControlAltText="Filter Author column">

<HeaderStyle Width="50px" />

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="DateCreated" HeaderText="DateCreated" UniqueName="DateCreated"

Display="False" FilterControlAltText="Filter DateCreated column">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="ExpirationDate" HeaderText="Expiration Date"

UniqueName="ExpirationDate" FilterControlAltText="Filter ExpirationDate column">

</telerik:GridBoundColumn>

<telerik:GridButtonColumn ConfirmText="Delete this user?" ConfirmDialogType="RadWindow"

ConfirmTitle="Delete" ButtonType="ImageButton" CommandName="Delete" Text="Delete"

UniqueName="DeleteColumn" FilterControlAltText="Filter DeleteColumn column" ImageUrl="~/images/Delete.bmp">

<HeaderStyle Width="30px" />

</telerik:GridButtonColumn>

</Columns>

<EditFormSettings EditFormType="WebUserControl" UserControlName="FAQEditor.ascx"

PopUpSettings-Modal="true" PopUpSettings-Width="900" InsertCaption="Add New FAQ"

CaptionFormatString="Edit FAQ">

<EditColumn UniqueName="EditCommandColumn1">

</EditColumn>

</EditFormSettings>

<ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column">

</ExpandCollapseColumn>

<RowIndicatorColumn FilterControlAltText="Filter RowIndicator column">

</RowIndicatorColumn>

<CommandItemSettings ExportToPdfText="Export to Pdf" AddNewRecordText="Add New FAQ" />

</MasterTableView>

<FilterMenu EnableImageSprites="False">

</FilterMenu>

<HeaderContextMenu CssClass="GridContextMenu GridContextMenu_Default">

</HeaderContextMenu>

</telerik:RadGrid>

</asp:Panel>

</asp:Content>

Attached sceenshots and code above.

If i remove Grid Client Settings. Popup Box shows correctly but i can't adjust scroll for my grid and grid grouping option.

Let me know what I am doing wrong.

Thanks,

3 Answers, 1 is accepted

answered on 30 Mar 2011, 05:00 PM

<ClientSettings AllowRowsDragDrop="True">

<ClientEvents OnPopUpShowing="PopUpShowing" />

<Scrolling AllowScroll="True" UseStaticHeaders="True" ScrollHeight="510px"/>

<Selecting AllowRowSelect="True" EnableDragToSelectRows="False" />

</ClientSettings>

Hi Maria,

I applied above client settings PopUp edit box appear like FAQPopUpIssue.JPG. I also noticed if i removed <GroupByExpressions>. It works fine. So I suspect <GroupByExpressions> setting.

Let me know if i need to change anything in this.

Neha.