Hi I am working on a webbased application with JSPs and servlets. I have a page which has a button in it. I have written some javascript to pop-up a small window when the button is clicked and also it invokes the doPost method. The code is something like this --
]
"<form name='downloadFrm1' method='post' action='S2VServlet'
.. ..
"<input name='submitBtn' type='submit' value='Download Files With Warnings' onClick="+popup+">\n"+
"</form><BR></div><p><BR></p> \n";
However, I invoke the doPost method only to do some internal work. I don't want the parent page to be redirected anywhere. But what is happening is that when I click on the button the small popup window appears but the parent page also moves to a blank page. How can I make the parent page stay as is and not get redirected ? The code for doPost is something like ths--
public void doPost(HttpServletRequest p_req, HttpServletResponse p_res) throws IOException, ServletException {
try {
String downloadKey = p_req.getParameter(DOWNLOAD_KEY_ELEMENT);
....
if (//put my condition)) {
//just set some internal value and return
....
return;
}
You can't do it without ajax (javascript). The standard request/response cycle requires a change in the page.
Take a look at jQuery. You can do $.post("S2VServlet", {param:param}) which will execute in the background.
I think you can end your doPost method doing doGet. Doing so will "repeat" the page, but the user thinks he/she has not moved.
Related
I'm trying to display some information on an HTML web page when the viewer loads the web page. I have a function, called getID(email), that returns an integer. I know that this works, as I've tested with console and it works properly. My issue is being able to display the return of getID() onto the web page when the page loads.
I know that I have to use document.getElementById('div id goes here').innerHTML('content goes here'); to change what a div says, but for the life of me I can't get the actual information.
Here's what I have:
<div id='output'>
</div>
<script>
function showId() {
var id = google.script.run.getId(Session.getActiveUser().getEmail());
document.getElementById('output').innerHTML(id);
</script>
I have no idea how to make this run when the HTML page is loaded. Help is appreciated!
You can just put the script on the bottom of the page and call the showId function:
<script>
// you can define showId here
showId();
</script>
If you can't put the script at the very end or you expect to be using other scripts and want to only execute after everything is loaded you can just wait for the DOMContentLoaded event:
window.addEventListener('DOMContentLoaded', function() {
function showId() {
// ...
}
showId();
});
In CakePHP 2.x, i use this path to show results to visitors
example.com/my/showResults
*getSomeResults* function makes some Twitter API requests which lasts generally 5-25 seconds.
I need to put a "loading div" into my view.
But i couldn't decide the structure.
The examples i found by google shows, when user clicks a button, an AJAX request is made and results are shown in that div.
But in my case, when the page is loaded that request will be done asynchronously, when results are available, they will be shown in another div.
Regarding to my file structure below, where should i put AJAX request?
Should i remove lines in showResults method and run another action when AJAX request will succeed?
I would be happy if you can recommend a structure for, show results when AJAX request is succeed in CakePHP 2 way. Thank you
// appcontroller.php
class AppController extends Controller {
function getSomeResults() {
// make some http requests to twitter API
}
}
// mycontroller.php
class MyController extends AppController {
public function showResults() {
$data=$this->getSomeResults();
$this->set('data', $data);
$this->render('myelement');
}
}
// myelement.ctp
<div id="before">
Please wait loading..
</div>
<div id="results" style="display: none">
<?php echo $data ?>
</div>
// myscript.js
$(document).ready(function() {
$("#results").hide();
setTimeout('$("#results").show();',8000);
}
It looks to me, like you are grabbing the web service and then handing off the data through cakephp. Meaning it does not look like you are using ajax at all.
Since you appear to be using jquery already I would recommend that you connect to twitter using jquery's ajax method [http://api.jquery.com/jQuery.ajax/]. So not only would you remove showResults(), but you would also remove getSomeResults(). If you needed this info to be refreshed you could set this ajax call into a function and call it on a regular interval.
Unless you had the div for loading at the top of the page, you could use jquery to change the results div from now loading to the data.
Just my 2 cents.
I have something like this :
SplashPage -> MainPage -> Settings -> About
SplashPage is only page with my logo and animation for about 1 second, and then I redirect my user to MainPage. First problem was that when I press back button on MainPage, I'm back to splashpage and that wasn't good. I solved that by this piece of code :
private bool navigateBack;
public SplashPage()
{
InitializeComponent();
navigateBack = false;
}
protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)
{
if (navigateBack)
{
this.NavigationService.GoBack();
}
else
{
navigateBack = true;
base.OnNavigatedTo(e);
}
}
This way on back button press, user never see splashpage again, but I have weird problem. Application is throwing Navigation Exception that CanGoBack property is false and application exit. It's true, that I want to exit from app, but not using exception, because I will fail certification in marketplace.
My question is how to navigate back from MainPage and exit application, but with no exception thrown. Thank you in advance!
Introducing a separate page for your splash screen introduces more problems than it solves (as you're finding out), so I'd reccomend using an overlay on your main page instead. I [posted about using splash screens and this very situation a while back.
Read the following for background on this scenario and how to approach it:
http://blogs.msdn.com/b/ptorr/archive/2010/08/28/introducing-the-concept-of-places.aspx
and
http://blogs.msdn.com/b/ptorr/archive/2010/08/28/redirecting-an-initial-navigation.aspx
in Mango you can use
NavigationService.RemoveBackEntry()
to remove a page from your page stack, i.e your splashpage as soon as you hit your MainPage
so if you have your splashpage to mainpage you would call the function twice
the first time to remove MainPage from the page stack and the second time to remove SplashPage from the page stack, you will notice that when you press the back key now you will close the app
I'm trying to develop (for the moment!) a simple chrome extension using the message exchanging API.
My contentscript ask the background page for its url, and wait the background answer.
However, my contentscrpt never get the answer. Why? Thanks for your answer.
content_script.js
/**
* Retrieve the url or the page currently visited.
*/
chrome.extension.sendRequest({'action' : 'getUrl'}, function(response) {
alert(response.url);
});
background.html
...
function onRequest(request, sender, callback) {
sendResponse({'url' : sender.tab.url});
};
chrome.extension.onRequest.addListener(onRequest);
Your onRequest function has the final parameter named callback, but you call sendResponse in it. Assuming this is what your actual code looks like, you'll need to make the two names the same. If you inspect the background page in the developer tools, you should see a JavaScript exception about sendResponse being undefined.
In Google Chrome's extension developer section, it says
The HTML pages inside an extension
have complete access to each other's
DOMs, and they can invoke functions on
each other. ... The popup's contents
are a web page defined by an HTML file
(popup.html). The popup doesn't need
to duplicate code that's in the
background page (background.html)
because the popup can invoke functions
on the background page
I've loaded and tested jQuery, and can access DOM elements in background.html with jQuery, but I cannot figure out how to get access to DOM elements in popup.html from background.html.
can you discuss why you would want to do that? A background page is a page that lives forever for the life time of your extension. While the popup page only lives when you click on the popup.
In my opinion, it should be refactored the other way around, your popup should request something from the background page. You just do this in the popup to access the background page:
chrome.extension.getBackgroundPage()
But if you insist, you can use simple communication with extension pages with sendRequest() and onRequest. Perhaps you can use chrome.extension.getViews
I understand why you want to do this as I have run into the problem myself.
The easiest thing I could think of was using Google's method of a callback - the sendRequest and onRequest methods work as well, but I find them to be clunky and less straightforward.
Popup.js
chrome.extension.getBackgroundPage().doMethod(function(params)
{
// Work with modified params
// Use local variables
});
Background.html
function doMethod(callback)
{
if(callback)
{
// Create/modify params if needed
var params;
// Invoke the callback
callback(params);
}
}
As other answers mention, you can call background.js functions from popup.js like so:
var _background = chrome.extension.getBackgroundPage();
_background.backgroundJsFunction();
But to access popup.js or popup.html from background.js, you're supposed to use the messages architecture like so:
// in background.js
chrome.runtime.sendMessage( { property: value } );
// in popup.js
chrome.runtime.onMessage.addListener(handleBackgroundMessages);
function handleBackgroundMessages(message)
{
if (message.property === value)
// do stuff
}
However, it seems that you can synchronously access popup.js from background.js, just like you can synchronously access the other way around. chrome.extension.getViews can get you the popup window object, and you can use that to call functions, access variables, and access the DOM.
var _popup = chrome.extension.getViews( { type: 'popup' } )[0];
_popup.popupJsFunction();
_popup.document.getElementById('element');
_popup.document.title = 'poop'
Note that getViews() will return [] if the popup is not open, so you have to handle that.
I'm not sure why no one else mentioned this. Perhaps there's some pitfalls or bad practices to this that I've overlooked? But in my limited testing in my own extension, it seems to work.