I am new to angularjs, and was trying to create a sample angularjs in a Facelets file. But I am getting an error in the line <html ng-app> in Eclipse IDE. The error specifies that the ng-app attribute should be followed by an = character. Is it not possible to include angularjs code in a Facelets XHTML file?
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns:ng="http://angularjs.org" ng-app>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
</head>
<body>
<div>
<label>Name:</label>
<input type="text" ng-model="yourName" placeholder="Enter a name here">
<hr>
<h1>Hello {{yourName}}!</h1>
</div>
</body>
</html>
Take a look at following:
Try angular faces: https://github.com/stephanrauh/AngularFaces
And there is also a project: https://github.com/pankajtandon/PointyPatient
Prime faces refer to: http://angularprime.appspot.com/#/main
The best way is to go with HTML & JS as Client, and JAX-RS on Server Side.
I had similar problems, with Primefaces and Bootstrap, and became convinced, that JS & HTML at the moment is better for client side development.
Give the attribute the ng-app.
The value of the attribute would be the same as the name of variable that contains the return value of angular.module().
for ex:
ng-app="SampleApp"
in the html page
var SampleApp = angular.module("SampleApp", ["ngResource"]).
config(
//your code
);
in the app.js file
I think this should work for you.
The logic is that, when you define the ng-app it gives the reference to the particular module of app.js that would call the relevant controllers.
There is an app.js file in angularjs. This contains all the controllers define. These controllers act as connecters and data pipeliners between the html(our view) and the .cs(mvc controller) files.
These controllers are defined in a module (as i have defined one in the above answer).
There can be numerous modules in app.js. and hence they wil have numerous controllers.
ng-app is a directive that contains the name of the module you want to use as attribute.
ng-app defined will be active till the closing tag of the tag defined. That means if you have defined ng-app in html tag, it will work till the html tag closes, if in a div, it will work for that division.
If you dont get anything, google it, or refer the angularjs documentation, or shoot me a question.!!
I hope you got something out of it.:-)
Stumbled on this while searching myself.
XHTML does not allow an attribute without a value. While you can ignore this in Eclipse, the latest JSF libraries blow up and you'll get an exception.
Specify a value, which corresponds to your module name. For example, if you initialize your angular module with:
var myAppModule = angular.module('myApp', []);
Then you need to specify:
<html ng-app="myApp">
And all should be good minus some warnings in eclipse for not recognizing "ng-app". Works for me. Also, you probably want the HTML 5 doc type instead of the strict you have. Try:
<!DOCTYPE html>
<html ng-app="myApp">
Related
I've just realized that some of my pages have a long DOCTYPE, but most pages have the short DOCTYPE like below. I never add this details myself and in all my Master Pages, I don't see/add the DOCTYPE details. My question is how the DOCTYPE got added and how to make all pages use the same short DOCTYPE. I believe the long DOCTYPE may be the cause to mess up some of my navigation for mobile. Thanks for your input!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<!DOCTYPE html>
<html >
The DOCTYPE is set in the main portal template when using the PortalEngine in Kentico with the code <%=DocType%>. This value comes from the Master page tab inside the Pages application. You can see an example of this on the Creating the master page tutorial in the Kentico documentation.
It's the first field on the tab that you can edit, so you should just be able to set the value to <!DOCTYPE html>.
As far as I am aware, each page that has a master page can specify its own document type, so check out each of your master pages. I think if you check out the link about, this will help you out.
It's also worth checking that no-one has edited the file CMSPages\PortalTemplate.aspx (this is the base for PortalEngine pages). For reference, the beginning of the file normally looks as follows (in Kentico 10):
<%# Page Language="C#" AutoEventWireup="true" Inherits="CMSPages_PortalTemplate"
ValidateRequest="false" MaintainScrollPositionOnPostback="true" EnableEventValidation="false"
Codebehind="PortalTemplate.aspx.cs" %>
<%=DocType%>
<html <%=XHtmlNameSpace%> <%=XmlNamespace%>>
To add to what Matt has said, if your not using Portal method then the changes could be in several different aspx files in the CMSTemplates directory. These templates would have that namespace defined in them if they were a master page template.
<!DOCTYPE html>
add above doctype in very first line of your master page.
refer below link.
https://docs.kentico.com/k9tutorial/creating-the-master-page
hopes it will help
Is there any way to setup Firefox and Chrome to work with escape=false attribute in h:outputText tag. When there is some html that needs to be shown in the browser, Firefox and Chrome show parsed string correctly, but any other links in application are freezed (??).
The example html from db:
<HEAD>
<BASE href="http://"><META content="text/html; charset=utf-8" http-equiv=Content-Type>
<LINK rel=stylesheet type=text/css href=""><META name=GENERATOR content="MSHTML 9.00.8112.16434">
</HEAD>
<BODY><FONT color=#000000 size=2 face="Segoe UI">läuft nicht</FONT></BODY>
Parsed HTML on the page:
läuft nicht
What is very weird, is that in IE everything works (usually it is opposite).
I use primefaces components (v2.2), .xhtml, tomcat 7 and JSF 2.0
You end up with syntactically invalid HTML this way:
<html>
<head></head>
<body>
<head></head>
<body>...</body>
</body>
</html>
This is not right. There can be only one <head> and <body>. The browsers will behave unspecified. You need to remove the entire <head> and the wrapping <body> from that HTML so that you end up with only
<FONT color=#000000 size=2 face="Segoe UI">läuft nicht</FONT>
You'd need to either update the DB to remove unnecessary HTML, or to use Jsoup to parse this piece out on a per-request basis something like as follows:
String bodyContent = Jsoup.parse(htmlFromDB).body().html();
// ...
Alternatively, you could also display it inside a HTML <iframe> instead with help of a servlet. E.g.
<iframe src="htmlFromDBServlet?id=123"></iframe>
Unrelated to the concrete problem:
Storing HTML in a DB is a terrible design.
If the HTML originates from user-controlled input, you've a huge XSS attack hole this way.
The <font> tag is deprecated since 1998.
It seems to me that you're trying to do something that JSF was not really meant to do. Rather than try to insert HTML in your web page, you ought to try having the links already on your page and modifying the "rendered" attribute through an AJAX call.
I encounter in some web app that some partial view that is used has head element (it loads some Jquery things).
The thing is that with that and the _layout.xml I get this wierd HTML page structure
<head>
...
</head>
<body>
...
</body>
<head>
...
</head>
<body>
....
</body>
doesn't feel right..
What's the best practice to load some .css.js to particular page? is it all done by _layout.xml and bundles?
and in general - only _layout.xml should contain head element? no other view in my solution?
You want only one head. Use layout with sections and add MVC sections in normal pages to add CSS or JScript. See here on basic section usage http://weblogs.asp.net/scottgu/archive/2010/12/30/asp-net-mvc-3-layouts-and-sections-with-razor.aspx. If you want to use partial create a helper to render section from partial see this answer Using sections in Editor/Display templates
I am a newbie to pyramid and using pyramid with Chameleon. Can someone help me how to have a common template for header and footer and a layout which includes them.Couldn’t able to figure out exactly how to use wrapper. The Re-usable Template Macros also didn’t help much. Finally got this add on pyramid-layouts which seems to be promising but lacks in documentation.
Update
For Including header and footer as sepearte template file Mako and jinja2 have built-in ways but like me if you like chameleon style we have to use macros
Chameleon: Macros - Visit //chameleon.readthedocs.org/en/latest/reference.html#macros-metal
Jinja2: Templates - Visit //jinja.pocoo.org/docs/templates/#import
Mako: Inheritance - Visit //docs.makotemplates.org/en/latest/inheritance.html
Since Chameleon 2.7.0 there is support for load: TALES expression, so it is possible to load the macros template directly from another template. For details see #sverbois answer or this related question: How to use template inheritance with chameleon?
Another, older approach described in Re-usable Template Macros tutorial, involves creating a class which contains the templates which need to bre references and passing an instance of the class into the view:
class Layouts(object):
#reify
def global_macros(self):
renderer = get_renderer("templates/macros.pt")
return renderer.implementation().macros
Then you need to pass that Layouts thingie into your views. In the tutorial they did that by subsclassing the view class from Layouts:
from layouts import Layouts
class ProjectorViews(Layouts):
...
but you could as well just instantiate it and pass it directly:
def blah(context, request):
layouts = Layouts()
return {
(whatever data you want to pass to your template)
layouts=layouts,
}
In your macros template you use metal:define-macro to, well, define a macro:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:metal="http://xml.zope.org/namespaces/metal"
xmlns:tal="http://xml.zope.org/namespaces/tal">
<metal:company_menu define-macro="company_menu">
<h1>Hi there!</h1>
</metal:company_menu>
</html>
To insert the macro into your other template, just use
<div metal:use-macro="view.global_macros['company_menu']"></div>
(if you use a view class subclassed from Layouts as they proposed), or
<div metal:use-macro="layout.global_macros['company_menu']"></div>
(if you instantiated the Layout object in a function-based view as I've shown in step 2 above)
Once that's working have a look at metal:define-slot and metal:fill-slot which will allow you to fill... err... slots in a macro with content supplied from the parent template
You can simply have a "main.pt" like this
<!DOCTYPE html>
<html>
<head>
...
</head>
<body>
<div class="header">
My global header
</div>
<metal:block define-slot="content" />
<div class="footer">
My global footer
</div>
</body>
</html>
and use it in your view template "my_view_template.pt" like this
<html metal:use-macro="load: main.pt">
<div metal:fill-slot="content">
<p>Hello !!!</p>
</div>
</html>
I'm new to Haxe, and I'm trying to experiment with Ufront.
I got a problem using Erazor templates: I don't understand how to escape HTML when outputting variables.
With this simple template:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Users list</title>
</head>
<body>
<ul>
#for(user in users)
{
<li>#user.name</li>
}
</ul>
</body>
</html>
If any of the users has name '<script>', then the template will simply output <script> for its name.
How can I properly HTML escape in Erazor?
How to HTML escape view arguments
In order to HTML escape an argument in your Erazor views,
you could simply use the HTML helper method encode().
Supposing your argument is called pageContent and its value is:
<script>
alert("BAD things could happens if you don't properly escape!!");
</script>
You can escape it using following code:
#Html.encode(pageContent)
Your template will be safely rendered as
<script>
alert("BAD things could happens if you don't properly escape!!");
</script>
Html.encode() internally uses StringTools.htmlEscape() in order to escape its argument.
Thanks to the kindly help of Franco, I've written a page on the Ufront site to explain how to HTML escape in Ufront.
Ufron automatically includes the helper class that contains the desired method:
<li>#Html.encode(user.name)</li>