Showing posts with label popup. Show all posts
Showing posts with label popup. Show all posts

Wednesday, March 28, 2012

Multiple Popup Controls in PopupControlExtender

This is the code i have.

<atlasToolkit:PopupControlExtenderID="PopupControlExtender1"runat="server">

<atlasToolkit:PopupControlPropertiesPopupControlID="Panel1"Position="Bottom"TargetControlID="txtFrom"/>

<atlasToolkit:PopupControlPropertiesPopupControlID="Panel1"Position="bottom"TargetControlID="txtTo">

</atlasToolkit:PopupControlProperties>

</atlasToolkit:PopupControlExtender>

I get the following error message. But, if i remove one of the popupcontrols it works fine. AtlasControlToolkit version is 1.0.60914.0. What am i doing wrong.

Couldn't get extender properties on extender PopupControlExtender1. Make sure the ID is spelled correctly and the control is on the page.

Please include the complete error information and post a complete, simple sample page if you could.

Multiple UpdateProgress on a page?

My UpdateProgress Panel gets fired when I use my modalpopup box. Is there anyway for the modal popup to have its own progress and not trigger the one already defined on the page?

If you define aasp:UpdateProgressin a web form and specify an AssociatedUpdatePanelID?property for it, it will be triggered?and?display?the?
AssociatedUpdatePanel when you press any control in the web form.
Try the following codes and check if it works in your project.
<script type="text/javascript">
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_initializeRequest(InitializeRequest);
prm.add_endRequest(EndRequest);
var postBackElement;
function InitializeRequest(sender, args) {
if (prm.get_isInAsyncPostBack())
{
args.set_cancel(true);
}
postBackElement = args.get_postBackElement();
if (postBackElement.id == 'ButtonTrigger')
{
$get('UpdateProgress1').style.display = "block";
$get('ButtonTrigger').style.display = "none";
}
}
function EndRequest (sender, args) {
if (postBackElement.id == 'ButtonTrigger')
{
$get('UpdateProgress1').style.display = "none";
$get('ButtonTrigger').style.display = "block";
}
}
function AbortPostBack() {
if (prm.get_isInAsyncPostBack()) {
prm.abortPostBack();
}
}
</script
<div>
<asp:Button ID="ButtonTrigger" runat="server" Text="Refresh Panel 5" OnClick="Button_Click" />
<asp:UpdatePanel ID="UpdatePanel5" runat="server">
<ContentTemplate>
<%=DateTime.Now.ToString() %> <br />
The trigger for this panel
causes the UpdateProgress to be displayed
even though the UpdateProgress is associated
with panel 2.
<br />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="ButtonTrigger" />
</Triggers>
</asp:UpdatePanel>
<asp:UpdatePanel ID="UpdatePanel6" UpdateMode="Conditional" runat="server">
<ContentTemplate>
<%=DateTime.Now.ToString() %> <br />
<asp:Button ID="Button2" runat="server" Text="Refresh Panel 6" OnClick="Button_Click"/>
</ContentTemplate>
</asp:UpdatePanel>
<span style="display: inline-block;">
<asp:UpdateProgress ID="UpdateProgress1" runat="server">
<ProgressTemplate>
<asp:Image ID="Image1" runat="server" ImageUrl="~/images/airplane.bmp" />
</ProgressTemplate>
</asp:UpdateProgress>
</span>
</div>
Wish the above can help you.

Monday, March 26, 2012

Must Click Twice for Event to Fire

I have an GridView with an Select link on each line. The link brings up a modal popup for editing data. The GridView is inside an updatepanel.

Everything works great, except for some reason, I have to click the Select link twice for the event to fire. The first click does nothing...does not enter the

SelectedIndexChanged event at all.

Anyone know why?

Wanna post your HTML here so we can take a peek?

WS


Sure here you go..

<%

@.ControlLanguage="vb"AutoEventWireup="false"Codebehind="Packer.ascx.vb"Inherits="WDE.Packer" %>

<%

@.RegisterAssembly="AjaxControlToolkit"Namespace="AjaxControlToolkit"TagPrefix="ajaxToolkit" %>

