Help w/ JSF vs. JavaScript+CSS+DHTML debate

Hello,
I need to quickly obtain some facts to help guide the direction of a new project.
The entrenchment here seems to lean toward JavaScript, CSS, and DHTML to provide client-side validation and presentation enhancements. Personally, I am more receptive to JSF but I am in unfamiliar territory when it comes to web technologies.
I need to know how JSF compares with using JavaScript, CSS, and DHTML. Does JSF alleviate the need for these technologies? I have a lot of information on why JSP Model2 is better on the server-side but I am really needing some data on the client-side presentation aspects (validation, sexy widgets, etc).
Thanks in advance for anything anyone would like to share.

Thanks erikbuchez. So would it be correct to say that
the JSF HTML (or is it HTTP) components are
implemented with JavaScript/CSS/xHTML? In a way, yes. JSF defines a set of Standard User Interface Components, a Standard HTML RenderKit for those components, and a Standard HTML RenderKit Tag Library. The components, RenderKit and tag library are implemented in Java and run on the server, but together they end up generating HTML/CSS/JavaScript interpreted by your Web browser.
As a follow up, I assume one can override/extend the
existing components or create new ones as needed by
extending some appropriate base class?Yes, you can derive from existing components and renderers or create your own (in Java).
If I'm getting the idea here, you use the expression language in
your JSPs and make use of the template library to get the nitty
gritty stream back to the browser?Not sure what you mean here, but if you mean that you write JSP pages using JSF tag libraries and let JSF generate the HTML/CSS/JavaScript back to the client, you are right.
-Erik

Similar Messages

Adobe DPS HTML/Javascript/CSS Web Console: why it is so difficult?

