I created Ajax modal pop up. This is not support drag.
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</asp:ToolkitScriptManager>
<asp:ModalPopupExtender ID="ModalPopupExtender" runat="server"
TargetControlID="Button1"
PopupControlID="Panel1"
BackgroundCssClass="modalBackground"
CancelControlID="btnCancel"
RepositionMode="None"
PopupDragHandleControlID="PopUpHeader" />
<asp:Button ID="Button1" runat="server" Text="First Modal Popup" />
<asp:Panel ID="Panel1" runat="server" Height="180px" Width="400px" CssClass="ModalWindow">
<div id="PopUpHeader" style="background-color:Yellow;">
Error Message
</div>
<div>
My name is error of proble. For comming is satun.
<br /><br /><br /><br />
</div>
<div>
<input type="button" id="btnCancel" runat="server" value="Close" style="float:right;margin-right:20px;" />
</div>
</asp:Panel>
How I get the drag and drop.
Firstly http://www.asp.net/ajax/ajaxcontroltoolkit/samples/modalpopup/modalpopup.aspx
And you must edit PopupDragHandleControlID="PopUpHeader" with PopupDragHandleControlID="Panel1"
PopupDragHandleControlID
is controling whict panel are you using with Modal Popup.
Related
I am trying to show my jquery button on the same line as my dropdown, currently it is beneath, I tried setting the inline width on Div but nothing happened , any advice ?
<asp:Label runat="server" id="lblError"></asp:Label>
<div id="divChangeLabApproval" runat="server">
<br />
<asp:Label ID="lblNewLabStatus" runat="server" Text="New Lab Status: " />
<asp:DropDownList ID="ddlSetLabStatus" runat="server">
</asp:DropDownList>
<asp:Button ID="btnSaveLabChange" runat="server" Text="Save" OnClientClick="if (!OnSaveLabChangeClick()) return false;" OnClick="OnSaveLabChange" UseSubmitBehavior="false" />
<br />
</div>
The ModalPopupExtender wires the btnCancel button to trigger the a popup an UpdatePanel. The UpdatePanel is a cancel confirmation which contains a Yes button and a No button. After clicking the No button, the panel is closed but the btnCancel no longer trigger the popup when being clicked again. The Yes button works and triggers the server side YesButton_Click event. Here is my code. Thanks for your help.
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<cc1:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" />
<asp:Button ID="btnCancel" Text="Cancel Task" runat="server" ToolTip="Cancel the displayed task and remove it from Tracker" CausesValidation="false" />
<cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="btnCancel"
PopupControlID="ConfirmationPanel" BackgroundCssClass="modalBackground" />
<asp:UpdatePanel ID="upd_yes_no" runat="server">
<ContentTemplate>
<asp:Panel ID="ConfirmationPanel" runat="server" CssClass="modalPopup" Style="display: none">
<div class="modalPopup-text">
Are you sure you want to cancel this task?<br />
<br />
<asp:Button ID="YesButton" runat="server" Text="Yes" CommandArgument="Yes" OnClick="YesButton_Click" />
<asp:Button ID="NoButton" runat="server" Text="No" CommandArgument="No" />
</div>
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Content>
I'm not 100% positive but it appears that Extender and Extended controls must reside in the same UpdatePanel. So if you move your Cancel button and ModalPopupExtender control inside the UpdatePanel, it should work as expected.
<ajax:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" />
<asp:UpdatePanel ID="upd_yes_no" runat="server">
<ContentTemplate>
<span id="buttons">
<asp:Button ID="btnUndo" Text="Undo Edit" CommandArgument="undo" runat="server"
OnClick="undo" CausesValidation="false" />
<asp:Button ID="btnNewTask" Text="New Task" CommandArgument="newTask" runat="server"
ToolTip="Unchange current and create new task"
OnClick="NewTask" CausesValidation="false" />
<asp:Button ID="btnCancel" Text="Cancel Task" runat="server"
ToolTip="Cancel the displayed task and remove it from Tracker" CausesValidation="false" />
</span>
<ajax:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="btnCancel" PopupControlID="ConfirmationPanel" BackgroundCssClass="modalBackground" />
<asp:Panel ID="ConfirmationPanel" runat="server" CssClass="modalPopup" Style="display: none">
<div class="modalPopup-text">
Are you sure you want to cancel this task?
<br />
<br />
<asp:Button ID="YesButton" runat="server" Text="Yes" CommandArgument="Yes" OnClick="YesButton_Click" />
<asp:Button ID="NoButton" runat="server" Text="No" CommandArgument="No" />
</div>
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
I have the following code on a .aspx file. If I comment out the ModalPopupExtender code works fine.:
<cc1:ModalPopupExtender BehaviorID="mdlPopup" runat="server" TargetControlID="btn"
ID="mdl1" PopupControlID="pnlPopup" OkControlID="LinkButton1" BackgroundCssClass="modalBackground" />
<asp:Panel ID="pnlPopup" runat="server" CssClass="confirm-dialog" Style="display: none;">
<div class="inner">
Work Order #: <asp:TextBox ID="txtWorkOrder" runat="server" Width="285" Text=""></asp:TextBox><br /><br />
Please Enter Corrective Actions<br />
<asp:TextBox ID="TextBox2" runat="server" Height="150" Width="285" TextMode="MultiLine"
Text=""></asp:TextBox>
<asp:Button ID="btnOK" runat="server" Font-Bold="true" Text="Submit" OnClick="click"
Width="150" />
<asp:LinkButton ID="LinkButton1" runat="server" CssClass="close" OnClick="cancel" />
</div>
</asp:Panel>
<asp:Button ID="btn" runat="server" Style="display: none;" />
<asp:Label ID="id" runat="server" Text="Label" Visible="false"></asp:Label>
The problem that I am having is that the page just hangs when I have this code in the .aspx file. Is there anything I should do. It does not even get to the Page_Load.
I am calling this page that has the above code with the following:
string url = "Alerts.aspx?";
url += "ID=" + id.Text;
Response.Redirect(url);
I have an update panel that contains a label, a dropDownList and two buttons:
<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<div id="dropDownList" style="position:relative;" runat="server">
<label>
Select New File: </label>
<div id="ddl" runat="server">
<asp:DropDownList runat="server" ID="ddlCaseFiles" DataSourceID="dsMyCaseFiles" DataTextField="Display"
DataValueField="FileID" OnPreRender="ddl_PreRender" Width="524px" OnSelectedIndexChanged="ddlCaseFiles_SelectedIndexChanged" />
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="ddlCaseFiles"
ToolTip="Casefile Required" InitialValue="-1" Text="*" Display="Dynamic" />
<ajaxToolkit:ListSearchExtender ID="ddlExtCaseFiles" runat="server" PromptCssClass="ListSearchExtenderPrompt"
TargetControlID="ddlCaseFiles" BehaviorID="ddlExtCaseFiles" Enabled="True" />
</div>
<br />
<asp:Button ID="btnMoveCaseFile" runat="server" Text=""
style="float:left;" onclick="btnMoveCaseFile_Click"/>
<asp:Button ID="btnCancel" runat="server" Text="Cancel"
style="float:right" onclick="btnCancel_Click"/>
<br />
</div>
<asp:Label runat="server" ID="lblStatus"></asp:Label>
</ContentTemplate>
I am trying to get my buttons to line up like this:(button at the beginning of the DropDownList and a button at the End)
I've tried float-absolute etc.
I figured it out. Seems as though you have to add in px after the number.....
<asp:Button ID="btnMoveCaseFile" runat="server" Text=""
style="position:absolute; float:left; margin-left:104px;" onclick="btnMoveCaseFile_Click"/>
<asp:Button ID="btnCancel" runat="server" Text="Cancel"
style="position:relative; float:right; margin-right:63px;"
since I had margin-right:63; instead of margin-right:63px;
I have 2 panels and using ajax modalpopup control
<asp:Panel ID="pnlHead" runat="server" CssClass="modalPopup">
<asp:Panel ID="pnlBody" runat="server">
<div id="popupHead">
<div id="popup_left">
<asp:Label ID="lblProduct" runat="server"></asp:Label></div>
<!-- end banner_left -->
<div id="popup_right">
</div>
<!-- end banner_right -->
</div>
</asp:Panel>
<p>
<asp:PlaceHolder ID="phcontrol" runat="server"></asp:PlaceHolder>
</p>
<div>
<center>
<asp:ImageButton ID="imgbtnOk" runat="server" OnClick="imgbtnOk_Click" />
</center>
</div>
</asp:Panel>
<asp:Panel ID="pnlHeadWD" runat="server" CssClass="modalPopupWD"
BackImageUrl="~/WebSiteContent/Images/Cloud.JPG">
<asp:Panel ID="pnlBodyWD" runat="server">
<div id="Div1" style="position: absolute; left: 15%; top: 15%; vertical-align: middle;">
<br />
<br />
<br />
<br />
<br />
<p>
<asp:PlaceHolder ID="phcontrolWD" runat="server"></asp:PlaceHolder>
</p>
<div>
<center>
<asp:ImageButton ID="imgbtnOkWD" runat="server" Visible="false" OnClientClick="$find('pnlHeadWD').hide(); return false;" />
</center>
</div>
</div>
</asp:Panel>
</asp:Panel>
<asp:TextBox ID="txtHidden" Visible="false" runat="server"></asp:TextBox>
<cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="lblCopyright"
PopupControlID="pnlHead" BackgroundCssClass="modalBackground" DropShadow="true"
PopupDragHandleControlID="pnlBody">
</cc1:ModalPopupExtender>
<cc1:ModalPopupExtender ID="ModalPopupExtender2" runat="server" TargetControlID="lblCopyright"
BehaviorID="pnlHeadWD" PopupControlID="pnlHeadWD" BackgroundCssClass="modalBackground"
DropShadow="true" PopupDragHandleControlID="pnlBodyWD">
</cc1:ModalPopupExtender>
when I tried to call the first ModalPopupExtender1 then even the second ModalPopupExtender2 is getting executed and 2 modal popup extenders are shown.
public void Populate_Popup(String URL,String Message_Identifier)
{
this.ModalPopupExtender1.Show();
}
public void Populate_Popup2(string Message)
{
this.ModalPopupExtender2.Show();
}
Your TargetControlID="lblCopyright" is the same for both ModalPopupExtenders.