Ajax integrating in Struts with jQuery - javascript

I am familier with jQuery,Ajax and JSP Servlets but new to Struts2.I want to know a complete reference of Ajax integration in Struts 2, preferred with jQuery. In stackoverflow also has more quesitons and answers, but still there are few things remaining to know.I need to know few things.
(1) Is there a complete reference how to use Ajax in Struts2 applications. struts2-jquery-plugin (and their showcase also) has many sample codes and demos. But I couldn't find how to handle it in Java classes.Their all samples found in itself are on client side- JSP samples only, no demo shows how the action classes work. No idea what the application returns(XML/JSON or what the server side returns) Their site demos only core functionalities. I want know how to how to handle both side; [in Struts framework] and [how to customize more struts ajax tags in JSP]. If there is any link or advice,it ll be highly appreciated.
(2)
I read Struts 2 In Action book. It has sample codes and demo.Its chapter 8 explains how to work with Ajax( used Actionsupport, another one extending Result class ... ). In Internet,few sample codes found, and they had used in some different way( directly PrintWriter print() the result). But in JSP side, normal javascript had been used. So, according to your best practises (may be more ways), what is your most preferred way to use Ajax? (that means,you use as jquery plugin shows or not depends on Struts ajax tags and just use javascript/jQuery in JSP pages, and the best practices to handle struts classes Write Result class or just use PrintWriter to print the result? Here you may say, it depends on the situation and the taste of the develoer, but what would be according to the industry standards?)
IF someone downvote. please leave a comment, WHY?

You should be using this jquery plugin instead; it is the closest thing the S2 project has to an official jQuery plugin. The one you link to isn't the same.
The most common way to return data to JavaScript (jQuery or not) is to use the JSON plugin or the REST plugin. There are very few reasons to ever write responses manually.

Related

Get access to Stackoverflow's auto-suggest tagging system?

Is there anyway to get access to stackoverflow's awesome tagging system? I would like to borrow Stack's awesome auto-suggest and tag mini-explanation boxes for my own site. Obviously, I can use the jQuery UI auto-suggest for tags but I would really like to also include the cool little tag descriptions as well. If not, can someone tell me where all these explanation/descriptions came from so that I can implement a similar system?
tageditornew.js
Line 308:
$.get("/filter/tags", {q: a,newstyle: !0}, "json").done(function(c) {
C["t_" + a] = c;
StackExchange.helpers.removeSpinner();
b(c)
})
This might help you out!
It turns out that,
the API url is this:
https://stackoverflow.com/filter/tags?q=STRING&newstyle=BOOLEAN
q - Query text.
newstyle - Require new style or not. Result in new style will be returned in JSON with additional information such as synonyms and excerpt.
DEMO: http://jsfiddle.net/DerekL/bXXb7/ (with Cross Domain Requests jQuery plguin)
For example:
https://stackoverflow.com/filter/tags?q=htm
would give you:
"html|99829\nhtml5|16359\nxhtml|4143\nhtml-parsing|1461\nhtml-lists|1328\nhtml5-video|949"
where 99829 is the amount of questions. It took me 15 minutes looking at the source code to find out this api. -_-"
Putting in javascript in new style gives you this: here
[{"Name":"javascript","Synonyms":"classic-javascript|javascript-execution","Count":223223,"Excerpt":"JavaScript is a dynamic language commonly used for scripting in web browsers. It is NOT the same as Java. Use this tag for questions regarding ECMAScript and its dialects/implementations (excluding ActionScript and JScript). If a framework or library, such as jQuery, is used, include that tag as well. Questions that don't include a framework/library tag, such as jQuery, implies that the question requires a pure JavaScript answer."},{"Name":"javascript-events","Synonyms":"javascript-event","Count":5707,"Excerpt":"Creating and handling JavaScript events inline in HTML or through a script."},{"Name":"facebook-javascript-sdk","Synonyms":"","Count":992,"Excerpt":"Facebook's JavaScript SDK provides a rich set of client-side functionality for accessing Facebook's server-side API calls. These include all of the features of the REST API, Graph API, and Dialogs."},{"Name":"javascript-library","Synonyms":"","Count":675,"Excerpt":"A JavaScript library is a library of pre-written JavaScript which allows for easier development of JavaScript-based applications, especially for AJAX and other web-centric technologies."},{"Name":"javascript-framework","Synonyms":"","Count":563,"Excerpt":"A JavaScript framework is a library of pre-written JavaScript which allows for easier development of JavaScript-based applications, especially for AJAX and other web-centric technologies."},{"Name":"unobtrusive-javascript","Synonyms":"","Count":340,"Excerpt":"Unobtrusive JavaScript is a general approach to the use of JavaScript in web pages."}]
What you can get from there:
All tags start with javascript
Synonyms
Tag counts
Nice tag descriptions
If you're looking for high-level logic, in a nutshell it's just a custom auto-complete that's blazing-fast.
Whenever you type a tag (i.e. a new word or one separated by a space from previous tags), an AJAX request would be made to the server with a JSON object which is then interpreted by the client-side script and presented in the usable layout.
Comparing the autocomplete JSON objects for letter "h" and word "html" should give you enough insight into how this particular implementation works (if prompted, these can be opened with any text editor).
On a somewhat unrelated note: the autocomplete responses have to be fast. Depending on the complexity of the data autocomplete is run against, you may find how IMDb magic search works intriguing.
Update:
Seeing your comment about accessing the content of the tag library, this may in fact be more of a meta question. I struggle to think of a scenario where using an API if any or just the tag library from an external resource would be beneficial to SO - however content here is provided under Creative Commons so you may be able to use it with proper attribution. This does not constitute legal advice :)