Why?
This is the type of question that i can not understand. Is it that difficult to make? Maybe an airpor to Google Chrome Adobe Edge Inspect? I have many files well written with CoffeeScript, that uses RequireJS, that is impossibile to forget a semicolon etc. that works like a charm on Google Chrome (desktop, AND Chrome iPad, AND Chrome Android). That works like a charm in the native iPad/iPhone web browser and in the native Android browser. But it didnt in Adobe DPS. And guess what: i cant find why it doesnt, because Adobe doesnt have a simple Web Console inside DPS / InDesign.
Is there any news on this field? Because using Adobe Edge Inspect is not a option: my code works inside EI because im browsing the page with my desktop browser. I want to know what is going on inside DPS.
And my code it is not "soooo" advanced. It is just a simple button with "on touchstart" event listener. Am i doing some stupid error? Fine! Just help me find out what it is, so i can fix it. Because in every single browser i tried, it works. But inside DPS. A sample code? Sure, here you go:
[Javascript Code]
Main.prototype.clicks = function() {
        var _this = this;
        $('#btnA').on('touchstart', function(evt) {
          evt.preventDefault();
          _this.buy('productA');
          return false;
        $('#btnB').on('touchstart', function() {
          return _this.buy('productB');
        return $('#clear_data').on('touchstart', function() {
          return _this.clearData();
[/Javascript Code]
The Javascript above is being generated by Node.JS compiling a CoffeeScript file. The buttons do work at DPS for iPad, but doesnt on Android. Maybe Android has a problem with 'touchstart'. Maybe jQuery has a problem inside Adobe DPS. But who knows? I dont have a decent web console inspector to check what is going on. Really frustrating.
Maybe Apple and Google dont give the neccessary hooks to implement the web console? But if you can do the Inspector from the desktop to the device, why not from the device to the desktop? Am i missing something on Edge Inspect? The strange part is: the above code works well on Edge Inspect but doesnt work on Android DPS.
Sorry if im a little angry or pissed. But this would be really great: a simple web inspector: HTML, Javascript, CSS. A way to inspect the <head> tag of the HTML, what was loaded, in what order. What script is missing, Javascript breakpoints, etc.
Thank you.

There is this one little widget called Safari Web Inspector, provided that you're using a Mac: https://developer.apple.com/library/safari/documentation/AppleApplications/Conceptual/Safa ri_Developer_Guide/Introduction/Introduction.html.
Besides, referring to http://helpx.adobe.com/digital-publishing-suite/kb/create-html-articles-android-viewers.ht ml, you can give window.onappear a try when you are doing JS initialization.

Configuring Custom JavaScript/CSS and YUI in WSRP Producer Portlet

I am trying to find information on how to setup/configure WebCenter for WSRP Producer Portlets that have YUI and custom javascript/CSS. While we have gotten some of the YUI features and custom javascript/CSS to work, we find that some references are not loading such as custom CSS and images. This appears to be a result of the URL rewrite not occuring for some of these references. It appears that WebLogic Portal supports this capability and can be configured using a dependency file for such needs but I have been unable to find a equivalent for WebCenter.
Any help would be greatly appreciated.
Best Regards.
Carl

When you are providing javascript or css path,provide the absolute path.
like src="http://<server>:<port>/portlet context root/images/some.png".
In that way custom javascript/css will work.
Regards,
Hoque

Aperture 3 Help says it needs Javascript

I've just downloaded the A3 trial onto my MBPro with Leopard 10.5.8. I pulled down the help menu and it says the Help needs to have Javascript enabled.
Where do I enable it? It is enabled in Safari.

I know someone already mentioned the online version, but it would be helpful to know if the people having this problem are able to use the one online. I'm not having any problems with Help so I can't test it.
http://documentation.apple.com/en/aperture/usermanual/
Also, are you using Safari 3 or 4?
http://www.apple.com/safari/download/
DLS
Message was edited by: MacDLS

Can't submit JSF using Javascript

I apologize if this is an obvious newbie question.
I have a simple JSF page with a component users can click on to select a number. Using Javascript, I populate a textbox with the number they select, then attempt to submit the form, also using Javascript. But this doesn't work.
The form submits and returns as though the user had submitted without a value in the textbox, and then their number appears in the textbox (it should be empty at this point).
The form works fine if I use Javascript only to set the value in the textbox and require the user to manually press the Submit button.
TIA for any help!

Sorry, this is in the wrong place (and I can't find a way to delete it). Please ignore.

JSF and JavaScript

As far as I can see JSF is just a non-portble more verbose version of HTML which just generates a subset of HTML more slowly and with extensive studying a new HTML-like language.. It seems to add nothing, take away a lot, and double complexity.. But that is not important.. Why would web developers want to load the server with validation code when JavaScript in the Browser can increase performance by a factor of 100.. Shouldn't we be striving to use JavaScript in the Browser to enrich and speed up the user experience instead of cutting that avenue off and reinventing an even more clunky and obscure wheel? Is there anyway to have a "tabbed pane" which doesn't rebuild an entirely new page and send it back to the client? Similarly, do any of the implementations encourage client-side validation of simple form inputs using Javascript. Java seems to be being taken over by people with IQs hovering around 100.. I have never understood where most of the J2EE expeditions do anything for Comp. Sci. except reinvent a slower more obscure less portable version of something already a standard..

Troa, my website has been moved and I need to work on it to get it working again.. I have the source code but I think that would just be confusing.. Basically, there are buttons which call a Javascript function with onClick().. The function shows a form with stuff like this
function show(formname)
formEl[oldform].style.display = "none";
var form = formnum(formname);
formEl[form].style.display = "block";
oldform = form;
and some other DHTML using the newer browser Javascript to just hide a form of components and display another one.. All the components are downloaded at the start.. The buttons just hide and disply..
As for 1000s of records in tables, it works beautifully if you zip the data as a javascript array.. When the next button is pressed another Javascript function renders the HTML for a page.. It is less network traffic than one page of a normal table.. I'll get it back up working soon and point you to it and the source code.. I just need to install Sun Web Server on my Website, but it is very small in terms of disk size..
Maybe you should send me your email so we are not filling the forum with personal communication.. My email is [email protected]

Please help with some basic javascript syntax

Can anyone please help me with a "remove from favourites"
facility i'm working on.
I query to get all the favouites, then i output those
favourites down the page
each favourite has a "remove from favourites" link - i want
to make it so when a user clicks this link they get a javascript
confirm box pop up saying "are you sure you want to remove
#favourites name# from your favourites?"
so i have..
function remove(profile,name) {
if (confirm("Are you sure you want to remove #name# from
your favourites?")) {
window.location =
"remove_from_favourites.cfm?deleteFavID=#profile#&removedName=#name#"
and
<div
onClick="remove(#rs_favs.favouriteeID#,#rs_favs.firstName#)"
>Remove from favourites</div>
but it doesn't work - i think there are 2 problems..
problem 1 - i have used the CF # in the remove function as i
don't know what one does in javascript to "output" a variable (see
where it says "Are you sure you want to remove #name# from your
favourites") what should i use in place of the "#"?
problem 2 - i have tried to pass to variables to the function
>>
onClick="remove(#rs_favs.favouriteeID#,#rs_favs.firstName#)" and i
have separated them but a commer "," but i suspect that is
incorrect syntax
if anyone could please help me i'd be very grateful as, to be
honest, i love coldfusion - but javascript just hurts my head! :(
thanks very much indeed.
PS the way i've wrapped my "remove from favourites" text in a
div rather than making it an actual "a href" link - is that right
or is there a better way (ideally i'd like the text to look like
all my other links (ie they underline on mouse over)

You can simply add CSS commands to define your div to look
like your links.
div#FavLink
color: blue;
text-decoration: underline;
cursor: pointer;
<div id="FavLink"
onClick="remove(#rs_favs.favouriteeID#,'#rs_favs.firstName#')"
Remove
from favourites</div>
That should get you started.
happysailingdude wrote:
> thanks CFDEBUG that sorted it - thanks very much
>
> just one last thing - more of a CSS issue i think but
maybe not.
>
> so now I have <div
>
onClick="remove(#rs_favs.favouriteeID#,'#rs_favs.firstName#')"
>Remove from
> favourites</div>
>
> which of course isnt a link so it just looks like my
standard text (as if i'd
> done <p>Remove from favourites</p>
>
> how do i make the "Remove from favourites" text look
like a link as if i'd
> done <a href="remove_from_favourites.cfm?....."
>Remove from favourites</a>
>
> i think ive seen links that when you hover over them it
says "javascript:void"
> or something at the bottom of the browser - is this the
answer and if so what
> is the correct syntax please? or do i need to do
something with my CSS file?
>
> thanks very much indeed for any further help anyone can
give me to get this
> page finshed off - thank you
>

JSF without JavaScript... alternative

I've been looking around to see if JSF is really a good choice for the projet i'm working in... I'm between JSF and Struts for the development..
The framework must:
* have a great performance: lot's of visitors and a great ammount of data (member profiles and lots of database access...) everytime...
* internacionalization
* dynamic: the visitor is able to choose the Look and Feel for the page (templates, color schemes, ...).
JSF has shown to be great for this aspect.. but all the implementations i've seen make an extensive use of JavaScript (even for a simple link...). The project MUST be able to work with users who has JavaScript enabled and disabled.
I read somewhere you could have a DHTML and a HTML Renderer and decide at runtime which one to use... Is it a greate alternative? Is it worth the cost?
Thanks everybody!

This is a good list of open-source web frameworks. Perhaps there is something in this list that will suite your needs:
http://java-source.net/open-source/web-frameworks

PLEASE SOMEONE HELP ME - JSF PROBLEM

thanks, for the time
my problem is that I have this code jsp
<jsp:root version="2.1" xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" xmlns:jsp="http://java.sun.com/JSP/Page" xmlns:webuijsf="http://www.sun.com/webui/webuijsf">
<jsp:directive.page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8"/>
<f:view>
<webuijsf:page id="page1">
<webuijsf:html id="html1">
<webuijsf:head id="head1">
<webuijsf:link id="link1" url="/resources/stylesheet.css"/>
</webuijsf:head>
<webuijsf:body id="body1" style="-rave-layout: grid">
<webuijsf:form id="form1">
<webuijsf:table augmentTitle="false" id="table1" style="left: 48px; top: 72px; position: absolute; width: 450px" title="Table" width="450">
<webuijsf:tableRowGroup binding="#{Page2.tableRowGroup1}" id="tableRowGroup1" rows="5"
sourceData="#{SessionBean1.tablaEditaMNT_ListDataProvider}" sourceVar="currentRow">
<webuijsf:tableColumn headerText="column1" id="tableColumn1" sort="codigo">
<webuijsf:staticText id="staticText1" text="#{currentRow.value['codigo']}"/>
</webuijsf:tableColumn>
<webuijsf:tableColumn binding="#{Page2.tableColumn2}" headerText="column2" id="tableColumn2" sort="ruc">
<webuijsf:staticText id="staticText2" text="#{currentRow.value['ruc']}"/>
</webuijsf:tableColumn>
<webuijsf:tableColumn binding="#{Page2.tableColumn3}" headerText="column3" id="tableColumn3" sort="namecomercial">
<webuijsf:staticText id="staticText3" text="#{currentRow.value['namecomercial']}"/>
</webuijsf:tableColumn>
</webuijsf:tableRowGroup>
</webuijsf:table>
<webuijsf:staticText binding="#{Page2.staticText4}" id="staticText4" style="position: absolute; left: 72px; top: 216px"/>
<webuijsf:staticText binding="#{Page2.staticText5}" id="staticText5" style="position: absolute; left: 264px; top: 216px"/>
</webuijsf:form>
</webuijsf:body>
</webuijsf:html>
</webuijsf:page>
</f:view>
</jsp:root>
Everything in the page2.java works fine but when I run the project the Labels or buttons Just Disappear , the table just show data in 'codigo' and 'ruc' but nothing in 'namecomercial' the only clue i have is this:
Jun 24, 2008 10:30:50 AM org.apache.catalina.core.ApplicationContext log
SEVERE: org.apache.jasper.el.JspPropertyNotFoundException: /Page2.jsp(27,120) '#{currentRow.value['namecomercial']}' java.lang.IllegalArgumentException: namecomercial
javax.faces.FacesException: org.apache.jasper.el.JspPropertyNotFoundException: /Page2.jsp(27,120) '#{currentRow.value['namecomercial']}' java.lang.IllegalArgumentException: namecomercial
The same problems was with --> '#{currentRow.value['Codigo']}
but for some weird way i just change 'Codigo' for 'codigo' and the data appears in the table but this doesn't work for 'namecomercial' cause in the begin it was 'NameComercial' i change this to 'namecomercial' and others names but the problem still
im sorry for my poor english i hope someone can help me out

In the future, please do not shout in topic titles. It is very rude.
Regarding to your problem: shouldn't it be nameCommercial then? Just follow the Javabean naming conventions.

Javascript/CSS - creating a site index

I've been asked to create a site index for the intranet.
The idea is that the main sections are show on the first
page, then when clicking on a section the subsections for that
entry will be displayed (i.e. the section will expand to show all
the subsections).
I'm told that it will "require CSS or JavaScript t, using a
hide / show implementation - the CSS will hide & show the
<DIV> tags that will create this affect".
Could anyone help me with this - I am inexperienced with
Javascript and CSS!!
Many thanks!

Hi JaneXYZ. From what you say it sounds like all you need to
do is provide good ol' fashoined DMTL drop down text. Your first
section could be typed into your topic. Add drop down text to
display the second level. You can use the project's .CSS file to
display the text as you like.

Does JEditorPane support JavaScript, CSS, XHTML, HTML?

Can anyone confirm what JEditorPane actually can support? I can't find anything specific in the J6SE release notes and most of the stuff of Google is pretty dated, I have also searched the forums but nothing much on there that is recent. According to one post it supports some CSS and HTML but no JavaScript.
Can anyone confirm this?
What I plan to do is make a lightweight split pane editor for the above but I also want to be able to preview the code in another pane instead of launching a browser. If there still is no support then can anyone suggest an alternative way to get the same results?
Failing that I will just have to try and then fall back to the browser but it would be nice to know before hand. The online docs I read don't cover a lot on compatibility.
Cheers

the answer is no. the html support in JEditorPane is
very simple to be able to do things like simple help
manuals and such. But you may be able to integrate
the mozilla gecko engine into your application if you
really want this.
http://jrex.mozdev.org/
Hi Gimbal,
Thanks for the info. The jrex thing certainly looks more like what I am after.
Cheers

Gzip for JavaScript / CSS files on SUN ONE / Glassfish

how to Gzip JavaScript and CSS files on Sun One Web Server / Glassfish Server. .
Can anybody help me out .?

[http://blogs.sun.com/meena/entry/about_http_compression_in_sun]
and
[http://blogs.sun.com/meena/entry/dynamic_compression_of_static_files]
and
[Sun ONE Web Server 6.1 Administrator's Guide in docs.sun.com|http://docs.sun.com/source/817-1831-10/agcontnt.html#wp1016016]

Can someone help me understand how ePub CSS @fontface Unicode characters are supported in td , but not in div or other elements?

Hi,
I'm working on a project to convert several hundred thousand life sciences articles into epub format, and we have run in to a problem with character entities.
Being that these are scientific articles, the characters are from a wide range of Unicode charts, and are essential to transmitting the meaning of the data.
The problem is that in my epub, the character entity inside a table data cell is rendering the @font-face correctly, but inside any other HTML element, the character renders as an empty box on our ipad2s.
I've placed pre tags in hopes that the unicode will not be rendered in your browser here. The code point in this example is x1d542 just in case.
So inside div, we see boxes, inside td, we see the character rendered properly.
<pre>
      <div class="stix">Let 𝕂 be a field, which will be either the complex numbers ℂ or the finite field 𝔽</div>
      <table id="t31" rules="all">
        <tr>
          <td>𝕂</td>
          <td class="stix">𝕂</td>
          <td>U+1D542 MATHEMATICAL DOUBLE-STRUCK CAPITAL K </td>
        </tr>
</pre>
My CSS looks like this:
<pre>
@font-face {
    font-family: 'STIX';
    src: url('STIX-Regular.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
    unicode-range: U+02B0-02FF, U+07C0-07FF, U+0900-097F,U+0F00-0FD8, U+1D00-1D7F, U+1D80-1DBF, U+1D400-1D7FF, U+1E00-1EFF, U+1F00-1FFE,U+2000-206F, U+20A0-20B8, U+20D0-20F0, U+2300,23FF, U+25A0-25FF, U+2600-26FF, U+27C0-27EF, U+27F0-27FF, U+2900-297F, U+2A00-2AFF, U+2B00-2B59, U+2C60-2C7F ;
@font-face {
    font-family: 'STIX-Math';
    src: url('STIXMath-Regular.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
    unicode-range: U+02B0-02FF, U+07C0-07FF, U+0900-097F,U+0F00-0FD8, U+1D00-1D7F, U+1D80-1DBF, U+1D400-1D7FF, U+1E00-1EFF, U+1F00-1FFE,U+2000-206F, U+20A0-20B8, U+20D0-20F0, U+2300,23FF, U+25A0-25FF, U+2600-26FF, U+27C0-27EF, U+27F0-27FF, U+2900-297F, U+2A00-2AFF, U+2B00-2B59, U+2C60-2C7F ;
.stix   {
        font-family: "STIX", "STIX-Math", sans-serif;
</pre>
Is it possible that this is a rendering bug, because the character is rendering in the table cell, but not in other elements?
Have I missed something obvious?
Thanks,
Abe

I assume you are including the STIX font as part of your epub files?
Perhaps the folks who do this blog might be able to help -- they have done some work with font embedding:
http://www.pigsgourdsandwikis.com/2011/04/embedding-fonts-in-epub-ipad-iphone-an d.html

Please help me...Javascript question

Hi everyone,
what i am trying to do is..
EX:
TABLE: EMP
empno empname sal entered_by
1 john 1000 user1
I have a form on the table EMP.The users want to enter the same record again(because mutiple users enter the same record) but want an alert message when they hit the create button like.. Eg:
when user2 is trying to enter this data..
empno: 2 (generated by sequence)
empname: john
sal: 1000
he wants to see an alert message like: THE Record is Already exists in the database which was entered by USER1 (But he can enter the same record)
what i did is.. I have a javascript which calls the application process (PL/SQL) where it check whether the data entered is already there in the database and returns back an alert message like this:
JAVASCRIPT:
==========
<script language=javascript>
function f_insert_record()
        var get = new htmldb_Get(null,&APP_ID.,'APPLICATION_PROCESS=INSERT_RECORD',0);
        get.add('P2_EMPNAME',html_GetElement('P2_EMPNAME').value);
        get.add('P2_SAL',html_GetElement('P2_SAL').value);
        gReturn = get.get();
        var a = gReturn.split("|");
        if(gReturn)
            if (a.length > 0) {alert(a[0]);}
        else
            null;
</script>APPLICATION_PROCESS
===================
DECLARE
   l_error   VARCHAR2 (4000);
   V_NAME VARCHAR2(1000);
   V_MSPR_ID NUMBER(15);
   I NUMBER;
   V_MYNUM STRING_OBJ := STRING_OBJ();
BEGIN
FOR C1 IN (SELECT DISTINCT entered_by ENTERED_BY_USER_NM
from emp
WHERE
empname = :P2_EMPNAME
AND sal = :P2_SAL
) LOOP
    V_MYNUM.EXTEND;
    V_MYNUM(V_MYNUM.COUNT) := C1.ENTERED_BY_USER_NM;
END LOOP;
V_NAME := NULL;
l_error := NULL;
FOR I IN V_MYNUM.FIRST..V_MYNUM.LAST LOOP
    --dbms_output.put_line(V_MYNUM(I));
    V_NAME := V_NAME || '   ' || V_MYNUM(I);
END LOOP;
IF V_NAME IS NOT NULL THEN
    l_error := 'The record already exists in the database which was created by '||V_NAME;
END IF;
HTP.PRN(l_error);
END;everything works fine...when i have a ONBLUR event on the SALARY field.
But i want the same thing to be achieved with the ONCLICK event on the CREATE button (Template based button).
The code i have shown over here is just an example...But the requirement is the same..Multiple Users can enter the same record but they want to see an alert message like this record was entered by USER1,USER2.
The only think i am not able to figure out is the ONCLICK event on that create button.
I tried like this Target: URL
javaScript:(f_insert_record();doSubmit('CREATE');)
I am not getting the alert message.
Please help me to solve this
thanks
phani

damn it! Those little quotation marks.....
I already did figure it out awhile after I posted my question
Thanks anyway!

Aperture help not working - getting JavaScript error message

My Aperture 3 has been having a lot of strange issues lately, most, but not all of which have been cleared up by holding down command + option while starting up and going through all three of the choices there.
One problem that remains is the inability to open the Help files. I keep getting the following message:
“The Help Library requires JavaScript.
If JavaScript is not enabled, you will not
be able to view all the content.”
Help works in all other applications, like Pages and Final Cut Pro. I don’t get JavaScript error messages in any other applications.
I’ve already done an erase and restore from a Time Machine backup, and an archive and install. I reinstalled Aperture, although not by using the Terminal command suggested in the kbase article # HT3805.
If I go the Terminal command route, will I lose all my projects, albums, and editing? What about Mobile Me galleries?
I have a guest user on the computer, and when I log on to that user and open Aperture, the Help Library works fine. So, I know the problem is in my user account somewhere, but I don’t know how to address it. Any ideas?

Welcome to the forums.
The fact that you have access to java in another user suggests that it is a local setting or preference.
In the applications folder/utilities there is an application Java Preferences, try resetting this and seeing if it works.
If not, try deleting the java preferences file in your users folder
systemHD/Users/user/Library/Preferences/com.apple.java.JavaPreferences.plist
relaunch the app Java Preferences which creates a new preferences file for you, then try Aperture again.
Let us know how this goes.
Tony

Help w/ JSF vs. JavaScript+CSS+DHTML debate

Similar Messages

Maybe you are looking for