Browsers not displaying XFORMS controls - xhtml

I am learning XForms. And i am trying to display this in browsers like IE9, Chrome and Firefox 14.
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:xf="http://www.w3.org/2002/xforms">
<head>
<title>Hello World in XForms</title>
<xf:model>
<xf:instance xmlns="">
<data>
<PersonGivenName/>
</data>
</xf:instance>
</xf:model>
</head>
<body>
<p>Type your first name in the input box. <br/>
If you are running XForms, the output should be displayed in the output area.</p>
<xf:input ref="PersonGivenName" incremental="true">
<xf:label>Please enter your first name: </xf:label>
</xf:input>
<br />
<xf:output value="concat('Hello ', PersonGivenName, '. We hope you like XForms!')">
<xf:label>Output: </xf:label>
</xf:output>
</body>
</html>
But textbox is not appearing. What is the problem? I have tried to search Xfroms plugins for browsers but found nothing.

XForms is not natively supported in browsers but there are client-side implementations such as XSLTForms (which is based on XSLT and Javascript).
-Alain

As Alain Couthures has already pointed out, there is currently no native support for XForms in browsers (and apparently no prospect of it in future). You will need to install either a client-side or a server-side implementation of XForms, and then you should start to see results.
Available client-side implementations include
XSLTForms (which Alain Couthures wrote and which is often used for its simplicity of setup)
Ubiquity XForms (an ongoing project mostly carried by Mark Birbeck; widely regarded as promising, but not well documented last I looked)
The EMC Documentum XForms Engine, aka Formula (looked very polished; documentation is aimed at those integrating it with other EMC products)
Prominent server-side implementations include
Orbeon (perhaps the best documented of all XForms products)
BetterFORM (successor to the Chiba project)
Several of these have active user-community mailing lists.
There are also non-browser-based implementations which use languages other than HTML as the host document language (IBM Forms and Open Office).

Related

Use resource file for meta content in HTML

I have multilanguage website and, deppending of languane, keywords should be on that language. Right now it's on English, so in my _Layout.cshtml I have meta tag like this:
<meta name="keywords" content="GDPR, privacy, pact, privacy pact>
How to, for example set it to Russian from Resource file?
It depends on the programming languages you are using. You could use AJAX/JS, PHP, or pretty much any other server-side language. You just include an if statement to see what language you need the metadata for, and then use AJAX or a server-side language to get the right data from the separate file. If you tell me what programming languages you are using I could try to code it out.

Is there any HTML 5 construct that is ONLY supported in the XML serialization?

Does there exist any "thing"(element, DOM manipulation, styling, nesting of elements, attributes, anything of that sort...) one can do in XHTML 5, that one CANNOT do in HTML 5? I remember reading on the web about one such case, but I cannot recall where it is I saw it.
This is apart from the use of content from external namespaces such as SVG and MathML (which is supported in HTML as well).
For reference, the number of answers to the converse question "what can you do in HTML 5 that you can't in XHTML 5?" are very large, given the strictness of XHTML. Hence I'm looking for answers to this question.
Yes, for example entity declarations and references to entities so defined. They are part of XML, so they must be supported when using XML serialization, as it is required to follow generic XML rules. Example:
<!DOCTYPE html [
<!ENTITY foo "Hello world">
]>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Demo</title>
</head>
<body>
&foo;
</body>
</html>
XHTML, being XML supports xml-stylesheet declarations. Not just CSS but also XSLT. Which can transform the document tree before presentationXSLT also supports inclusions via document("foo.xml"), which can be used as an XInclude surrogate since no browser supports the latter right now.
XML parsers validate well-formedness
XHTML supports namespaces, allowing other XML content (not just SVG and MathML) to be embedded
CDATA sections
.innerHTML, .insertAdjacentHTML() and .createContextualFragment() validate well-formedness
The topic is quite interesting in general. E.g. an XHTML5 parser is not quite the same as a pure XML parser, as the HTML5 spec mandates a few willful violations of the XML parser, e.g. to support the <template> element.
There also are a handful of states in which you can have a valid DOM that will throw an error if you try to export it through the XHTML fragment serialization algorithm.
And the HTML Fragment serialization algorithm may emit a string which will result in a different DOM when parsed again by a HTML parser.
So basically all three of the following are not fully isomorphic to one another, in any combination:
the XHTML5 serialization
the (X)HTML5 DOM
the HTML5 serialization.
In XHTML, you can use self-closing syntax (/>) on non-void elements:
<script src="js.js" />
And void elements can have stray end tags:
<input></input>
I was able to find what I was remembering vaguely in this unofficial Q&A by hsivonen. I'm still looking for other such "features".
[...] In this case, you must avoid constructs that aren’t supported in text/html (e.g. div as a child of p).
Searching about more, I found this page (second post from top) :
but basically a p can never enclose a div in HTML (or XHTML served with the mime type text/html). If you are serving XHTML with an XML mime type, you can do this in theory, but the result would not be valid XHTML.
saying that the HTML parser simply doesn't allow the possibility, while the XHTML parser, which doesn't need to second-guess the code, accepts it but it's still invalid.
I decided to test it out : took an application/xhtml+xml page, tried to add a div inside a p using Chrome dev tools "Edit as HTML" function. It worked. I copied the source, made the same change and tested it in validator.nu. It marked it as invalid, to my slight disappointment.
Trying to add a div in a text/html page in the same manner was impossible. As soon as I exited the "Edit as HTML" mode, it simply moved the div after the p.