<

divid="PackerUpdatePanel"><asp:UpdatePanelID="UpdatePanelPackers"runat="server"UpdateMode="Conditional"><ContentTemplate><asp:PanelID="PanelPackersHeader"runat="server"CssClass="collapsePanelHeader"Height="30px"><divstyle="padding: 5px; vertical-align: middle;"><divstyle="float: left;"><asp:LabelID="LblPackers"runat="server"Text="Packers"></asp:Label></div><divstyle="float: left; margin-left: 5px;"><asp:LabelID="LblPackersCount"runat="server"></asp:Label></div><divstyle="float: right; vertical-align: middle; cursor: hand"><asp:ImageButtonID="ImageExpand"runat="server"ImageUrl="~/images/expand_blue.jpg"/></div><divstyle="float: right; margin-right: 20px;"></div></div></asp:Panel><asp:PanelID="PanelPackersViewDetails"runat="server"Height="100%"Width="100%"Wrap="False"><tableid="border"width="100%"cellpadding="0"cellspacing="0"><tr><tdclass="addHeader"><divstyle="float: right; margin-right: 1px;cursor: hand"><asp:LinkButtonID="HyperLinkAddPacker"runat="server"OnClick="HyperLinkAddPacker_Click"ForeColor="White"CssClass="hyperlinkNoLine">Add New Packer</asp:LinkButton></div></td></tr><tr><td><asp:GridViewID="packerGrid"runat="server"CellPadding="4"DataSourceID="PackersXmlDataSource"Width="100%"ForeColor="#333333"AutoGenerateColumns="False"GridLines="None"OnSelectedIndexChanged="packerGrid_SelectedIndexChanged"><FooterStyleBackColor="#5D7B9D"Font-Bold="True"ForeColor="White"/><RowStyleBackColor="#F7F6F3"ForeColor="#333333"/><EditRowStyleBackColor="#999999"/><SelectedRowStyleBackColor="#E2DED6"Font-Bold="True"ForeColor="#333333"/><PagerStyleBackColor="#284775"ForeColor="White"HorizontalAlign="Center"/><HeaderStyleBackColor="#5D7B9D"Font-Bold="True"ForeColor="White"/><AlternatingRowStyleBackColor="White"ForeColor="#284775"/><Columns><asp:CommandFieldShowSelectButton="True"SelectText="Edit"/><asp:BoundFieldDataField="packerDate"HeaderText="Date"SortExpression="packerDate"><ItemStyleHorizontalAlign="Left"/><HeaderStyleHorizontalAlign="Left"/></asp:BoundField><asp:BoundFieldDataField="packerOperation"HeaderText="Operation"SortExpression="packerOperation"><HeaderStyleHorizontalAlign="Left"/><ItemStyleHorizontalAlign="Left"/></asp:BoundField><asp:BoundFieldDataField="packerCode"HeaderText="Code"SortExpression="packerCode"><HeaderStyleHorizontalAlign="Left"/><ItemStyleHorizontalAlign="Left"/></asp:BoundField><asp:BoundFieldDataField="packerDepth"HeaderText="Depth"SortExpression="packerDepth"><HeaderStyleHorizontalAlign="Left"/><ItemStyleHorizontalAlign="Left"/></asp:BoundField><asp:CommandFieldButtonType="Image"DeleteImageUrl="~/Images/DELETE.jpg"ShowDeleteButton="True"/></Columns></asp:GridView></td></tr></table></asp:Panel><ajaxToolkit:CollapsiblePanelExtenderID="CollapsiblePanelExtenderPackers"runat="Server"TargetControlID="PanelPackersViewDetails"ExpandControlID="ImageExpand"CollapseControlID="ImageExpand"Collapsed="True"ExpandedImage="~/images/collapse_blue.jpg"CollapsedImage="~/images/expand_blue.jpg"ImageControlID="ImageExpand"SuppressPostBack="true"/></ContentTemplate></asp:UpdatePanel>

</

div>

<

