I have a pop up window which uses the following code to call an action method when a checkbox is checked:
window.location.href('#Url.Action("process", "wip")');
This works fine, but I also need the window to refresh itself when the checkbox is checked. So I added the following under the previous line:
window.location.reload(true);
But somehow this causes the first line to not call the action method at all. Are the two "window.location" lines tripping over each other or something?
Related
I have a function that shows or hides a button in relation to a value pulled from an API
I load a record with a parameter of 'id' ($stateParams.id)
If this value is 1 a button appears that fires a function that sets it to 0
If this value is 0 a button appears that fires a function that sets it to 1
These functions work fine however after the functions fire I want to reload the existing page but have the button change dynamically. If I leave the page and come back, or set state.go to any other page the button is changing no problem
I am using the following to try and reload the page after the function fires but nothing happens.. not even an error
$state.go($state.current, {id : $stateParams.id}, {reload: true});
Well... that was easier than expected. Just used
$state.reload()
i am trying to use the confirm method but for some reason the confirm window pops up several times. I googled and tried different things but unfortunately I can't get it running properly. The code is the following:
//user clicks on the delete button
$("#deletePopUpImage").click(function(){
console.log("deletePopUpimageCalled");
//get the id of the image
id = ($(this).parent().prop("id"));
//create the ajax request
data = "typ=function&functionType=deleteUserImage&id="+id;
//open the confirm box
var r = confirm("Are you sure that you want to delete this image?");
if (r == true) {
console.log("loadAjaxCAlled");
//Ajax call
loadAjax(data);
//hide the image and the loader
hideImagePopup();
} else {
//do nothing
}
});
The strange thing is that sometimes the confirm window pops up twice, sometimes three times and sometimes as expected once. That's why inserted the two console.logs.
"deletePopUpimageCalled" always appears just once. However "loadAjaxCAlled" appears several times.
In the success callback of the Ajax request I am just hiding the thumbnail div.
Do you know what's wrong with my code above?
Thanks
Stefan
Probably the code that attaches the event:
$("#deletePopUpImage").click(function(){...});
is invoked several times. Every invocation of .click(...) makes a new handler that fires when the button is clicked.
Some browsers stack up log the same entries into one (so the log doesn't extend so fast), that could be the reason you don't see "deletePopUpimageCalled" many times.
It would the best to check this by debugging it in the browser.
Ok I found the problem. In the Ajax success handler I set the div of the image, that was deleted, to display:none instead of deleting it. Thus divIds could occur twice, three times, etc. After changing the code to delete, it worked smoothly.
I'm executing the server action with p:commandButton. After those action is completed, I'm refreshing the form (to show hidden fields) and I show dialog. I've tried also to refresh only the panels with hidden buttons, but the effect was the same:
There is second refresh launched, after I call dialog.show(). The problem is, that the widgets defined inside the dialog and the dialog itself is not existing in the moment! So, when my JavaScript code runs too fast, before the post with update of the dialog finishes, I'm getting an exception, because the object I want to modify doesn't exist in DOM tree.
So my first question, is it possible to avoid such situation and second refresh, can't the dialog be refreshed along with page?
And second, if the first can't be answered, how can I launch my code after those second post finishes? I need simply a callback when refreshing of the dialog component will be completed, and than run my operations.
<p:commandButton id="doTask" value="Do task" widgetVar="doTaskButton"
action="#{service.doTask}" update="#form"
onclick="disableMainButtons()"
oncomplete="async.showAsyncDialog()" />
The HTTP sequence:
// button click
POST http://localhost:9080/myapp/order.xhtml 200 OK
// oncomplete launches dialog.show()
// I receive answer from COMET before the dialog to display it is shown
POST http://localhost:9080/myapp/channel/async 200 OK
// refresh triggered by dialog.show(), only now the dialog is shown and it's widgets are rendered
POST http://localhost:9080/myapp/order.xhtml 200 OK
The workaround, that isn't beautiful from programming point of view is to check if the dialog is rendered and if not, delay my procedure. In case the dialog is still not rendered, delay once again etc.
waitForDialogRendered: function() {
var visible = asyncDialog.jq.css('visibility') == 'visible';
if (!visible) {
setTimeout(waitForDialogRendered, 250);
return;
}
runComet();
}
Not that asyncDialog.jq.is(':visible') returns true even if dialog is not visible for user!
Still, I'd be happier without the need to write such code.
I have two webpages. Page 1 is a form on whose submit, page 2 is loaded through jQuery (calls a php page and returns the output on the same page1 without load). I have session variables maintained to ensure no breaching is done. However, in a particular scenario, I want page 1 window to close and hence I pass the following code as o/p from page 2.
echo '<div style="background-color:#ffa; padding:5px"><font color=red>Multiple sessions of the same page are open. Please close use the latest window for submission</font></div>';
echo '<script type="text/javascript">
function parent_close(){
parent.window.close();
}
setTimeout(parent_close,5000);
</script>';
however, it seems neither clicking the 'close' link closes the main window nor does the window automatically close in 5secs (which is what i actually desire)
Where am i going wrong?
The link should have a value in its href, not just an empty value, e.g:
href="#"
and not:
href=""
Also, the first argument to setTimeout should be enclosed in quotes, and you probably want the function to be invoked, not returned e.g:
setTimeout("parent_close()",5000);
You cannot close a top window through javascript, unless you have opened it with javascript also. Sorry, it cannot be done.
Try copying just the line
top.window.close();
to the console. run it and see what happens: nothing.
If you put a
console.log('here')
inside your parent_close function, you will see that the statement is executed...
I am writing a webapp using jQuery Mobile that calls a function to load records into localStorage and create a listview from a remote JSON file when the page is initially created (using the live.pagecreate() event for the page). At the beginning of this function is the jQuery Mobile method $.mobile.showPageLoadingMsg() and $.mobile.hidePageLoadingMsg() is at the end of the function.
On the initial pagecreate, the loading message does not appear (on iPhone 4 with iOS 4.3 Safari, Chrome 13 and Firefox 5). However, I also have a refresh button on the page; this button clears the associated records in localStorage then calls the same function used to initially populate the listview. However, when calling the same function from the refresh button the showPageLoadingMsg() and hidePageLoadingMsg() both work correctly and the Loading screen appears and disappears as it should. Am I missing something here?
ETA Here is the gist of the code (not in front of the actual code right now, if you need more I will put it in tonight). I also should mention that I've tried to put showPageLoadingMsg in (document).ready and have tried to bind it to mobileinit and neither have worked:
function loadListView(){
$.mobile.showPageLoadingMsg();
//ajax call to pull JSON
//$.each loop to load localStorage and listview
$.listview.refresh('list');
$.mobile.hidePageLoadingMsg();
}
$(#listpage).live('pagecreate', function(event){
loadListView(); // showPageLoadingMsg() and hidePageLoadingMsg do not work when the function is called here
});
function clearList(){
//for loop that clears each item in localStorage that matches the key prefix set in loadListView
}
//runs when refresh button is clicked
$('listrefresh').live('click',function(){
clearList();
loadListView(); //showPageLoadingMsg() and hidePageLoadingMsg() work when the function is called here
});
For these handlers to be invoked during the initial page
load, you must bind them before jQuery Mobile executes. This can be
done in the mobileinit handler, as described on the global config
page.
Docs:
http://jquerymobile.com/demos/1.0b2/#/demos/1.0b2/docs/api/events.html
Triggered on the page being initialized, after initialization occurs.
We recommend binding to this event instead of DOM ready() because this
will work regardless of whether the page is loaded directly or if the
content is pulled into another page as part of the Ajax navigation
system.
Example:
http://jsfiddle.net/phillpafford/mKn8Y/8/
In the example none of the live events fire on initial page load, you have to configure this type of action in the mobileinit:
http://jquerymobile.com/demos/1.0b2/#/demos/1.0b2/docs/api/globalconfig.html