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>
Related
I am scraping a website and occasionally a page gets thrown up that appears completely empty in the browser. I would like to write an exception for this, but I cannot find a way to check with BeautifulSoup if this is true. I know this seems like an easy problem, but I am a beginner.
The structure of the offending HTML page is as follows:
<!DOCTYPE doctype html>
<html lang="en">
<head>
...
</head>
<body class="something" data-theme="something">
<csn-mobi>
</csn-mobi>
<div id="bitracking" style="display:none">
</div>
<script>
...
</script>
<script>
...
</script>
</body>
</html>
In other words, the <body> has a whole bunch of <script> tags and when I do something like:
BrowserText = soup.body.text
then the problem is that all the script inside the <script> tags gets included as well.
But I want to check if there is anything outside the <script> tags (but within the <body> tag), and if there is nothing, raise an exception.
Any ideas on how to do this?
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 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 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">
I am currently playing around with JSFs ClientBehavior API.
I want to create a client behavior that uses jQuery. Besides inclusion of the *.js files for jQuery another script will be required in the <head> section to bootstrap all the jQuery stuff i.e. create client side widgests.
I tried to follow this approach from victor herrera, but the component system event is never processed. I guess this is because ClientBehaviors do not inherit from UIComponent.
So my question is how to add dynamically created JS to the <head> of the rendered document.
This is what the rendered output in the end should look like:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript">
$(document).ready(function () {
// Dynamically created stuff here
}
</script>
</head>
<body>
...
<input type="text" id="myJSFInputWithClientBehavior" onclick="doSomeStuffWithjQuery()" />
</body>
</html>