Cannot call modal popup of master page in child page - javascript

I am using a modal popup for to display login box. The modal popup is in the master page and associated with a LogIn link therein. Now I want to call the same modal popup in a child page using a different link button. The modal popup can be called by the LogIn link of master page but I want to add this second control (linkButton) in child page, which can call the modalpop of master page.
I tried this in child page:
function LogIn2()
{
$find("programmaticModalPopupBehavior").show();
}
<asp:LinkButton ID="LinkButton1" runat="server" OnClientClick="LogIn2">Log in</asp:LinkButton>
Reference: multiple TargetControls for the ModalPopup
How to call the functional modal popup of master page from a control in child page??
Update:
This is in masterpage:
<ajax:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="linkLog" CancelControlID="linkClose" BackgroundCssClass="cssModal" PopupControlID="panelPopUp" BehaviorID="programmaticModalPopupBehavior" PopupDragHandleControlID="panelDrag"></ajax:ModalPopupExtender>

Add an OnClientClick for the LinkButton, like this:
<asp:LinkButton ID="LinkButton1" runat="server" Text="Login 2" OnClientClick="return LogIn2()" ...>
Put the JavaScript function in your master page, and after showing the popup, have the method return false to prevent the LinkButton from doing a postback:
function LogIn2()
{
$find("<%=ModalPopupExtender1.UniqueID%>").show();
return false;
}
As an alternative, you may also add return false to the OnClientClick of the LinkButton, after the LogIn2 function has executed, like this:
<asp:LinkButton ID="LinkButton1" runat="server" Text="Login 2" OnClientClick="LogIn2();return false;" ...>

I m not sure about this but let me confirm are you using the control of ajax like given below
<asp:ModalPopupExtender ID="ImageUploaderEx" runat="server" BehaviorID="ImageUploaderBID" TargetControlID="Link Name" CancelControlID="Cancel" PopupControlID="Panel to be open" OnCancelScript="hideUploader()"></asp:ModalPopupExtender>
If Yes then you can use this same modal with a different name, If this doesnt work let me know I will try my best
try this if it works
((ModalPopupExtender)Page.Master.FindControl("ModalPopupExtender1")).Show();
and add this as well
using AjaxControlToolkit;

Related

Hide a Radbutton which is inside a popup when another popup form is submitted and closed upon OnClientClicking

