Modalpopup and print: ModalPopUp comments, suggestions, issues

The biggest frustration is the mere fact that you can define actions on the target link buttons event - but the modalpopup ignores any such actions. The modalpopup shouldn't be activated until AFTER whatever actions in the button or event that causes the ModalPopup to invoke...

This scenario will be possible with the next release of the Toolkit (and is possible today in the development releases) thanks to the addition of DynamicPopup functionality into ModalPopup. If you have a chance to try a development release, please let us know if you have any problems!

PS - For a bit on the client/server nature of the buttons, please see this post of mine:http://forums.asp.net/ShowPost.aspx?PostID=1379165

Thanks for the reply - I'll see what the latest build has...

I am really not concerned about the button actions once the modal is loaded... its the events that should fire after the wired modal TargetControlID is clicked but before when the actual modal is displayed.... As of the July CTP - at least - I'll see what the dynamic one does - obviously new bits as I have checked out the codeplex site and didn't find anything that addressed the issue this past weekend...

Thanks again

I did take a look at it - however - the only concievable implementation is wrapping it within the modal popup... I

1. do not want to create a webservice to update something - I want to be able to dynaically populate the ModalPopUp with values already there without the ModulPopUp knowing what control needs to be loaded.

2. I do not want to create a webservice to 'supposedly' update a dynamically loaded control.

Guess maybe I should wait for examples, but what I expect at least with the ModalPopUp control is the same thing I expect from a regular panel. The ability to dynamically add in to any placholder the panel has any control I deem necessary... becuase I can control it ...when I unhide a panel - I have access to populate any placeholder with whatever I desire within that panel... the dynamical control extender still relies upon a fixed control being declared ... and without any examples - I do not see how it would enable the loading of a dynamic control within a Modal.....

The bigger problem I am having is that when a Modal Control is placed onto one of my webcontrols - it nulls all other postbacks so that they are never recieved and processed. For example:

