In Dart must element.html(" ") occur within the context of a body tag? - dart

TableElement table = new TableElement();
document.body.children.add(table);
table.children.add(new Element.html("<tr><td>test</td></tr>"));
The above code snippet returns the error: "Uncaught Bad state: No element". Reading the API docs on the DartLang website this is because when using the Element.html(" ") constructor, "the HTML fragment is parsed as if it occurred within the context of a <body> tag". Therefore, we would need to write:
new Element.html("<table><tr><td>test</td></tr></table>")
However, reading "dart in action" Chris Buckett uses this exact same syntax when building a table.
Has something changed or am I misunderstanding something?

This is a browser "feature". A <tr> element can't exist on its own and is just dropped from the HTML when it finds one.
The docs to new Element.html() says
Creates an HTML element from a valid fragment of HTML.
Alternatively you can use
table.append(
new TableRowElement()..append(new TableCellElement()..text = 'test'));
DartPad example

Related

how to add hyperlink to text in dart

I am trying to add an anchor tag to the message I want to display but I am getting an error message. Am I not doing this right?
String browserRequirementsUrl = "https://test.testing.com";
var someText = new ParagraphElement()
..innerHtml = "Link can be found <a href=${url}>here</a>[1].";
But I get an error message saying
html_dart2js.dart:3614 Removing disallowed attribute <A href="https://test.testing.com">
Any suggestions, how I can do this?
By default in dart:html, for security purposes, this is disallowed.
You can use the .setInnerHtml method:
..setInnerHtml("Link can be found...", treeSanitizer: NodeTreeSanitizer.trusted);
Note that this can potentially be insecure (i.e. inject <script> tags and such), so you can always create a custom sanitizer or validator to only allow a subset of HTML tags (such as <a>).

How to pass html parameter in Google Closure Template

Guys I want to pass a parameter that contains html characters in Google Closure Template, but all I get is literal html texts. How to do this?
What I have tried so far is this :
{template .modal autoescape="strict" kind="html"}
{$html_content}
{/template}
I have been reading this but it's not very helpful. Thanks
{template .modal}
{$html_content |noAutoescape}
{/template}
Is going to print your HTML. But consider that using |noAutoescape in your templates is discouraged.
Discouraged: It's easy to accidentally introduce XSS attacks when the assertion
that content is safe is far away from where it is created. Instead,
wrap content as sanitized content where it is created and easy to
demonstrate safety.– Google Closure Templates Functions and Print Directives
Or if you are sure $html_content is "safe" HTML, you can ordain it right where you pass parameters to the template:
goog.require('soydata.VERY_UNSAFE');
goog.require('template.namespace');
var container = document.getElementById('modal');
var html = '<strong>HTML you trust!</strong>';
container.innerHTML = template.namespace.modal({
html_content: soydata.VERY_UNSAFE.ordainSanitizedHtml(html);
});
Then your initial template is going to print HTML as it is:
/**
* #param html_content HTML markup
*/
{template .modal autoescape="strict" kind="html"}
{$html_content}
{/template}

html node parsing with ASP classic

I stucked a day's trying to find a answer: is there a possibility with classic ASP, using MSXML2.ServerXMLHTTP.6.0 - to parse html code and extract a content of a HTML node by gived ID? For example:
remote html file:
<html>
.....
<div id="description">
some important notes here
</div>
.....
</html>
asp code
<%
...
Set objHTTP = CreateObject("MSXML2.ServerXMLHTTP.6.0")
objHTTP.Open "GET", url_of_remote_html, False
objHTTP.Send
...
%>
Now - i read a lot of docs, that there is a possibility to access HTML as source (objHTTP.responseText) and as structure (objHTTP.responseXML). But how in a world i can use that XML response to access content of that div? I read and try so many examples, but can not find anything clear that I can solve that.
First up, perform the GET request as in your original code snippet:
Set http = CreateObject("MSXML2.ServerXMLHTTP.6.0")
http.Open "GET", url_of_remote_html, False
http.Send
Next, create a regular expression object and set the pattern to match the inner html of an element with the desired id:
Set regEx = New RegExp
regEx.Pattern = "<div id=""description"">(.*?)</div>"
regEx.Global = True
Lastly, pull out the content from the first submatch within the first match:
On Error Resume Next
contents = regEx.Execute(http.responseText)(0).Submatches(0)
On Error Goto 0
If anything goes wrong and for example the matching element isn't found in the document, contents will be Null. If all went to plan contents should hold the data you're looking for.

HTMLDocument object from HTTP read()

I need to call at server side, an URL and work with the HTML content off the response. For this I'm using the HTTP library from Dart like this :
http.read('myUrl').then((contents) {
//contents to HTMLDocument format //Need to transform the String contents to HTML object
});
And I want to convert the response to a HTMLDocument (or other object I don't know) to be able to retrieve element in it by HTML tag or CSS class, like with JQuery for example.
Does anybody have an idea to perform this ?
You canuse html5lib package from pub. It allows to parse HTML and present it DOM like element tree on server side. The element tree will eventually "be compatible with dart:html, so the same code will work on the client and the server" in the future. See the readme for a getting started example.
"I need to call at server side"
Not sure exactly what you mean.
If you are running in the browser and calling the server you could try using a DocumentFragment. Something like this:
http.read(url).then((html) {
var fragment = new DocumentFragment(html);
var element = fragment.query('.foo');
// code here...
});
Otherwise if you're running server side, as the other answer mentions, html5lib is the way to go. Last time I looked the query() method in html5lib only supported tagname queries not classes, or ids.

How do I check if a tab exists in jQuery UI?

Currently I use this to check if a tab(element) already exists:
if(!$('#'+element).length){
//... code to add new tab if not exists.
} else {
Alert("Tab or portlet already exists...");
}
This is very dirty and I get a "uncaught exception: Syntax error, unrecognized expression: #" from FireBug. If element already exists, the "Alert" doesn't show, I think it hangs at the first exception.
Is there a better way to check if an element exists? (Or a tab)
I am using this for my personal project # http://www.soliman.nl/test/jqueryui/ui_2.php
The problem seems to be in your source - you are passing "#foo" as the parameter element, then prepending another "#". The result is $("##foo"), which just isn't going to work.
please check value of element
coz if this is null or empty your statement become
if(!$('#').length){
or
if(!$('#null').length){
which may through some error
here is working version
​<html>
<body>
<p id="test"></p>
</body>
</html>
​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
var element = "test"; //if you try to comment this line or change value , it will give error
if(!$('#'+element).length){
alert("do something");
} else {
alert("Tab or portlet already exists...");
}​
Demo
http://jsfiddle.net/J3MdK/

Resources