I have a page "Main2.aspx" and inside this page, I have a button "Transactions" upon clicking this button opens a popup form "Transactions" and Inside this popup, I have coded a button "AddRadbutton" and Upon clicking this "AddRadbutton" on using Javascript URL redirection a new popup "SaveDetails" form will appear.
This "SaveDetails" form is having a "SaveRadButton", upon clicking this "SaveRadButton" my form details will be saved and the popup closes successfully.
The problem I'm facing here is, "AddRadbutton" on the "Transactions" form is still visible even after filling and submitting the details using "SaveRadButton" on "SaveDetails" form.
Earlier, I'm able to achieve the same scenario by coding on Server Side, when I have used the same "SaveDetails" popup page in User Control Page which is inside "Main1.aspx" but not here on Main2.aspx.
In Main2.aspx page I can only achieve this only when page refresh happens. but I need this "AddRadbutton" to be Hidden Immeadiately after submitting the form in "SaveDetails" popup form.
Techniques I've tried so far:
Below is the Code for AddRadButton (which is in Transactions popup)
<div id="AddDetailsDiv" runat="server" visible="true" style="width: auto; height: auto; float: left; margin-right: 10px;">
<telerik:RadButton ID="AddRadButton" runat="server" Text="Add Details"
CausesValidation="False" TabIndex="14" OnClientClicking="showDetailsWindow" UseSubmitBehavior="false" >
</telerik:RadButton>
</div>
Below is the Code for SaveRadButton (which is in SaveDetails popup)
<telerik:RadButton ID="SaveRadButton" runat="server" Text="Save" OnClick="InsertRadButton"
In Server Side for OnClick is there any chance of handling this issue using below line:
ScriptManager.RegisterStartupScript(Page, Page.GetType(), "RadWindow", "CloseBind();", true);
I've tried coding another Javascript function and use it in OnClientClicking or OnClientClicked and call both functions but unable to achieve it because Telerik UI is not supporting or I might be missing something else.
I've tried this basic AddRadButton.Visible = false on server side, its working, but only after page refresh but I needed it to be hidden Immeadiately after popup form submission.
I've tried handling in the below code() but unable to achieve it.
function CloseBind() {
var oWindow = GetRadWindow();
oWindow.close();
oWindow.BrowserWindow.loadDetails();
}
function GetRadWindow() {
var oWindow = null;
if (window.radWindow) oWindow = window.radWindow;
else if (window.frameElement.radWindow) oWindow = window.frameElement.radWindow;
return oWindow;
}
I've searched and tried many stackoverflow-related questions, scenarios and also on many community developer sites but those didn't help me either.
Any Ideas or suggestions would be appreciated.
AddRadButton.Visible = false
should work. You will need to make sure that it's inside an if which checks for IsPostback. If that does not work for you, then it's possible that a later event in the WebForms lifecycle overrides it, maybe a render-related event is where this should be implemented, like OnPreRender. You could also register a callback script (see How can I do a call back to the code behind method using javascript (properly)?) and invoke a Javascript functions that changes the display styling to none.
I've tried to solve the problem by introducing an alert() before the window is closed so that the page refresh happens upon alert "OK" button click from the user side.
I've tried by calling an alert function in telerik: RadWindow using OnClientClose="saveDetailsWindowClose"
<telerik:RadWindowManager EnableShadow="true" Behaviors="Maximize, Close" ID="MainRadWindowManager"
DestroyOnClose="false" Opacity="100" runat="server" Modal="true" AutoSize="false"
CssClass="lte_colpopup" KeepInScreenBounds="true" RestrictionZoneID="MainContent"
VisibleStatusbar="false" style="overflow: hidden !important">
<Windows>
<telerik:RadWindow ID="MyRadWindow" ReloadOnShow="true" ShowContentDuringLoad="false" OnClientClose="saveDetailsWindowClose"
Width="950" Height="450" runat="server" Title="Person Details">
</telerik:RadWindow>
</Windows>
</telerik:RadWindowManager>
<telerik:RadScriptBlock ID="MasterScriptBlock" runat="server">
I've used below simple Javascript function to alert the User:
<script type="text/javascript">
function saveDetailsWindowClose(sender, args) {
alert('A Screen refresh is mandatory to load the details, so please click "OK" button to proceed');
window.location.reload();
}
</script>
</telerik:RadScriptBlock>
This is how I solved the Issue, fortunately, AddRadbutton on both these Main1.aspx and Main2.aspx and also on popup pages are working as intended. Luckily it didn't hamper with the closing of a window in UserControl Page on Main1.aspx which is using the same saveDetails.aspx page.

Data from entity framework displayed in javascript/Jquery dialog

I have a problem, and looking for a solution for 2 days
Target : Create/edit client... in HTML build a dialog with and asp fields with clientIDMode static
<div id="divDialog" runat="server" clientidmode="Static" style="display: none;">
<div class="DialogFields">
<asp:Label ID="Label1" runat="server" Text="Firstname"></asp:Label>
<br />
<asp:TextBox ID="tbxFirstName" runat="server" ClientIDMode="Static"></asp:TextBox>
</div>
...
In script
$("#btnShowDialog").click(function () {
openDialog();
});
function openDialog() {
$("#divDialog").dialog('open');
$("#divDialog").parent().appendTo($("form:first"));
}
When I click the button btnShowDialog it works fine... But
Beneath it I have a gridview within it a edit button (asp:Linkbutton) with a event to the codebehind it looks like:
<asp:TemplateField>
<ItemTemplate>
<asp:LinkButton ID="Edit" OnCommand="Edit_Click" CommandArgument='<%#Eval("RelationID") %>'
runat="server"><img src="../images/Edit-item.png" alt="Edit" /></asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
In codebehind take the parameter from commandargument and fire LoadInfo (specific data to all the fields in de dialog).
LoadInfo(e.CommandArgument != null ? int.Parse(e.CommandArgument.ToString()) : -1);
but no way I get the dialog open.
I tried
ClientScript.RegisterStartupScript(this.GetType(), "Popup", "openDialog();", true);
and
ScriptManager.RegisterStartupScript(this.Page, this.GetType(), "script", "openDialog();", true);
after this LoadInfo, push btnShowDialog button and it opens the dialog and all data perfect in place.
Also tried the other way around as Directly to Jquery function, get all data loaded and open the dialog. 2 problems, loading in codebehind was not even started before the dialog opens. and I only can get a static function in the codebehind.
A lot of ground to cover for me, but can any body help me out (even for a part).
...Thanx
If I understand your question correctly, you are trying to fire some client scripts (openDialog) from the server side, but they wont fire?
Try placing your page in an update panel, lets assume that we name the update panel "MyUpdatePanel". And then refer to the update panel like this:
ScriptManager.RegisterStartupScript(MyUpdatePanel, MyUpdatePanel.GetType(), "MyUpdatePanelScript", "openDialog();", true);