divid="PackersMaintenancePanelDiv"><asp:ButtonID="FakePackerTarget"runat="server"Style="display: none"></asp:Button><ajaxToolkit:ModalPopupExtenderID="ModalPopupAddEditPacker"runat="server"TargetControlID="FakePackerTarget"PopupControlID="PanelPackerAddEdit"BackgroundCssClass="modalBackground"DropShadow="false"CancelControlID="btnCancel"/><asp:PanelID="PanelPackerAddEdit"runat="server"Width="45%"Wrap="False"Style="display: none"BorderStyle="Solid"BorderColor="#6b8aad"><asp:UpdatePanelID="UpdatePanelPackerModalPopup"runat="server"><ContentTemplate><tableid="AddPackTable"runat="server"style="width: 100%; background-color: white;"><tr><tdcolspan="3"style="font-size: 10pt; background-color: #6b8aad; color: White"><asp:LabelID="lblPackerHeader"runat="server"Text="Packer"></asp:Label></td></tr><tr><td><asp:LabelID="lblPackerDate"runat="server"Text="Date:"Width="78px"></asp:Label><br/></td><td><asp:TextBoxID="txtPackerDate"runat="server"></asp:TextBox><spanstyle="font-size: 10pt; color: #ff0033">* </span><asp:ImageButtonID="ImageBtnCalendar"runat="server"ImageUrl="~/Images/CalendarButton.gif"/><ajaxToolkit:PopupControlExtenderID="PopupControlExtenderPackerDate"runat="server"TargetControlID="ImageBtnCalendar"PopupControlID="PanelCalendar"Position="Bottom"/><spanstyle="font-size: 10pt">(yyyymmdd)</span></td><td><asp:RequiredFieldValidatorID="RequiredFieldValidator2"runat="server"ControlToValidate="txtPackerDate"ErrorMessage="RequiredFieldValidator"Display="Dynamic">Date is required.</asp:RequiredFieldValidator></td></tr><tr><td><asp:LabelID="lblPackerOperation"runat="server"Text="Operation:"></asp:Label></td><td><asp:RadioButtonListID="rblPakerOperation"runat="server"RepeatDirection="Horizontal"><asp:ListItemSelected="True"Value="P">Pulled</asp:ListItem><asp:ListItemValue="S">Set</asp:ListItem></asp:RadioButtonList></td><td></td></tr><tr><td><asp:LabelID="lblPackerCode"runat="server"Text="Code:"></asp:Label></td><td><asp:TextBoxID="txtBoxPackerCode"runat="server"></asp:TextBox><asp:ButtonID="btnPackerCodes"runat="server"Text=".."/><ajaxToolkit:PopupControlExtenderID="PopupControlExtenderPackerCodes"runat="server"TargetControlID="btnPackerCodes"PopupControlID="PanelPackerCode"Position="Bottom"/></td><td></td></tr><tr><td><asp:LabelID="lblPackerDepth"runat="server"Text="Depth:"></asp:Label></td><td><asp:TextBoxID="txtboxPackerDepth"runat="server"MaxLength="7"></asp:TextBox>mkb<spanstyle="font-size: 10pt; color: #ff0033">*</span></td><td><asp:RequiredFieldValidatorID="RequiredFieldValidator1"runat="server"ControlToValidate="txtboxPackerDepth"ErrorMessage="RequiredFieldValidator"Display="Dynamic">Depth is required.</asp:RequiredFieldValidator></td></tr><tr><tdcolspan="3"><hr/></td></tr><tr><td><spanstyle="color: #ff0033"><spanstyle="font-size: 10pt; color: #ff0033">*</span></span>-Required</td><td></td><tdstyle="width: 100%"><asp:ButtonID="btnPackerAddOk"runat="server"Text="Ok"/><asp:ButtonID="btnCancel"runat="server"Text="Cancel"OnClick="btnCancel_Click"CausesValidation="False"/></td></tr></table></ContentTemplate></asp:UpdatePanel></asp:Panel>

</

div>

<