How should I declare my namespace for angularJS ui-router so it's valid in html and VS 2013?

In my index.html I have defined the following:
<html class="dark"
ng-app="app"
ng-controller="appController"
id="ng-app"
xmlns:ng="http://angularjs.org"
ng-app="optionalModuleName">
In my code I have:
<a ui-sref="home.content({ content: 'overview' })"
ui-sref-active="current">
From what I understand the xmlns:ng="http://angularjs.org is required by some versions of IE
to identify the different namespaces.
Now I am also using ui-router. So how should I declare the namespace?
I assume xmlns:ui but what should I put after that ?
Also in VS2013 it's coming up as invalid. Is there a way I can tell VS2013 to ignore ui- that it sees in HTML ?
Just to be clear in the first place - you are naming your index site index.html. This confused me a little since namespaces are only valid, when used in xml documents. For html it would be the xml application xhtml. If you do not know the difference, please read it up on the web. There are many good tutorials and articles explaining the differences between htmland xhtml.
Back to your question: As far as I can see from their source code, the ui router is developed in valid angularjs, and the usage is like the usage of angular directives, so you should be fine only including the angularjs namespace to your root element.
Please also read the following document for further introductions on how to make angularjs compatible with Internet Explorer: https://docs.angularjs.org/guide/ie
As for your second question, I don't know if you can setup VS2013 to ignore certain attributes, but since html5 you are able to add data- before them to make them valid (x)html.
As described in here: https://docs.angularjs.org/guide/directive
and here: http://www.w3schools.com/tags/att_global_data.asp
So for example:
<a data-ui-sref="home.content({ content: 'overview' })"
data-ui-sref-active="current">

What's the difference between XHTML and DHTML?

Reading about both separatedly, looks like the same, html+xml+javascript.
What's the difference between then? Is there any?
XHTML is a w3c standard, a form of HTML that also strictly conforms to XML.
DHTML is a largely deprecated term (it is short for 'Dynamic HTML') which was introduced when the first early static web sites started introducing client side scripting to make the page more 'dynamic'. Nobody really talks in terms of DHTML any more (the term got superseded by 'ajax', and 'web 2.0', and 'web app')
No, neither one is HTML + XML + Javascript.
XHTML is HTML (but also XML)
It's just a dialect of HTML that conforms to the syntax rules of XML. Javascript is not part of the XHTML specification (or any HTML specification).
DHTML is HTML + Javascript
It stands for Dynamic HTML, and Javascript adds the dynamic part. The HTML part can also be the dialect XHTML.
XHTML is a dialect that is based on the XML language while DHTML is not a dialect or a language but a collection of other technologies
Both were created to provide additional features and interactivity to HTML
DHTML still uses HTML at its core and is plagued with HTML related problems
XHTML is more streamlined and easier to code with because of its conformance to XML
DHTML is already outdated and has been replaced by other technologies
take a look to this post:
http://www.differencebetween.net/technology/difference-between-dhtml-and-xhtml/
DHTML is dynamic HTML, means the contents of html becomes dynamic and changes time to time and did not require developer again after one time creation of language.
XHTML extensive HTML means this is also uses XML , simple is that in XML you can build your own tags and used in your project or file.

Is there a Checkstyle-like tool to monitor XHTML (or XML) pages?

I am working on a project where we have many JSF pages - using the XHTML format.
We monitor the quality of our code using Sonar (and thus Checkstyle, PMD, FindBugs...). This works great for the Java part of our application.
Now, I want to have a tool (ideally something that could then be linked to Sonar by writing my own plugin) that checks the XHTML part of my application.
So, is there a checkstyle-like tool that can check for some rules on my pages? For example, this tool will raise a warning when I encounter these kind of code:
<h:inputText ...></h:inputText> (instead of <h:inputText .../>)
or :
<h:panelGrid columns="1">
...
</h:panelGrid> (a <h:panelGroup> is better here)
I'm aware that Checkstyle offers a rule that is based on a regular expression, but I fear that solution is too complex for some rules...
There's always the venerable "HTML Tidy". Or you could consider extending checkstyle itself.
You might want to focus attention here: http://jira.codehaus.org/browse/SONARPLUGINS-130
I've recently found the Sonar Web plugin that provides static code analysis of JSP and JSF files. The main features of this plugin are:
sizing (files, lines of code)
rules compliancy
complexity
duplication
comments
I will try it soon (I need to install the latest Sonar 2.2 version) and give feedbacks.

Resources