We Keep Coding

how to prevent close dailogbox pop up when close dialog and refresh

Hi it is very simple question, but I didn't find the answer fit in my situation.
In my jQuery dialog I have buttons which is update and close. User click 'update button' then on code behind I need to update in database then close.
when user click the close button then I close the dialog. the dialog is load aspx page. I have two problems.
The problem is if user click close button which run javascript window.close(). It will pop up the windows "Do you want to close window...."
How can I refresh the parent page and close the dialog by clicking the 'update' button.
there is the code to load the dialog:
function openDialog(url, name, width, height) {
$("#dialog-box").load(url).dialog({
autoOpen: false,
resizable: true,
height: 425,
width: 600,
modal: true
});
$('#dialog-box').dialog('open');
return false;
}
I tried to use $("#dialog-box").dialog("close"); in my function which is called in code behind. but it show the error.
there is my function
function RefreshParentAndClose() {
$("#dialog-box").dialog("close");
}
there is the code I load the dialog on parent page
<div id="dialog-box" title=" "></div>
<td width="33%" align="right"><asp:button id="btnSelect" runat="server" causesvalidation="False" text="Select Locations"
OnClientClick="javascript:return openDialog('popLocation.aspx','select',600,500);" /></td>

Use below code for close
$("#dialog-box").dialog( "close" );
and to refrsh on close use
$("#dialog-box").dialog({
close: function( event, ui ) {
window.location.reload();
}
});

1) You could close the dialog by invoking its close() method:
function OnCloseClick() {
$("#dialog-box").dialog("close");
}
2) You just need to refresh the main page. On the subsequent load the dialog should not be opened (in case you do not load it automatically). More information about the method's parameter used below could be read from this answer on StackOverflow.
function OnUpdateClick() {
window.opener.location.reload(false);
}

Magnificent popup inside popup

In my project I'm using magnific popup. I need to actualize 2 popups (one inside another) with different options. First with only closeOnBgClick and second with both: closeOnBgClick and closeOnContentClick.
$('.popup-with-form').magnificPopup({
type: 'inline',
preloader: false,
closeOnBgClick: true
});
$('.popup-content-click').magnificPopup({
alignTop: true,
type: 'inline',
preloader: false,
modal: true,
closeOnBgClick: true,
closeOnContentClick:true
});
Here you can see what I mean: http://jsfiddle.net/pamjaranka/p1u2xdun/3/
The problem is, the second pop up is ignored it's options and used the same options as the first pop up. For clarity I added 'alignTop: true', which is also doesn't work.
Is there any possibility to fix it?
Thanks for help.

appears that once the popup is opened you need to close it and then call the second pop-up open method, otherwise the settings from the first one precede, thus, the overlay always closes the pop-up. Here is a brief change I made in your JS code:
// Assign on click behaviour to the button in the first pop-up
$('.popup-content-click').on('click', openPopup);
// on click handler
function openPopup(){
//Closing the already opened pop-up
$.magnificPopup.close();
//wait a bit then open the new pop-up
setTimeout(function(){
$.magnificPopup.open({
items:{src: '#result-again'},
type: 'inline',
closeOnBgClick: false,
closeOnContentClick:true
});
}, 100);
}
Here is the jsfiddle for that

On Asp.net page why jquery close button not working

I work with an Asp.net and C#. When I click on a button to show the message I get one popup box, but when I click close button on popup box it’s not closing the popup.
aspx page syntax:
<div id='dialog-page' title="Modal">
</div>
<asp:LinkButton ID="lbtnModal" runat="server" Text="View" OnClientClick="javascript:return showDialog(this.name);"></asp:LinkButton>
jQuery code:
function showDialog(uniqueName) {
var url = "ReportGenerationSingleACView.aspx?id=";
var temp=document.getElementById('<% =txtCustomerID.ClientID%>').value;
url=url+temp;
$("#dialog-page").load(url).dialog({
title: "AC View Details",
autoOpen: false,
resizable: true,
height: 400,
width: 600,
modal: true,
buttons:
{
Close: function() {$(this).dialog("close");}
}
});
$('#dialog-page').dialog('open');
return false;
}
Here is some more information about the popup work but those not work for me:
Stack Overflow question: jQuery Pop up not working
Why is it not working for me? How to handle or what am I missing? Help me solve this issue.
If have any questions, please ask - thank you in advance, any type of suggestion will be acceptable.
Note: Popup X icon works properly and close button also fired but popup not close