divid="PanelCalendarDiv"><asp:PanelID="PanelCalendar"runat="server"CssClass="popupControl"Style="z-index: 10002"><asp:UpdatePanelID="UpdatePanelCalendar"runat="server"UpdateMode="Always"><ContentTemplate><center><asp:CalendarID="Calendar1"runat="server"BackColor="White"BorderColor="#999999"CellPadding="1"DayNameFormat="Shortest"Font-Names="Verdana"Font-Size="8pt"ForeColor="Black"Width="160px"OnSelectionChanged="Calendar1_SelectionChanged"><SelectedDayStyleBackColor="#666666"Font-Bold="True"ForeColor="White"/><TodayDayStyleBackColor="#CCCCCC"ForeColor="Black"/><SelectorStyleBackColor="#CCCCCC"/><WeekendDayStyleBackColor="#FFFFCC"/><OtherMonthDayStyleForeColor="#808080"/><NextPrevStyleVerticalAlign="Bottom"/><DayHeaderStyleBackColor="#CCCCCC"Font-Bold="True"Font-Size="7pt"/><TitleStyleBackColor="#999999"Font-Size="7pt"BorderColor="Black"Font-Bold="True"/></asp:Calendar></center></ContentTemplate></asp:UpdatePanel></asp:Panel>

</

div>

<

divid="PanelPackerCodeDiv"><asp:PanelID="PanelPackerCode"runat="server"CssClass="popupControl"Style="z-index: 10003"><asp:UpdatePanelID="UpdatePanel1"runat="server"><ContentTemplate><asp:RadioButtonListID="RblPackerCodes"runat="server"OnSelectedIndexChanged="RblPackerCodes_SelectedIndexChanged"AutoPostBack="true"><asp:ListItemValue="1">1 - Packer</asp:ListItem><asp:ListItemValue="2">2 - Bridge plug or whipstock packer</asp:ListItem><asp:ListItemValue="3">3 - Cement retainer</asp:ListItem><asp:ListItemValue="4">4 - Through tubing packer</asp:ListItem><asp:ListItemValue="5">5 - Through tubing bridge plug</asp:ListItem></asp:RadioButtonList></ContentTemplate></asp:UpdatePanel></asp:Panel>

</

div>

<

asp:XmlDataSourceID="PackersXmlDataSource"runat="server"DataFile="~/XML/Packers.xml">

</

asp:XmlDataSource>

<

asp:ObjectDataSourceID="PackersObjectDataSource"runat="server"DataObjectTypeName="Packer"DeleteMethod="DeletePacker"SelectMethod="GetPackers"TypeName="WellOperation"UpdateMethod="UpdatePacker"></asp:ObjectDataSource>

I'm having the same problem and have tried for 2 weeks to resolve without success. I have converted to the RC AJAX - still same issue. I have suspected that the problem revolves around a custom user control that is on my form. It is simply an alphabet selector with 26 letters as links.

I have traced the events and on the first click, the code goes as far as the constructor code for the user control and then simply stops. But then, as Janet wrote, the second click works just fine.

My (Un)Modal Popup

I have added a modal popup to my user control. I show the modal popup by registering a startup script in the code-behind of an update panel trigger. The modal popup appears, but it isn't modal. I can click and edit the form fields behind the modal popup. Has anyone seen this happen? Any thoughts on how to fix it?Post code and I might be able to help you

Have you set the BackgroundCSSClass properly? I saw the same behavior and was able to fix it by setting the BackgroundCSS... here's an example of the CSS I used

.modalBackground

{background-color:Gray;filter:alpha(opacity=70);

}


I used below css but still my main page controls can be accessed?

.modalBackground

{background-color:Gray;filter:alpha(opacity=70);

}

This is happening in (Un)Modal fashion, any have solution for this.

Saturday, March 24, 2012

My PasswordStrength extender doesnt work properly in modal popup

I am using a password Strength extender in a modal pop up but the bar indicating the strength does not show up. I removed it to the main page and it was working properly.

So what would be wrong here ? The only thing that I thought might be wrong was CSS file but it seems like the extender can access it on the main page.

Any help is appreciated.

Thank you.


Have you included CSS in the main page ?

