I'm new to jQuery and am not quite sure how to do the following:
I'm using EasyUI TreeGrid and want to display dynamic data rather than providing static data from a .json file. Currently, the code I'm using is as follows:
$(function(){
$('#test').treegrid({
url:'treegrid_data.json',
and so on. Instead, is there any way I can pass an ArrayList or bean object or something directly?
Thanks in advance.
instead of getting the static json file.. point the url to a page where you are getting a dynamic value.. say dynamic.php
url:'dynamic.php',
....
and do your stuff like mysql connect.. or getting the dynamic datas in dynamic.php and return it as json....
dynamic.php
//do your stuff like getting dynamic datas in array..
$dynamicarray= $yourDynamicDataArray..
echo json_encode($dynamicarray);
this should do...
Figured it out...instead of pointing to a static json file, specify the url as url: 'dynamic.jsp' or url: 'dynamic.java' pointing towards a jsp or servlet respectively(since we are developing a web application). In that page simply get the json string, say, as an attribute and print it using out.println(jsonString). Do not include any HTML tags whatsoever or you won't get the desired output.
Related
In a property file at server side I'm maintaining a comma separated list of words.
words.for.js=some,comma,separated,words
I want to create a JavaScript array out of these words.
var words = [some,comma,separated,words];
I thought of two options
1.Using a JSP scriplet, create a global variable
<%
out.print("<script> var words = [");
out.print( PropertyLoader.getAsCommaSeparated("words.for.js") );
out.print(" ] </script>");
%>
2.Expose a service/ action (i.e. /getWords.do ) and call this using AJAX and construct the array.
I'm not sure which is better of the two and appreciate your thoughts here.
Or is there any better way to do this?
Thanks.
EDIT:
This is also a comparison of global JS variable (in case of option 1) vs additional http request (in case of option 2) - which one is worse. I would like to know your thoughts from this perspective as well.
I prefer embedding the server-side data within your JSP's markup - #1. It is faster and doesn't require a callback.
For me, it is all about the nature of the data. In your case, the data in that properties file seems unlikely to change without a server reboot. So, saving an additional network callback and embedding it into the markup feels appropriate for a global variable.
If you were dealing with some sort of dynamic data, an ajax callback onload would be better.
Exposing through an http request would be the most elegant option and would allow for refreshes. You are already counting on the browser having javascript, anyway.
Also, if the value is not dynamic, why not just serve a static javascript file with the array in the first place?
Why don't you use JSON? since all you need is to send some string to front end. Something like this:
String [] s = {"test","test1"};
JSONArray array = new JSONArray();
array.put(s);
request.setAttribute("test", array);
JSP
<script>
var array='${test}'
</script>
Update
You should place your configurations in servlet context as it's accessed throughout your web application including in jsp files & also will not change until you restart your application.
ServletContext context = getServletContext();
Properties prop= new Properties();
prop.load(context.getResourceAsStream("/WEB-INF/filename.properties"));
String[]configArray= prop.get("words.for.js").toString().split(",");
context.setAttribute("configArray", myConfigArray);
or if your using ServletContextListener
ServletContext ctx = servletContextEvent.getServletContext();
ctx.setAttribute("configArray", myConfigArray);
I am putting in changes to a tool we use, and I'm having trouble getting local javascript files to load in. The jquery library link works perfectly fine:
builder.append("<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script>");
But js files stored within the project seem to be returning blank pages.
builder.append("<script src='/SessionInfo/js/session.js'></script>");
The project uses a custom controller that routes requests based on the uri, heres a snippet:
if ( lowerCaseUri.matches("/sessioninfo/v1/userid/?") ) {
UserIDHandlerV2.handleUserIdPrompt(output);
} else if ( lowerCaseUri.matches("/sessioninfo/v1/userid/.*") ) {
UserIDHandlerV2.handleUserIdSessionListDisplay(request, output);
} else if ( lowerCaseUri.matches("/sessioninfo/js/.*") ) {
response.setContentType("text/javascript");
}
Looking at fiddler and chrome tools, it shows 200 responses returning the correct content type, but 0 bytes are transferred and in resources/scripts it shows blank pages.
I would suggest, get rid of the "custom controller that routes requests based on the uri," and use a URL Rewrite filter like Tuckey Urlrewrite Filter
Your problem is obviously that your custom controller doesn't work. For one thing, look at this:
else if ( lowerCaseUri.matches("/sessioninfo/js/.*") )
{
response.setContentType("text/javascript");
}
If there is a request for a javascript file, all you are doing with that request is setting the content type to javascript. You aren't reading the javascript file and serving it.
What you are doing is trying to build your own url-rewriting, and that's not necessary.
You could also just take /sessioninfo/js/.* out of your controller. I'm assuming these are just normal .js files, right? So why are you using a controller to route them? The purpose of a controller is when you need to put backend information on a view, so you send the user to the controller (i.e. a servlet) first and then controller sets request attributes and then forwards to a JSP that simply displays them.
Use HttpServletRequest#getContextPath to append those sources:
builder.append("<script src='" + request.getContextPath() + "/SessionInfo/js/session.js'></script>");
I want to know how to call a java method from HTML (I Use HTML5) using java script. I tried using Applets but this didnt work. I have to take the value of a drop down box in the html file and take it to a java method to process it.
What you are looking for is AJAX. It's extremely easy to do with a library such as jQuery
$.get('your/servlet').done(function(data) {
// data is the data returned by the request
});
Jabsorb implements this: http://code.google.com/p/jabsorb/
You will want to do this with a request to a servlet. Like ThiefMaster said, Ajax is a good way to go
Here's a quick article to get you started: http://javapapers.com/ajax/getting-started-with-ajax-using-java/
From current JSP I need to open new page with sending to it POST data. How I can make it?
In other words I need redirect from one page to another, but I cant use sendRedirect(because only GET) and requestDispatcher(because context of pages are different)
You have to create <form method="post">, fill the fields with respective data and submit it by JavaScript.
But on the other hand, what is your reason for that? There probably exists a cleaner solution.
Just make the behaviour that would happen if the initial POST data is received the default behaviour of the JSP when no post data is received.
e.g (in pseudo code - I don't know Java)
if (is_set(POST) ) {
if(POST == expectedInitialVals) {
defaultBahaviour();
} else {
handleOtherValues();
}
} else {
defaultBahaviour();
}
If you also want to persist the POST data in the page set the values on the relevant form fields in the page in your JSP.
I'm using jqGrid for a JIRA plugin and have included the jquery and jqgrid libraries as web resources.
I've set up a column in jqGrid as required and when I try to submit the form with the respective column empty I get an error in firebug: jQuery.jgrid is undefined
jQuery.jgrid is null but $.jgrid has the correct data.
Does anyone know how I can set up jqgrid so that it points to the $.jgrid without having to change all the source code? or any other way round this?
Thanks
That is really weird. Maybe this will work:
jQuery.fn.jgrid = $.jqgrid;
You should try that, but I'm really not shure if it will work.