Trigger Javascript for a Server side Checkbox

I have a situation where i am performing some server action the click of the checkbox and then redirecting the user to another page. But the problem is, After i click the checkbox, it is taking time to redirect as it is slightly slow and hence the users are able to click on other checkboxes. I want to either disable the whole page or disable all the Check boxes. I wrote a javascript but it gets triggered only when the page is loaded again.
My Html :
<div>
<asp:CheckBox ID="checkbox1" runat="server" OnCheckedChanged="checkbox1_CheckedChanged" AutoPostBack="true" CssClass="chk-facet-checkbox"/>
<asp:CheckBox ID="checkbox2" runat="server" OnCheckedChanged="checkbox2_CheckedChanged" AutoPostBack="true" CssClass="chk-facet-checkbox"/>
<asp:CheckBox ID="checkbox3" runat="server" OnCheckedChanged="checkbox3_CheckedChanged" AutoPostBack="true" CssClass="chk-facet-checkbox"/>
</div>
<div id='blockerdiv'>
</div>
My Jquery :
if ($(".chk-facet-checkbox").is(":checked")) {
$('.blockerdiv').show();
//Code to show the 'blockerdiv' as an overlay blocking the whole page
// All we need to do is show the blockerdiv. There is already Code to take care of the overlay
}
Try adding:
$(".chk-facet-checkbox").attr("disabled", true);
and so:
if ($(".chk-facet-checkbox").is(":checked")) {
$('.blockerdiv').show();
//Code to show the 'blockerdiv' as an overlay blocking the whole page
// All we need to do is show the blockerdiv. There is already Code to take care of the overlay
$(".chk-facet-checkbox").attr("disabled", true);
}
This disables all checkbox inputs with that class.
You can Use jquery.blockui.js
Then simply use $.blockUI and $.unblockUI functions to block and unblock the UI according to your need.

ASP.NET HyperLink Eval in a Javascript function

I've added a HyperLink control to a GridView within a TemplateField and I want it to redirect the user to a specific page, passing the ID from the selected row. The following works just fine:
<asp:HyperLink ID="hlViewBasketItem" runat="server" Text="Detail"
NavigateUrl='<%# Eval("BasketItemID", "/BasketItemDetail.aspx?popUp=true&id={0}") %>'>
</asp:HyperLink>
The ID evaluates correctly; for example: "/BasketItemDetail.aspx?popUp=true&id=52"
The problem I have is that I need to make a call to a Javascript function to control the display of my page (so that it appears within a popup). I've tried the following:
<asp:HyperLink ID="hlViewBasketItem" runat="server" Text="Detail"
NavigateUrl='<%# Eval("BasketItemID", "javascript:dnnModal.show('/BasketItemDetail.aspx?bid={0}&popUp=true',false,550,950,false)") %>'>
</asp:HyperLink>
...but I'm getting a "server tag is not well formed" error.
Is there a actually a way to do this?
This was the answer:
NavigateUrl=<%# "Javascript:dnnModal.show('BasketItemDetail.aspx?popUp=true&bid=" + DataBinder.Eval(Container.DataItem, "BasketItemID").ToString() + "')"%>
I can go to bed now :)
rather than using asp.net hyperlink add use html anchor tag and call java script function as follows:
//javascript function
<script>
function openPop(drp) {
window.open('/BasketItemDetail.aspx?bid='+drp+'&popUp=true', false, 550, 950, false);
}
</script>
// Anchor tag
Click Here

href link to trigger asp.net c# button event

I have a navigation bar consisting of list items. Right at the end of the nav bar I want a logout link:
//other links
...
<li>
logout
</li>
I have an event in my C# code called Logout_Click(object sender, EventArgs e) that I want to run when the user clicks the above navbar link, but obviously ordinary <a> tags don't trigger ASP.NET click events.
So I thought I'd be clever and create a HIDDEN <asp:Button> called logout that does trigger the Logout_Click function, and then get the JavaScript to click the button for me.. here is my code:
Log Out
<form runat="server">
<asp:Button ID="logout" runat="server" onclick="Logout_Click" Visible="false" />
</form>
But it still didn't work.
Can someone help me?
Try:
Log Out
Can you try without the Visible="false" on the asp:button?
And if it works hide it with css instead, style="display:none;"
I think the script needs the client side id of your asp.net control:
javascript:document.getElementById('<%=logout.ClientID').click()
Or you can use the __doPostBack function ...
http://wiki.asp.net/page.aspx/1082/dopostback-function/enter link description here
Why not you are using Asp.net LinkButton ?
It's easy to do this work with LinkButton.

Categories