Can I refresh a HTML component in JSP? I have two dropdowns. On selection of a value in the first dropdown the values in the dropdown box are to be fetched from the database. Is this possible using JSP?
First, JSP is just a view technology which provides a template to write HTML/CSS/JS in and offers facilities to interact with backend Java code using taglibs (like JSTL) and expression language (those ${} things). JSP runs at the server machine, produces a HTML page and sends it to the client side (if you rightclick page and view source in webbrowser, then you should not see any line of Java/JSP code if it has done its work right). JSP does not run at the client machine and can therefore not be directly used to do partial updates in the HTML page.
To achieve what you want, you need to use JavaScript to fire an asynchronous HTTP request (also known as the Ajax technique) to retrieve the data and manipulate the HTML DOM tree accordingly to add the new elements. Since methods to fire Ajax requests and manipulate the HTML DOM may differ among webbrowsers, I strongly recommend to pick the jQuery JavaScript library to keep it concise and simple without any worries about functioning in different webbrowsers.
I've posted an answer in detail about this before, check solution #3 in this answer.
Related
I am trying to have node red go to my router IP and search through the HTML code to see whether a certain device is on the list. When I right click - inspect I can hover over the list I am interested in and see the HTML information I am looking for. When I use the HTML node it seems to only look through the view page source information, which does not have what I am looking for. I there a way to point the HTML node at a more specific element instead of the page source as a whole?
It sounds like the data in the page on your router might be dynamically generated using JavaScript.
This means that when the page is loaded it only has the outline and the rest is filled in by the code using XHResquests to a different URL that supplies the information.
In order for Node-RED to be able to extract the information from the page it would need to load the outline, then effectively run all the JavaScript. Libraries like PhantomJS
There is a contrib node that might be able to help node-red-contrib-nbrowser but the better approach would probably be to work out what URL the JavaScript is calling and calling that directly as the data is most likely to be in a format that is easier to process (e.g. JSON)
I'm building a single page application using AngularJS. I want it to have a master detail appearance. Where there is a list on the side and a main view on the rest of the page showing the information for that list element.
I was wondering whether the correct way to approach this would be to use ng-route? Using ng-route I presume that I would have a url such as '/:elem' and a template url which then would display the information for that element using routeParams.
I'm having a bit of trouble just working out how all the server calls work. I have separate services for the API and the UI. So are the server calls like this:
The user navigates to my webpage and all the .html files are returned, including the template html files, but with no data apart from just the list of elements.
When the user clicks one of the elements, then another call is done to the server to retrieve the data for that element.
Thank you.
I am planning to design a web application with multiple HTML and JSP pages. The first page of myapp (index.html) loads up with the url
localhost:8080/mywebapp
without an explicitly pointing it to
localhost:8080/mywebapp.index.html
because web-xml has index.html in its startup script. Thats perfectly fine!
But how to toggle between multiple JSPs and HTMLs that are in the web app keeping the URL constant
localhost:8080/mywebapp
The user should not be knowing the navigation pattern when he is using the web-app.
Ideas on any frameworks or implementations are highly appreciated.
Thanks
Leaving aside the fact that you shouldn't do this, essentially what you have to do is bypass the standard routing method of your application.
You can do this one of two ways.
1) Use Ajax to call all the different URLs you need from within a single page. This will give you the single URL you're looking for though it doesn't of course prevent anyone from trivially working out what the actual navigation URLs are and unless you build a single page app and do some really evil interdependencies finding your navigation is trivially easy.
2) Your second option would be to create a single servlet which takes parameters which identify which part of your application you want to use. If you really wanted to be horribly evil you could hash those arguments with some form of per user short duration cookie so that even if they identify the actual web calls you're making running them manually won't actually work.
I would like to have a html form that will have the user input values, i.e. module ID for a DEMO, desired dimensions of the mask and which environment the demo should be loaded. Then from hitting submit a new page would pop up with the desired information filling in the rest of the link.
I hope this makes sense, if not I can try to explain more.
Try writing a dynamic web page where the link in the HTML is constructed on the server-side based on the information provided in your form on the previous page. Some popular dynamic web page languages are JSP, ASP, and PHP. Note that dynamic web pages have to be hosted on a web server.
I am not sure whether I got the idea of express MVC right:
If I want to make a single page app and dynamically change the HTML, is it something express can help me with? or do I get static pages that if I want to change I have to use front-end JavaScript?
To be more specific, the HTML (or Jade) templates can can change the HTML that is in the front-end somehow?
If I want to make a single page app and dynamically change the HTML,
is it something express can help me with?
Yes.
or do I get static pages that if I want to change I have to use
front-end JavaScript?
Yes, you will need to use JavaScript in the front-end to change the pages if you don't want to refresh the entire page.
To be more specific, the HTML (or Jade) templates can can change
the HTML that is in the front-end somehow?
Typically the HTML (or Jade) templates that you use in Express.js will produce the initial version of the page.
As the user interacts with the page on the browser (say the user clicks on a link or selects something from a dropdown list) your client-side code will submit an Ajax request to the server, Express.js will process this request and return JSON (not HTML) back to the client, and your front-end JavaScript will repopulate some data on the client. Keep in mind that at this point you won't be producing more HTML from the server, though.
Your Express.js could return HTML instead of JSON for these requests but that gets messy pretty quick so most people writing Single Page Apps chose to return JSON back to the client and use client-side JavaScript to repopulate whatever DOM elements need to be updated.