Be sure that {$(this).dialog("close");} targets on the dialog. So you try to close the dialog in your dialog and there are none.
Try out {$(parent).dialog("close");} instead or pass the function to the parent page.

Relative Pathing in jQuery Load function in UI Dialog

I'm using the .load() function to load an .aspx page into my jQuery UI Dialog, which works fine. The issue is that the page being loaded is in a different directory than what the dialog open call is coming from and when i try to hit my 'submit' button from that newly loaded page it can't find the 'search.aspx' path because it's looking in the original path.
Basically:
ucEasyFill.ascx contains the div declaration, and the link to open the modal popup. this is located in the forms/UserControls/ folder;
<div id="modalSearchWindow" style="display:none;" class="MODAL_SEARCH_WINDOW"></div>
<img id="imgClearClient" src="images\clear.png" class="efIMG" />Clear </a><img id="imgSearchMag" src="/applications/images/search_mag.gif" class="efIMG" />Find
ucEasyFill.js contains the dialog declaration within the document.ready function in forms/scripts/ folder;
MODAL_SEARCH_WINDOW = $("#modalSearchWindow").load('EasyFill/Search.aspx').dialog({
position: "center",
autoOpen: false,
resizable: false,
autoResize: true,
draggable: true,
modal: true,
width: 580,
height: 450,
dialogClass: "MODAL_SEARCH_WINDOW",
closeOnEscape: true,
open: function (event, ui) {
$('.MODAL_SEARCH_WINDOW .ui-dialog-titlebar').each(function () {
$(this).css("display", "none");
});
}
});
When 'Search' is clicked on forms/EasyFill/Search.aspx page i receive the 404 error of;
POST http://localhost/applications/forms/Search.aspx 404 (Not Found)
which makes sense to me since the dialog is being loaded from the /forms/ directory and not from the forms/easyfill/ directory. Really my question is how do i get around this? I am only trying to do this because of the new deprecation of showModalDialog() in Chrome 37

Since you're loading the file from forms/UserControls/ucEasyFill.ascx, you need to go up a level to get into forms/EasyFill. So it should be:
MODAL_SEARCH_WINDOW = $("#modalSearchWindow").load('../EasyFill/Search.aspx').dialog({

Stop multiple Dialog windows being opened

I'm trying to make a ajax call for the partialview of my webpage, then pull title and data from it before putting it in a Dialog window. However when I create the dialog, it opens once correctly and 6 more times as an empty Dialog - just the title bar.
In chrome I can see the partialView contains the HTMLDivElement, and 7 HTMLScriptElements so that accounts for the multiple opens - however if I open the Dialog for just that div element it will not load the scripts (and thus lookups and tabs do not work).
$.ajax(url)
.success(function (partialViewHtml) {
// get page data
$(partialViewHtml).dialog({
title: title,
modal: true,
resizable: true,
draggable: true,
height: sheight,
width: swidth
});
Any help would be greatly appreciated. I've been banging my head on a wall for a while. Thanks.

As you seem to have understood, this is normal because of the 7 elements in the jQuery collection on which you open the dialog.
You should add the script elements separately to the page, using for example
$('body').append(scriptElementHTML);
And then open your dialog on just the div :
$(divHtml).dialog({

Not sure whthere jQuery ui has a method to close all dialogs, but we can do it like this
function createDailog () {
$(".ui-dialog-content").dialog("close"); // close all dialogs
$("<div>fdfdsfdsfdsfds<div>").dialog({
title: "title",
modal: true,
resizable: true,
draggable: true,
height: 200,
width: 200
});
}
or you can put a condition like this
if(!$(".ui-dialog-content:visible").length){
// show dialog
}