Can u provide some code details here...?


Whether you are using Master page concept ?

Thanks

Yes I am using CSS file.

.BarIndicator { color:Blue; background-color:Blue; padding-bottom:1px; }.BarBorder { border-style:solid; border-width:1px; width:200px; vertical-align:middle; }.modalBackground {background-color:Gray;filter:alpha(opacity=70);opacity:0.7;}.modalPopup {background-color:#ffffdd;border-width:3px;border-style:solid;border-color:Gray;padding:3px;width:480px; height:250px;}

When I use PopupControlExtender instead of Modal, everything work good. I can even see the bar. Is there something wrong with Modal Popup extender that prevent the bar to show itself ?



Please, any body know what is wrong ? is there any ideas ?

Check this one may it will help you

http://www.asp.net/learn/videos/view.aspx?tabid=63&id=97


The reason it does not display is because there is a background colour specified for the modal popup display. If you removw the background colour delcaration from the CSS, you can see the bar indicator. While this is not optimal, its got to do with the way the ModalPopup sets the z-index and the way the PasswordStrength extender also displays its indicator elements.

Might want to raise this as a bug on codeplex.com.


Thanks ..Smile


Has there been a fix for this issue? I have the same problem ...

Adam

Need assistance with popup making an AJAX/Webservice

Hi - I would like to have a popup panel appear on a roll-over of an image and then for that panel to call a webservice that hits a database on the backend to populate a gridview. But I have no idea where to start. I would like this panel to have the progress indicator while the grid is loading. Any links/help would be very greatly appreciated.

Thank you,
daveIn the Atlas framework, look at the UpdateProgress control. In the AtlasControlToolkit, check out the HoverMenuExtender and DynamicPopulateExtender.
Thank you. I'm looking now :)

Wednesday, March 21, 2012

Need Help with Modal Popup!

Here's the deal...

I have a bound DetailsView (user control) that I have created custom command buttons for (add, edit, save, cancel).

Upon edit, I am storing the values for each field to hidden textboxes on the form. Upon save, I will need to run custom validation routine(s), as well as, compare old vs. new values (some changes will trigger back-end processes to kick off via SQL triggers and we want alert the user of this up front).

Once validation passes, if one or more of the values have changed that will cause execution of the triggers, I want to manually launch a popup [ modalpopup1.show() ] that lists the specific changes and asks the user to Confirm (ie., "Are they sure they want to Save?"). If so, the app will proceed with updating / saving the record and the SQL proc will go ahead and execute. If not, the update is cancelled and the detailsview goes back into read only mode.

Problem I am having is that the Modal wants me to specify a "TargetControlId" and I am not sure what that control should be. I tried making it the Save button, but doing so will cause the modal to appear immediately (ie., before the validations and old vs. new compare routine) executes. So I then tried creating a dummy button, but get the following error message: "The control 'btn_Dummy' already has a data item registered. Parameter name: control".

Can anyone help me on the proper way to code / implement this ?

Hi ,

The "TargetControlId" specifies the Control which will trigger the ModalPopup to Show .

What you can do is .. Once you come to know that certain changes have been made to the data , you can use the Client side methods of the ModalPopup to Show / Hide

Show and Hide ModalPopupExtender from JavaScript

Let me know if I missed anything


I tried this via example provided via thread ("Show Popup Dynamically via js") , but I really would like to popup the modal from another button's code behind (ie., after all my validations checks have been completed). Is there not a way to do this?

If not, I guess the only alternative would be to re-write the validation routines in js and call the popup from there??


From ServerSide , you have access to the ModalPopup's Show method using

ModalPopupExtender1.Show()

From Client side , use the method described in my previous reply.


Hi,

Still getting error message "data item already registered" when attempting to use ModalPopupExtender1.show().

Found thishttp://www.codeplex.com/AtlasControlToolkit/WorkItem/View.aspx?WorkItemId=7115 after doing more research on Google. It appears to be a bug.

Appreciate your trying to help. I've decide to manually hide / unhide my panels instead of the AJAX control until the above is resolved.

Thanks,

Annette