How should ajax request html files be formatted? - asp.net

Im using jquery UI's tabs with ajax.
I was wondering if the files that the ajax calls are gonna retrieve are supposed to be formatted starting with <html> or just the minimal html possible cause its gonna be injected into an already formatted valid xhtml file.... I hope Im making myself clear.
Thanks in advance.

If you're going to inject what you receive from the server directly into the DOM, you'll want an HTML snippet. Something like
<div>This is something <strong>injected</strong></div>
is preferred over
<html><body><div>This is something <strong>injected</strong></div></body></html>

Minimal html. All the examples on the jquery UI tabs page use HTML shards.

You should be able to spit out the HTML exactly as you would want it dropped in to place (i.e. enclosing tags are not necessary).

Related

Web Component that can request another HTML URL and inject it into it's shadow DOM

I spent some time today with Lit trying to make a simple WebComponent that makes a HTTP GET to a URI, which returns a fully formed HTML document, and I want to inject said HTML document into the WebComponent's shadow DOM; basically this WebComponent acts as a simple proxy for embedding an externally hosted (but trusted) web snippet on my web page. I ran into a few problems:
Lit considers all HTML unsafe, so i had to mark it with Lit's unsafeHTML directive.
Then, I noticed none of the script or link tags in the injected HTML were being followed, so I parsed the incoming HTML as a HtmlDocument, located all the script/link tags, and "re-created" them using document.createElement(...) and returned them in my render(). I'm now noticing that images arent showing up either.
I don't like scraping scripts/links and re-creating them and jamming them into my web component anyhow, but I'm curious - what's the right way to approach this syndicating/consuming syndicated HTML pages/fragments?
Is this a solved problem w/ oEmbed already?
Is this simpler to do with a different WebComponent library?
This seems way harder than it should be at this point.
I think that it has little to do with WebComponents but rather with the HTML5 specs. lit-html uses innerHTML to create elements.
Script elements inserted using innerHTML do not execute when they are inserted
There are still ways to execute JS but this has little to do with your question.
unsafeHTML(`<img src="triggerError" onerror="alert('BOOM')">`)
Regarding the images, it may be a path issue?
This should work:
unsafeHTML(`<img src='http://placehold.it/350x350'>`)

Kentico CSS issue

I am using Kentico and have noticed a weird css issue. After mocking my pages up in Dreamweaver I then create the page in Kentico, however I have noticed that some elements in Kentico are slightly misaligned.
I have tried copying the source from Kentico into Dreamweaver to see if I can fix the issue but Kentico still renders the content incorrectly.
Are you using Dreamweaver in design or split mode? if yes, turn it off and use code mode only.
I guess you have to compare structure of your HTML and Kentico output HTML. Kentico add a form tag by default which may cause structural issue with css. If you can provide both html, I can help
On Kentico (up to version 11) when you use portal engine or ASPX templates you have this shortcoming. Kentico adds excessive HTML markup on the controls it creates on order to provide hooks that will help the engine to perform actions. For example, Bizforms add multiple divs/spans around normal input tags. So, you have to adapt the CSS you have created to match the tags used by Kentico.
What is your template type:
ASPX page: You can copy your entire HTML code from Dreamweaver into your aspx page template and then work on your page.
Portal Page: You need to understand the structure and cannot replace entire HTML Code from Dreamweaver. You have to seperate your HTML code to insert DropZone for web parts and widgets.
Good Luck!
You will have to make some adaptation always from raw HTML and kentico. In your case you are using aspx model which makes it more harder as server level changes are not 100% compatible with raw HTML or client side code. If possible use portal engine with transformation which will be more like to like of raw HTML.
You must create a directory in CSS/Stylesheet
If you're using the CSS section of the Admin interface, check to see if you have any & signs at the beginning of any tags. Kentico doesn't seem to support this so might be breaking any classes that appear after it.

Insert dependencies dynamically in View (Javascript and CSS Files)

Friends, I am willing to follow the rules of the W3C where it is recommended that javascript and CSS files should be in individual files and not within the page.
Good, following this rule, and not wanting to overload the master page, I would like to embed the dependencies dynamically. So how could I insert the libraries dynamically? I think the bigger problem is the Ajax requests.
Example:
<script type="text/javascript" src="http://sstatic.net/so/js/master.js?v=6523"></script>
I tried using the JavascriptResult, but he writes the content on the page, and do not run as "Stream."
Any help is welcome. Thanks
If I understand correctly the problem, you want to add script files dynamically to the page.
You can try jQuery load function, that can parse for you the result in very intuitive way.

Putting a servlet's reponse in a struts template's tile

I've set up my servlet to get invoked through a struts action and the result is that it writes html to the screen. However, I'm using a template system (lets say header, content, footer) and would only like to write to the content title ie. keep the header and footer.
Does anybody know if this is possible?
Thanks,
Gearoid.
You can either divide your output to 3 procedures, which mb are getHeader(), getContent() and getFooter(), and then write your output only in getContent(). Or you can use JSP includes, and write to include jsps: header.jsp and footer.jsp, and, while generating content output, just include this jsps. I would prefer second way to do it.
UPDATE: maybe this one can help you: Struts tiling
Use Iframe in jsp, and change the iframes src.Then the page will load as you expected.
Please post if you found some other solution to this.

Move generated javascript out of rendered html

One SEO advice we got was to move all javascript to external files, so the code could be removed from the text. For fixed scripts this is not a problem, but some scripts need to be generated as they depend on some ClientId that is generated by asp.net.
Can I use the ScriptManager (from asp.net Ajax or from Telerik) to send this script to the browser or do I need to write my own component for that?
I found only ways to combine fixed files and/or embedded resources (also fixed).
How about registering the ClientIDs in an inline Javascript array/hash, and have your external JS file iterate through that?
Spiderbots do not read JavaScript blocks. This advice is plain wrong.
Some javascript can break W3C validators (and possibly cause issues with some spiderbots)
You can reduce this by placing this code around your javascript:
< !-- no script
... your javascript code and functions ...
// -->
Note: remove the space between "<" and "!" as it seems to comment out the example here :-)

Resources