this code works (without the modal and handles all of the postbacks on the gridview:

<%@. Control Language="c#" %>

<%@. Register Assembly="AtlasControlToolkit" Namespace="AtlasControlToolkit" TagPrefix="atlasToolkit" %>

<atlas:ScriptManager id="SM" runat="server" EnableScriptComponents="True" EnablePartialRendering="true"></atlas:ScriptManager>

var _oldColor;

function SetNewColor(source)

{ _oldColor = source.style.backgroundColor;

source.style.backgroundColor = '#00ff00';}

function SetOldColor(source)

{ source.style.backgroundColor = _oldColor; }

var showPopupHandler = null;

function showModalPopup(pageRequestManagerID, popupID)

{

var pageRequestManager = $object(pageRequestManagerID);

if (pageRequestManager)

{

var onUpdatePanelPropertyChanged = function(sender, eventArgs)

{

if ((eventArgs.get_propertyName() == "inPostBack") &&

!pageRequestManager.get_inPostBack())

{

var modal = $object(popupID);

if (modal)

modal._show();

pageRequestManager.propertyChanged.remove(showPopupHandler);

showPopupHandler = null;

}

};

showPopupHandler = Function.createDelegate(this, onUpdatePanelPropertyChanged);

pageRequestManager.propertyChanged.add(showPopupHandler);

}

</script>

<h1>Section Configuration Console</h1>

<br />

<asp:Button ID="btnCheckAll" Text="Select All" runat="server" /><asp:Button ID="btnUnCheckAll" Text= "Unselect All" runat="server" />

Select:

<asp:DropDownList id="dropModeTypes" AutoPostBack="True" Runat="Server" >

</asp:DropDownList>

Display:

<asp:DropDownList id="dropShowOnly" AutoPostBack="True" Runat="Server" >

<asp:ListItem Text="Named Page ID" Value="0" />

<asp:ListItem Text="Grouping" Value="2" />

<asp:ListItem Text="Community" Value="3" />

</asp:DropDownList>

Display

<asp:DropDownList id="DropDownList2" AutoPostBack="True" Runat="Server" >

<asp:ListItem Text="Named Page ID" Value="0" />

<asp:ListItem Text="Grouping" Value="2" />

<asp:ListItem Text="Community" Value="3" />

</asp:DropDownList>

<asp:Panel ID="pnlSectionList" Visible="true" runat="server" >

<asp:GridView id="grdData" Width="100%" AutoGenerateColumns="false" AllowPaging="True"

BorderColor="#999999" BorderStyle='None' BorderWidth='1px' DataKeyNames='section_ID'

BackColor="White" CellPadding="3" GridLines="Vertical" runat="server" EmptyDataText='""'>

<asp:TemplateField ItemStyle-Width="8px"><ItemTemplate>

<asp:CheckBox id="chkSelect" runat="server" /></ItemTemplate></asp:TemplateField>

<asp:TemplateField ItemStyle-Width="8px">

<ItemTemplate> <center><asp:ImageButton id="btnHome" CommandName="Home" CommandArgument ='<%# DataBinder.Eval( Container, "DataItem.section_ID" )%>'

Runat="Server"></asp:ImageButton></center>

</ItemTemplate>

</asp:TemplateField>

<asp:TemplateField ItemStyle-Width="8px">

<asp:ImageButton id="btnDelete" CommandName="Delete" CommandArgument='<%# DataBinder.Eval( Container, "DataItem.section_ID" )%>'

Runat="Server"></asp:ImageButton></center>

</ItemTemplate>

</asp:TemplateField>

<asp:TemplateField ItemStyle-Width="15px">

<asp:ImageButton id="btnUp" CommandName="Up" CommandArgument='<%# DataBinder.Eval( Container, "DataItem.section_ID" )%>'

Runat="Server" />

<asp:ImageButton id="btnDown" CommandName="Down" CommandArgument='<%# DataBinder.Eval( Container, "DataItem.section_ID" )%>'

Runat="Server"></asp:ImageButton></center>

</ItemTemplate>

</asp:TemplateField>

<asp:TemplateField ItemStyle-Width="8px">

<asp:ImageButton ID="btnEdit" AlternateText="" CommandName="Select" CommandArgument='<%# DataBinder.Eval( Container, "DataItem.section_ID" )%>' runat="Server" />

</ItemTemplate>

</asp:TemplateField>

<asp:BoundField ItemStyle-Width="80px" HeaderText="Name" DataField="section_name" />

<asp:BoundField ItemStyle-Width="80px" HeaderText="Title" DataField="section_title" />

<asp:BoundField ItemStyle-Width="80px" HeaderText="Menu Title" DataField="section_menuTitle" />

<asp:BoundField ItemStyle-Width="8px" HeaderText="Type" DataField="section_pagetype" />

<asp:BoundField ItemStyle-Width="8px" HeaderText="Sub" DataField="ChildCount" />

</Columns>

</asp:GridView>

</asp:Panel>

<br />

<asp:Label id="message" Text="No entry Selected." runat="server" />

<asp:Panel ID="detailedView" runat="server" >

</tr></table></asp:Panel>

<br />

<asp:Button ID = "btnAddNew" runat="server" Text="Add New Entry" /><asp:Button ID="btnDelChecked" runat="server" Text="Delete Checked" /><asp:Button ID="btnCancel" runat="server" Text="Exit" />

**************

Soon as this is added:
**************

<asp:Panel ID="Popup" runat="server" CssClass="modalPopup" style='display: none'>

<asp:PlaceHolder ID="ctlLoad" Visible="true" runat="server" />

<asp:Button ID="OK" runat="Server" Text="OK" />

<asp:Button ID="Cancel" runat="Server" Text="Cancel" />

</asp:Panel>

<asp:Button ID="Target" runat="server" style='display: none' />

<atlasToolkit:ModalPopupExtender ID="MyModalExtender" runat="server">

<atlasToolkit:ModalPopupProperties

ID="MyPopup"

TargetControlID="Target"

PopupControlID="Popup"

BackgroundCssClass="modalBackground"

DropShadow="true"

OkControlID="Ok"

CancelControlID="Cancel" />

</atlasToolkit:ModalPopupExtender>

All postback handling diverted. I see a tons of axd requests coming across but never makes it to my postbackhandler in my control...

Control Code:

using System;

using System.Diagnostics;

using System.Collections;

using System.Collections.Generic;

using System.ComponentModel;

using System.Data;

using System.Drawing;

using System.Web;

using System.Web.SessionState;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.HtmlControls;

using Cavalia.SkinHandler;

using Cavalia.Enums;

namespace Cavalia.Admin

{

public class EditSectionsDefault : SkinnedCommunityControl, IPostBackEventHandler

{

protected GridView grdData;

protected DropDownList dropShowOnly;

protected Label message;

protected Panel detailedView;

protected Label editSection;

protected Label AddChildSection;

protected Label SectionImport;

protected HtmlGenericControl myframe;

protected DropDownList dropModeTypes;

protected CheckBox chkSelect; //used to do group selection for commands

protected Button btnCheckAll;

protected Button btnUnCheckAll;

string _skinFileName = "/admin/section_mainmenu.ascx";

override protected string SkinType

{

get { return "ControlSkins"; }

}

#region Init Skin

override protected void InitializeSkin(Control skin)

{

myframe = (HtmlGenericControl)GetControl(skin, "myframe");

detailedView = (Panel)GetControl(skin, "detailedView");

message = (Label)GetControl(skin, "message");

editSection = (Label)GetControl(skin, "editSection");

AddChildSection = (Label)GetControl(skin, "AddChildSection");

SectionImport = (Label)GetControl(skin, "SectionImport");

btnCheckAll = (Button)GetControl(skin, "btnCheckAll");

btnUnCheckAll = (Button)GetControl(skin, "btnUnCheckAll");

this.btnCheckAll.Click += new System.EventHandler(this.btnCheckAll_Click);

this.btnUnCheckAll.Click += new System.EventHandler(this.btnUnCheckAll_Click);

grdData = (GridView)GetControl(skin, "grdData");

dropModeTypes = (DropDownList)GetControl(skin, "dropModeTypes");

dropModeTypes.SelectedIndexChanged += new EventHandler(dropModeTypes_SelectedIndexChanged);

dropShowOnly = (DropDownList)GetControl(skin, "dropShowOnly");

this.dropShowOnly.SelectedIndexChanged += new EventHandler(dropShowOnly_SelectedIndexChanged);

this.grdData.RowCommand += new GridViewCommandEventHandler(this.grdData_RowCommand);

this.grdData.SelectedIndexChanged += new EventHandler(grdData_SelectedIndexChanged);

this.grdData.SelectedIndexChanging += new GridViewSelectEventHandler(grdData_SelectedIndexChanging);

this.grdData.PageIndexChanged += new EventHandler(grdData_PageIndexChanged);

this.grdData.PageIndexChanging += new GridViewPageEventHandler(grdData_PageIndexChanging);

this.grdData.RowDataBound += new GridViewRowEventHandler(grdData_RowDataBound);

InitializeComponent();

}

#endregion

//Do Select and De-Select

void btnCheckAll_Click(object sender, EventArgs e)

{

foreach (GridViewRow i in grdData.Rows)

{

CheckBox chkSelect = (CheckBox)i.FindControl("chkSelect");

chkSelect.Checked = true;

}

void btnUnCheckAll_Click(object sender, EventArgs e)

{

foreach (GridViewRow i in grdData.Rows)

{

CheckBox chkSelect = (CheckBox)i.FindControl("chkSelect");

chkSelect.Checked = false;

}

void btnDelChecked_Click(object sender, EventArgs e)

{

//Do Delete Checked Items here...

}

void btnCancel_Click(object sender, EventArgs e)

{

HttpContext.Current.Response.Redirect(bllSection.GetSectionPath(objSectionInfo.MenuType, bllSection.DefaultSectionID(objSectionInfo.MenuType)));

}

void btnAddNew_Click(object sender, EventArgs e)

{

HttpContext.Current.Response.Redirect(bllSection.CalculateReturnPath() + (String.Format("/EditNamedPage.aspx?mode={0}", dropModeTypes.SelectedValue.ToString())));

}

void dropModeTypes_SelectedIndexChanged(object sender, EventArgs e)

{

BindData();

}

private void InitializeComponent()

{

EnsureChildControls();

// Put user code to initialize the page here

if (!Page.IsPostBack)

{

//Bind GroupNames for the ShowOnly Dropdown

dropShowOnly.DataSource = dalSection.PageTypesGetGroups();

dropShowOnly.DataTextField = "group_MenuName";

dropShowOnly.DataValueField = "group_ID";

dropShowOnly.DataBind();

// Assign default value

dropShowOnly.Items[0].Selected = true;

dropModeTypes.DataSource = ModeTypeUtility.GetModeTypes();

dropModeTypes.DataTextField = "MenuType";

dropModeTypes.DataValueField = "MenuType";

dropModeTypes.DataBind();

dropModeTypes.Items.Add(new ListItem("Sections", "Sections"));

dropModeTypes.Items[0].Selected = true;

//Bind GridView

BindData();

}

protected void OrderChanged(Object s, EventArgs e)

{

BindData();

}

protected void grdData_PageIndexChanged(Object s, GridViewPageEventArgs e)

{

grdData.PageIndex = e.NewPageIndex;

BindData();

}

void BindData()

{

grdData.DataSource = dalSection.GetAllSectionsForAdmin(dropModeTypes.SelectedValue.ToString());

grdData.DataBind();

}

void dropShowOnly_SelectedIndexChanged(object sender, EventArgs e)

{

BindData();

}

void grdData_RowDataBound(object sender, GridViewRowEventArgs e)

{

if (e.Row.RowType == DataControlRowType.DataRow)

{

e.Row.Attributes.Add("onMouseOver", "SetNewColor(this);");

e.Row.Attributes.Add("onMouseOut", "SetOldColor(this);");

e.Row.Attributes.Add("onDblClick", Page.ClientScript.GetPostBackEventReference(this, e.Row.RowIndex.ToString()));

e.Row.Attributes.Add("onKeyDown", "if( event.keyCode == 13 ) " + Page.ClientScript.GetPostBackEventReference(this, "KEYDOWN" + "$" + e.Row.DataItemIndex.ToString()));

SectionInfo objSectionInfo = (SectionInfo)HttpContext.Current.Items["SectionInfo"];

int sectionID = (int)DataBinder.Eval(e.Row.DataItem, "section_ID");

// don't display delete link for sections with children or system sections

int childCount = (int)DataBinder.Eval(e.Row.DataItem, "ChildCount");

bool system = (bool)DataBinder.Eval(e.Row.DataItem, "section_isSystem");

string sectionName = (string)DataBinder.Eval(e.Row.DataItem, "section_name");

ImageButton btnDelete = (ImageButton)e.Row.FindControl("btnDelete");

btnDelete.CommandArgument = sectionID.ToString();

if (childCount > 0 || system)

{

btnDelete.CommandName = "NotAvailable";

btnDelete.ImageUrl = ResolveUrl("~/Communities/" + objSectionInfo.Skin + "/Images/spacer.gif");

}

else

{

btnDelete.CommandArgument = sectionID.ToString();

btnDelete.ImageUrl = ResolveUrl("~/Communities/" + objSectionInfo.Skin + "/Images/Admin/delete.gif");

btnDelete.Attributes.Add("onclick", String.Format("return confirm('Are you sure you want to delete the \"{0}\" section?')", sectionName));

}

// Show proper home image

ImageButton btnHome = (ImageButton)e.Row.FindControl("btnHome");

if (btnHome != null)

{

int parentID = (int)DataBinder.Eval(e.Row.DataItem, "section_parentID");

if (parentID == -1)

{

btnHome.CommandArgument = sectionID.ToString();

// btnHome.OnClientClick = "Row_Click";

btnHome.ImageUrl = ResolveUrl("~/Communities/" + objSectionInfo.Skin + "/Images/Admin/home.gif");

}

else

{

btnHome.ImageUrl = ResolveUrl("~/Communities/" + objSectionInfo.Skin + "/Images/Admin/Home_Ghost.gif");

}

ImageButton btnEdit = (ImageButton)e.Row.FindControl("btnEdit");

btnEdit.ImageUrl = ResolveUrl("~/Communities/" + objSectionInfo.Skin + "/Images/Admin/edit.gif");

btnEdit.Attributes.Add("onClick", Page.ClientScript.GetPostBackEventReference(this, e.Row.DataItemIndex.ToString()));

//btnEdit.PostBackUrl = ResolveUrl("~/Section_Basic.aspx?id=" + sectionID);

//btnEdit.CommandArgument = sectionID.ToString();

//btnEdit.OnClientClick = "Row_Click";

//btnEdit.NavigateUrl = "/admin/Section_Basic.aspx?id="+sectionID;

//btnEdit.Target = "embeddedFrame";

ImageButton btnUp = (ImageButton)e.Row.FindControl("btnUp");

ImageButton btnDown = (ImageButton)e.Row.FindControl("btnDown");

// Remove sort buttons for system sections

if (system)

{

btnDown.CommandName = "NotAvailable";

btnUp.CommandName = "NotAvailable";

btnDown.ImageUrl = ResolveUrl("~/Communities/" + objSectionInfo.Skin + "/Images/spacer.gif");

btnUp.ImageUrl = ResolveUrl("~/Communities/" + objSectionInfo.Skin + "/Images/spacer.gif");

}

else

{

btnUp.ImageUrl = ResolveUrl("~/Communities/" + objSectionInfo.Skin + "/Images/Admin/up.gif");

btnDown.ImageUrl = ResolveUrl("~/Communities/" + objSectionInfo.Skin + "/Images/Admin/Dn.gif");

}

void grdData_PageIndexChanging(object sender, GridViewPageEventArgs e)

{

}

void grdData_PageIndexChanged(object sender, EventArgs e)

{

}

void grdData_SelectedIndexChanging(object sender, GridViewSelectEventArgs e)

{

Control uc = (Control)Activator.CreateInstance(System.Web.Compilation.BuildManager.GetType("Cavalia.Admin.EditSections.SectionBasic", true));

myframe.Controls.Add(uc);

}

void grdData_SelectedIndexChanged(object sender, EventArgs e)

{

}

protected void grdData_RowCommand(object sender, GridViewCommandEventArgs e)

{

if (e.CommandName == "Select")

{

//int index = grdData.SelectedIndex;

bllLogging.RecordMessage("Made it RowCommand with=" + e.CommandArgument.ToString(), "grdDataing", Severity.Severe, "SectionMenu", "Bummer");

//GridViewRow selectedRow = grdData.SelectedRow;

int sectionID = Convert.ToInt32(e.CommandArgument);

//string sectionID = ( row.Cells[1].Text);

//int sectionID = (int)grdData.SelectedDataKey.Value;

// UpdateForm.Visible = true;

// Control uc = (Control)Page.LoadControl("basic.ascx");

// UpdateForm.Controls.Add(uc);

message.Text = "You selected record #" + sectionID +"<br />";

detailedView.Visible = true;

editSection.Text = "<a href=\"section_basic.aspx?id=" + sectionID + "&MODE="+dropModeTypes.SelectedValue.ToString()+"\" target=\"embeddedFrame\">Edit this Record </a>";

AddChildSection.Text = "<a href=\"addsection.aspx?pid=" + sectionID + "&MODE=" + dropModeTypes.SelectedValue.ToString() + "\" target=\"embeddedFrame\">Add Sub-Section </a>";

SectionImport.Text = "<a href=\"importdata.aspx?id=" + sectionID + "&MODE=" + dropModeTypes.SelectedValue.ToString() + "\" target=\"embeddedFrame\">Import Data </a>";

}

public void RaisePostBackEvent(string eventArgument)

{

GridViewSelectEventArgs e = null;

GridViewRowEventHandler f = null;

int selectedRowIndex = -1;

bllLogging.RecordMessage("Made it RaisePostBackEvent with=" + eventArgument.ToString(), "grdDataing", Severity.Severe, "SectionMenu", "Bummer");

if (!string.IsNullOrEmpty(eventArgument))

{

string[] args = eventArgument.Split('$');

if (string.Compare(args[0], "KEYDOWN", false, System.Globalization.CultureInfo.InvariantCulture) == 0 && args.Length > 1)

{

Int32.TryParse(args[1], out selectedRowIndex);

e = new GridViewSelectEventArgs(selectedRowIndex);

message.Text = selectedRowIndex.ToString();

OnReturnKeyDown(e);

}

else if (string.Compare(args[0], "Select", false, System.Globalization.CultureInfo.InvariantCulture) == 0 && args.Length > 1)

{

Int32.TryParse(args[0], out selectedRowIndex);

//SelectedIndex = ((GridViewSelectEventArgs)e).NewSelectedIndex;

// f = new GridViewRowEventHandler(selectedRowIndex);

message.Text = "You selected " + selectedRowIndex.ToString();

}

else

{

Int32.TryParse(args[0], out selectedRowIndex);

e = new GridViewSelectEventArgs(selectedRowIndex);

// myframe.Attributes["src"] = "~/EditSectionsBasic.aspx?id=" + selectedRowIndex.ToString();

grdData_SelectedIndexChanging(this, e);

}

protected virtual void OnDblClick(EventArgs e)

{

message.Text = ("You double clicked on the row with index: " + ((GridViewSelectEventArgs)e).NewSelectedIndex.ToString());

//SelectedIndex = ((GridViewSelectEventArgs)e).NewSelectedIndex;

grdData.EditIndex = ((GridViewSelectEventArgs)e).NewSelectedIndex;

}

protected virtual void OnReturnKeyDown(EventArgs e)

{

message.Text = ("You press enter on the row with index: " + ((GridViewSelectEventArgs)e).NewSelectedIndex.ToString());

}

public EditSectionsDefault()

: base()

{

if (SkinFileName == null)

SkinFileName = _skinFileName;

}

******************************

This should not be expected behavior?

I do get the the postbacks back in the code above:

Without the ModalExtender Control and Gridview postbacks do trigger properly source looks as such:

...

onclick="__doPostBack('ctl00$ctl00','0');WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("ctl00$ctl00$ctl00$grdData$ctl02$btnEdit", "", true, "", "", false, false))"style="border-width:0px;"/>

With the Modal Control placed (in accordance with all the recent sample code) the same code now generates this:

...onclick="__doPostBack('ctl00$ctl00','0');"style="border-width:0px;"/>
 
 
So that means all the args are stripped and my IPostBackHandler doesn't know what to do...

No, the addition of a ModalPopup shouldn't break the postback functionality of other controls on the page. Early implementations did this, but those problems were fixed long ago, I thought. Would it be possible to refine your sample further so that it's as simple and self-contained as possible while still demonstrating the problem? (Extra stuff often gets in the way of an investigation.)

Its not a simple scenario in terms of code but I will break it down:

skinnedcommunity control generates all the page logic (works like a master page)

The ascx page has nothing but a few buttons and a gridview.

The control that loads the ascx page - adds Postback references to the edit, delete...etc image buttons.

Ex:

Databound event

ImageButton btnEdit = (ImageButton)e.Row.FindControl("btnEdit");

btnEdit.ImageUrl = ResolveUrl("~/Communities/" + objSectionInfo.Skin +"/Images/Admin/edit.gif");

btnEdit.Attributes.Add("onClick", Page.ClientScript.GetPostBackEventReference(this, e.Row.DataItemIndex.ToString()));

Without the modal control added to the ascx (and note I have tried this with adding the modal functionality in the code as well same reults) the postbacks work fine and do what they are intended to do:

publicvoid RaisePostBackEvent(string eventArgument)

{

Page.ClientScript.GetPostBackEventReference(this,String.Empty);

GridViewSelectEventArgs e =null;

GridViewRowEventHandler f =null;

int selectedRowIndex = -1;

bllLogging.RecordMessage("Made it RaisePostBackEvent with=" + eventArgument.ToString(),"grdDataing",Severity.Severe,"SectionMenu","Bummer");

if (!string.IsNullOrEmpty(eventArgument))

{

string[] args = eventArgument.Split('$');

bllLogging.RecordMessage("RaisePostBackEvent args[0]" + args[0].ToString() +"args[0]" + args[1].ToString(),"grdDataing",Severity.Severe,"SectionMenu","Bummer");

That works...

With modal added:

the only value I get is the eventArgument which is the id of the data record... no additional args such as the command name (as demonstrated by the html page source).

It has nothing to do with the script added to the ascx - as - as long as the modal is not added - the page works as intended and I can do post processing on the postback...

Hopefully that is a little bit simpler - and I am using yesterday's build of the Toolkit...But I have had this problem starting with the July CTP.

Delving into this further becuase I need to get this wrapped up and solved as In really need to get my Community Starter Kit that I converted to 2.0 up and running:

Page that works without MODALEXTENDER Default Page Load

onclick="__doPostBack('ctl00$ctl00','1');"style="border-width:0px;"/>

AFTER Postback

...onclick="__doPostBack('ctl00$ctl00','2');WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("ctl00$ctl00$ctl00$grdData$ctl04$btnEdit", "", true, "", "", false, false))"style="border-width:0px;"/>

NON-WORKING with MODALEXTENDER (Same code as above example - but incorporates a MODALEXTENDER wrapped in a UPDATEPANEL)

NOTE: In order to pass the CammandArgument and the Select ID - I had to incorporate this:

void GridView_RowDataBound(Object s,GridViewRowEventArgs e)

{

if (e.Row.RowType ==DataControlRowType.DataRow)

...[Additional Logic] ...

ImageButton btnEdit = (ImageButton)e.Row.FindControl("btnEdit");

string js = Page.ClientScript.GetPostBackEventReference(this,"Edit${0}");

js =String.Format(js, e.Row.DataItemIndex.ToString());

btnEdit.Attributes["onclick"] = js;

Default PAGE Load

onclick="__doPostBack('ctl00$ctl00','Edit$2');"style="border-width:0px;"/>

 AFTER Postback

onclick="__doPostBack('ctl00$ctl00','Edit$1');"style="border-width:0px;"/>
 
 
In other words - it never appends the rest of the ::
 
WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("ctl00$ctl00$ctl00$grdData$ctl04$btnEdit", "", true, "", "", false, false))"
 
 
as seen in the version that works without the MODALPOPUPEXTENDER...
 
 
 
So - I can grab the event args now - and goto the routine for the SHOWMODAL() (Ted's sample code from Yesterday - that works when tied to a button outside the gridview)..
 
 
But the ShowModal fires only to create a 'Assertion Failed - error (something about incomplete url and domain error)
 
 
So - thats about all the info I have digging into it further - unfortunately since I am not working with a web project for the main app code and compile my code outside of the web project - kinda hard to hook up the debugger
 
 
Is there something I am missing on the pre-init that needs to be called to set up the modal properly?

It sounds like you're adding a ModalPopup and an UpdatePanel together. Can you try just adding the ModalPopup? That alone shouldn't break stuff. UpdatePanel, on the other hand, may need to futz with stuff on the page and may introduce weirdness. So let's try ModalPopup by itself...

If I do not have the Update Panel then I lose the ability to actually render the postback - gives a undefined error... Additionally - any buttons I did have that invoked the ModalExtender - resets the gridview to blank, and no modal ever displays...

I grabbed Fiddler and noted that even though - I have compression OFF - that all of the axd files are being gzipped compressed.. maybe that is the source of the problem. I had thought removing the compression module from IIS would of been the end all of end alls as I had a problem early on with axds appearing in an non AJAX / ATLAS gridview - which wouldn't allow postbacks - so - removed the compression module and everything worked ... but apparently the axd files are being compressed even though its evident nothing else else...

I imagine that may be part of the problem....

Double-checked...

Commented out the compression handler for the webresources - same deal.

Verified my handler was passing off the requests by removing the mappings for all axd:

<removeverb="*"path="*.axd" />

<addverb="*"path="WebResource.axd"type="System.Web.Handlers.AssemblyResourceLoader"validate="True"/>

Verified I had all the multiquest, scriptmanager, etc mappings in the web.config...

Same issue - doesn't generate the webform postback on a postback...

Additionally - cleaned the solution and rebuilt it, cleared caches, etc...basically attempting from every angle to troubleshoot whether or not the axd is being processed...based on reading some 300 pages of blogs, tech articles, and the likes...

Long week trying to track down the issue with the ModalPopup and I am sure it will apply to alot of issues others may have with the July CTP at least:

Overview of the problem: Loading a dynamic control into a placeholder withing the Panel that is the target of a ModalPopUp. This Modal is meant to be a 'singe' instance upon which any other control on the page can populate.

The first button to actually populate the placeholder - could popup the Modal. No other buttons could populate the placeholder in the Modal - and would result in any complex logic that renders the control to provide erradic results. More importantly, any of the buttons that invoke the populate Modal event - within a gridview - would never actually allow the ModalPopUp to display...

Thats just a quick summary:

How I found the solution:

Download and install Fiddler: (Its FREE)http://www.fiddlertool.com/Fiddler/version.asp

Next: To actually grab REAL ERRORS resulting in the processing of the WebResource.Axd's you need to make this change to your web.config:

<removeverb="*"path="*.axd" />

addpath="WebResource.axd"verb="GET"type="System.Web.Handlers.AssemblyResourceLoader"validate="True" />

<addpath="*.axd"verb="*"type="System.Web.HttpNotFoundHandler"validate="True" />

The last entry is IMPORTANT. Otherwise if you use a custom HTTPHANDLER - the axd will end up passing through your custom HTTPHandler when it can not find anywhere to produce a error. I know this becuase when it works - I never see a axd coming through my HttpHandler and when there is an issue - I detect the axd - log it and throw it back out to the IIS process...If it had not been for the HttpNotFoundHandler mapping I would of never known the issue.

With Fiddler Open and it set for intercepting... there are two steps to make:

1. hitting the page as a 'default page load' (meaning it is not refreshed using F5)

2. Clicking on whatever you wanted to cause the postback.

So - since I had a bunch of code listed above and most of it is still appropiate:

1. I have a Gridview that I assign the event and record id to as part of the btnSomething.Attributes.Add (onclick, Page....blah).

2. I have an IPostBackEventHandler configured to catch the event and the args

3. Based on a match of the Event - I pass the record id to the BindModal() method.

5. The BindModal() clears the controls in the placeholder of the ModalPopUp - adds a new instance of whatever web / user / composite control I want,

and populates three parameters that normally I would populate using QueryStrings. These three items determine how the control presents the UI and determines if it is

a new record, an existing record, or if the the wrong data is presented a wizard form. Once the control is placed and added to the placeholder control it invokes the ShowModal() method:

private void BindModal(int editID){ctlLoad.Controls.Remove(ctlToAdd);ctlToAdd.currentID = editID;ctlToAdd.modeID = dropModeTypes.SelectedValue.ToString();ctlToAdd.spoofInitForModal =true;ctlLoad.Controls.Add(ctlToAdd); ShowModalPopup();

4. The ShowModal() Method does this: See Ted's example in a previous post - I converted his example so I can use n-tier approach)

void ShowModalPopup() { ModalPopupProperties popup = MyModalExtender.GetTargetProperties(Target);if (popup ==null) {//It should never be null unless it doesn't exist - add error logging here }if (popup !=null) {string script = SM.IsInPartialRenderingMode ?string.Format("showModalPopup('{0}', '{1}');", ScriptManager.PageRequestManagerID, popup.ID) :string.Format("function pageLoad() {{ var modal = $object('{0}'); if (modal) {{ modal._show(); }} }}", popup.ID); Page.ClientScript.RegisterStartupScript(typeof(ModalPopupExtender),"open", script,true); } }

When BindModal() is called from a Button event:

void lnkModal_Click(object sender,EventArgs e)

{

BindModal(8);

}

The Modal Invokes and works - however any other Buttons that invoke BindModal() will have various issues...PopUp will display but will loose viewstate for some items and retain it for others...

With the GridView the IPostBackHandler captures the event and does BindModal which in turns invokes the ShowModal()...

With the correct web.config setting and using Fiddler - we denote that instead of a click happening and the WebResource.axd passing up the chain and no popup..we get this (in my case):

<delta><pageError message="Cannot have multiple items selected in a DropDownList." /></delta></delta>

Typically when you load controls its ok to have the same named controls like a dropdownlist, etc... as they are usually referenced by a unique ID.

In this case the control I was dynamically loading shares several of the same named controls. In the error message above they both use "dropModeTypes" type: dropdownlist.

Hence why the modal is not popping up correctly becuase the mapped webresource.axd is not able to match to the proper id. Because with the current implementation of the ModalPopUp and the whole AtlasToolKitExtender - the proper heirachal loading of child controls is not taking in account dynamic controls that share same named resources as the parent container. If you attach a seperate ModalControl to each and every ietm - sure it works becuase then there is 2 degrees of seperation - however, the whole point of using components is to make them as re-usable as possible as it saves on viewstate , improves performance, and decreases the complexity of code overall.

So if you are looking to implement a re-usable ModalPopUp Control (meaning only one exists on the page and you dynamically populate based on a any number of scenarios such as clicking on a record and bringing up a address for, and another click on the record you edit emergency numbers - and want to use the one instance of the ModalPopUp ) you will need to make sure that the control being implemented does not share any parameter or control names that match anything up to the actual parent container.

This also means wrapping up the Modal into web control and calling from a parent control - since the parent container holds the default naming control entries - even if the control being dynamically loaded two levels down in the child heirachy - will instigate top level naming conventions as if it was the parent control itself.

The issues with the design can be contributed to the fact the ModalPopUp is meant to be rendered as if it is part of the parent page and not an actual popup. As a result - as a devloper you have to keep that in mind and at least for now rename controls if the IDs match any ID of the parent the controls in the parent container.

However, doesn't fix anything in reality... Removing matching IDs of controls that may co-exist between the parent and dynamic control... it will now popup the Modal - but it will only show the OK and Cancel Buttons the rest of the supposed control to load - is blank. When going back to the button that works - all of the viewstate is fixed and misaligned and pulls up the wrong part of the control ...

Read post above prior...

Couple of issues:

1. When using the Update Panel - ModalPopUp - errors will occur as 'orequested bject null' , and hides the actual error. For instance several buttons were missing in between my stripping of controls to make the simplest possible working model (ie removing wizards etc) and should of thrown an exception but never did ... weird the way it was ...

2. Having a Wizard in the control to be loaded causes a 'RegisterValidationEvents must be done in Render() error (according to fiddler.

3. I replaced the placeholder with the actual control to be loaded in the ModalPopUp... It stopped actually updating the data in the control..whether from the button that worked previously or from gridview - the changes just never posted back.... when loaded in the placeholder and the control I want is added into the placeholder - the control I wanted does get values.

So, for rendering dynamic content a placeholder control is required in your panel that is handled by the ModalPopUp.

Secondly - to have it work - you must disable partialrendering in the script manager, ...

So I have dynamic loading of controls in a modalpup working now....

Sunday, March 11, 2012

ModalPopUp comments, suggestions, issues

No comments:

Post a Comment

Modalpopup and print

Blog Archive

About Me