JSP dynamic dependent select box - java

I am looking for a method to create a dynamic dependent select box in a JSP, preferably something AJAX/JQuery based so I don't have to make a separate trip to the server. I am updating an internal auditing page for my organization and adding a feature to allow for a 're-audit'. The first select box is populated on page load and is listing of all employees and the second, populated dynamically, should be a listing of the previous audits for the selected employee.

Try something like this in your javascript (do not forget to import latest stable version of jquery),
$(document).ready(function() { //This will be triggered on page ready
jQuery.ajax({
type: "POST", //Passing data in post method
url: "ServletURL", //Servlet URL
data: "userId=" + $("#userId").val(), //Post if you need to send anything
success: function (response) { //Ajax success data
alert("Details loaded successfully!!!");
},
error: function (xhr, ajaxOptions, thrownError) { //Ajax failure data
alert(xhr.status);
alert(thrownError);
}
});
});
And process the userId in servlet and transfer the resulted data into any jsp page, where you can convert your result into the type either json or xml for your comfort. This data will be returned as response in ajax success.

Related

Not fetching dynamic dropdown using jquery spring mvc and hibernate

While click on an add button i have given the jquery code to navigate next page.
Here is my jQuery code:
$("#id-add-mer").click(function(){
location.href="../ecom/addMer";
});
here is my controller:
#RequestMapping(value = "/addMer", method = RequestMethod.GET)
public String addMerchant() {
return "merchantRegistration";
}
here it redirects to that page, but i have 3 dynamically fetching dropdown inside this page. i'm trying to fetch the values by adding an onload event in the body tag. here is my ajax code
function loadDropDown(){
$.ajax({
type: 'POST',
url: "ecom/loadInd",
data: {},
dataType: "json",
success: function(data) {
count = Object.keys(data).length;
$("#id-industry").empty();
for(i=0;i<count;i++){
$("#id-industry").append('<option value="'+data[i].id+'">'+data[i].type+'</option>');
}
loadBank();
},
error: function(jqXHR, textStatus, errorThrown) {
alert("1Server Exception");
}
});
}
i'm making an ajax call to fetch 2nd dropdown at the success of 1st call. while loading this page as welcome file displays the fetched dropdowns, i'm using spring mvc and hibernate to retrieve the records. But here i'm getting the error. Can anyone tell me how can i fix this issue..Thanks in advance...
Its better if you can mention here, what you get as error message in your code. Otherwise try to follow below steps to identify the issue.
First of all you better check whether your http request can access your server. you can use third party tools as well as built-in element viewer for that.
if there is no issue with communication with controller then check the what will return from "/loadInd". Simply you can debug or you can use alert box to inside success block.
Happy Coding....

Getting Temperature and Humidity from NOAA web api v2

The new NOAA api says that I need to put a token in the header for me to send request and it is giving me a token required error without it. I entered my email and received a token, but I am unsure on how to put it in a format that I can get a response.
Is there a way I can get a JSON response by posting all the information in the URL or do I need to make a html/php page? If I do need to create a web page, is there a library I can import that will allow me to get the JSON in java without the need for a webpage?
you do not need to import any library for accessing NOAA-API you can directly call it using token.
you will have to add your token in header if you are calling it through AJAX call.
open:- http://js.do/
1.add a script
Run this code using your token value.
<script>
function testjson(){
//alert("inside testjson");
jsontest = $.ajax({
type: 'GET',
url: 'https://www.ncdc.noaa.gov/cdo-web/api/v2/data?datasetid=GHCND&locationid=ZIP:28801&startdate=2010-05-01&enddate=2010-05-01',
//you can use different data-set values.
headers: {
Token: 'provide your token here'//example:'kxhfoJOtnEuxSNnMGMMSEITkmcsAFmFT'
},
// async: false,
dataType: 'json',
success: function (data) {
//Do stuff with the JSON data
alert(JSON.stringify(data));
jsontest = data;
console.log("data is: " + data);
},failure: function(){
alert("ajax failed");
}
});
console.log(jsontest);
//console.log(jsontest[0]);
}
testjson();
</script>

Extracting information from XML File

I have been trying to extract the information from this file for the past couple of hours and have run out of options.
http://www.nationalbanken.dk/dndk/valuta.nsf/valuta-hist.xml
Currently I have the information stored as a string in a Java servlet.
When I try to send it as a response to an AJAX request, I can't seem to extract any of the attributes through jQuery (mainly the time, currency, etc.)
I don't have a whole lot of experience with XML, actually none, so after trying various methods here on StackOverflow I have come to the conclusion that I simply can't find anything that'll work for me.
$("#btn").click(function() {
$.ajax({
url: "AjaxController?command=currency",
cache: false,
dataType: "xml",
success: processXML
});
});
This is my AJAX call to the servlet, in return it gives back the file linked above loaded into a string, which then needs to be processed and extracted by the jQuery function "processXML".

JSP - Testing document.body.offsetWidth

I need to test the browser window width in JSP, to determine whether or not I have to set a value in the request object. Typically I would achieve this with something like this:
if(document.body.offsetWidth < xxxx){
// ...
}
But I don't know how to do it with a JSP expression.
You might misunderstand that jsp and javascript existed on same file. Yes but JSP part compiles on server side itself comes to client.
You can't do that with JSP.
JSP compiles on serverside Where as javascript plays on browser i.e on client side.
Do it with javascript.You should do it in document load
when you do if(document.body.offsetWidth < xxxx) you are doing it at client side. Now if you want to propagate some client side value to server side i.e to some java class(most of the cases it will be servlets) then you have two options:-
1)Make an AJAX call. (You can also use jquery here to make AJAX call).
Here is the small example, you can find ample on google
$.ajax({
type: 'GET',
dataType: 'json',
data: { windowWidth: "100"}
url: servlerURL,
success: function(reply) {
},
error: function (xhr, textStatus, errorThrown) {
}
});
or
2)Submit the form

How to send and receive an ajax request with jQuery?

I am new to jQuery and am having trouble following the documentation. I have a variable in JavaScript (that I already obtained from an html form) that I would like to send using AJAX to the server. I want to the server to do whatever it needs to do with that value and then reply with either "success" or "failure" (I know how to do the backend part). How do I send the request and then receive the reply with jQuery?
To send the request you use the $.post or $.get function (or the $.ajax function if you want loads of control)
$.post('example.com/script', {
'param1':somaVar
}, function(data){
alert(data); //data is whatever the server returned
});
For both $.get and $.post the argument order is like this: (url, [data], [callback], [type]). Url is the url to which the request is done, data is the data with which the request is send, callback is a function that is executed when the request is complete. Type is the type of data the server will return (jQuery usually finds this out on itself) possibles are "xml", "html", "script", "json", "jsonp", or "text"

Categories