Execute Javascript coming from dojo.xhrGet in symfony

I am new to dojo and somewhat new to symfony as well and am having a wee problem here: I want to reload a part of my page using Ajax but it includes a Javascript which needs to be executed. This isn't reallly a problem in prototype or Jquery but I just can't figure it out in dojo. (I need to use dojo because it's a part of symfony and already in heavy use on the page I'm supposed to modify. I also know this is probably improped technique but it's just a little mod I need to do and this would be the easiest way ...)
Can you help??
Thanks,
thomas
You can do it by using dojo's require tool
For more information regarding this, take a look at the documentation
dojo.require("my.path.to.file", false, true);
Call this when you want to load the javascript file, mostly after the ajax request is complete. So that if this javascript is to alter/perform some operations on the ajax loaded content placed into DOM, you won't get NOT_FOUND dom exception.

Using Javascript on Ruby on rails

I am trying to use update some calculations everytime a person modifies a text field. I have many question about how to know the id text field, how to store it in a variable, etc. I am a newbie with ruby and javascript and there are many questions. Could you please tell me where I can find more information that explains step by step how to proceed with this?
Thank you very much.
I highly recommend using jQuery with Ruby on Rails... it makes this sort of thing much easier, and is going to be the standard as of the next version (3.1).
In jQuery, you do something like:
$('#my_field').change(function() {
$('#result').val(function() {
do something...
});
});
And you can use a js.erb template to embed Ruby in the JS to get data from the controller. Ryan Bates' Railscasts series has several examples of using Javascript in RoR for dynamic content.
Also, NetTuts+ has this tutorial for using Unobtrusive JavaScript in Rails 3.

HTML that's both server-side and javascript generated - how to combine?

I'm usually a creative gal, but right now I just can't find any good solution. There's HTML (say form rows or table rows) that's both generated javascript-based and server-sided, it's exactly the same in both cases. It's generated server-sided when you open the page (and it has to stay server-sided for Google) and it's generated by AJAX, to show live updates or to extend the form by new, empty rows.
Problem is: The HTML generation routines are existing twice now, and you know DRY (don't repeat yourself), aye? Each time something's changed I have to edit 2 places and this just doesn't fit my idea of good software.
What's your best strategy to combine the javascript-based and server-sided HTML generation?
PS: Server-sided language is always different (PHP, RoR, C++).
PPS: Please don't give me an answer for Node.JS, I could figure that out on my own ;-)
Here's the Ruby on Rails solution:
Every model has its own partial. For example, if you have models Post and Comment, you would have _post.html.erb and _comment.html.erb
When you call "render #post" or "render #comment", RoR will look at the type of the object and decide which partial to use.
This means that you can redner out an object in the same way in many different views.
I.e. in a normal response or in an AJAX response you'd always just call "render #post"
Edit:
If you would like to render things in JS without connecting to the server (e.g. you get your data from a different server or whatever), you can make a JS template with the method I mentioned, send it to the client and then have the client render new objects using that template.
See this like for a JS templating plugin: http://api.jquery.com/category/plugins/templates/
Make a server handler to generate the HTML. Call that code from the server when you open the page, and when you need to do a live update, do an AJAX request to that handler so you don't have to repeat the code in the client.
What's your best strategy to combine the javascript-based and server-sided HTML generation?
If you want to stay DRY, don't try to combine them. Stick with generating the HTML only on the server (clearly the preferable option for SEO), or only on the client.
Make a page which generates the HTML on the server and returns it, e.g.:
http://example.com/serverstuff/generaterows?x=0&y=foo
If you need it on the server, access that link, or call the subroutine that accessing the link calls. If you need it on the client, access that link with AJAX, which will end up calling the same server code.
Or am I missing something? (I'm not sure what you mean by "generated by AJAX").
I don't see another solution if you have two different languages. Either you have a PHP/RoR/whatever to JavaScript compiler (so you have source written in one language and automatically generated in the others), or you have one generate output that the other reads in.
Load the page without any rows/data.
And then run your Ajax routines to fetch the data first time on page load
and then subsequently fetch updates/new records as and when required/as decided by your code.

Using an HTML snippet for a template in JavaScript (jQuery)

I currently am working on a little app that requests user info from my server and displays them using a special template.
At first, I just hardcoded the little snippet in jQuery:
$("<li><div class='outer'><table><tr><td rowspan=2 class='imgcontainer'><img class='thumb'/></td><td><span class='username'/></td></tr><tr><td><span class='name'/></td></tr></table></div></li>")
I clone it several times.
It's ugly and I want it to have syntax highlighting and whatnot, so it would be better for me to have it in the HTML file itself.
Also, it will make merges easier so somebody can just change a line or two.
Is there a pattern for this? Am I OK putting it in the HTML file that I include this JS in (there's only one), and making it hidden using CSS.
The third option I thought of is just creating a separate HTML file and having jQuery request that from the server to keep it separate. Is this technique used much?
Also, is there any term I can use to describe what I'm doing? (It's harder to ask a question for a concept I don't know the name for)
I gave a similar answer on SO earlier today. What you are looking for is called micro-templates. John Resig posted this on his blog. Essentially you can get a json dataset and apply a template to the data to create html and update the DOM.

Categories