How can I prevent t-out from escaping my Html code?
I am trying to display an Html code on my Website. In older Odoo versions I used t-raw and it worked fine. Now in Odoo 16 t-raw is deprecated and t-out is the way to go. But t-out always escapes my code and displays it as text on my website.
This is my old code with t-raw:
<div class="row">
<t t-raw="html_output"/>
</div>
Here is my new code with t-out:
<div class="row">
<t t-out="html_output"/>
</div>
How can I stop t-out from escaping my Html code?
Related
In my code there is a loop and inside that I have a <a> tag ; I want to generate its link by using a server-base code function; part of my code:
<div v-for="file in fileList">
<div class="badge">
<i class="fa fa-cloud-download"></i> {{file.name}}
</div>
</div>
Is there any way to do this?
As you may know server code runs before the javascript, javascript run on the client browser. So when your server-based code runs it sees all of the javascript code as a static text.
A possible solutions here: is you do a normal javascript function that calls a RESTful API which create a link and send it back.
Having a trouble placing a background image in one of simple Vue.js project that I'm currently doing!
I've tried all the possible solutions that I could come up with. But no luck. That's why I'm here to have experts' help like you!
Having created the hero section, I tried to add a background image to that. Yes, the background image is imported to the right folder and the location of the folder is correctly written as well. However, once the compiler compiled the program, I get crickets! Nothing!
Here's the Sass code
.hero
background: url ('..../assets/clouds.jpg')
background-size: cover
background-color:#ffffff
And here's the HTML code for your reference
<div class = "home">
<section class="hero">
<div class="hero-body">
<div class=" container">
<h1 class="title"> {{heading}} </h1>
<div class="is-two-thids column is-paddingless">
<h2 class="subtitile is-4"> {{subheading}} </h2>
</div>
<a class="button is-large is-primary" id ="learn"> Learn More</a>
</div>
</div>
</section>
</div>
The funny thing is there's no error message shown. That's right, zero error messages.
This is the final product I received
For most of you out there, this should be a pretty simple fix. So, can you help this beginner out from this agony!
Thank you!
Edit: Got the following error message after adapting the change
background: url ('#/assets/clouds.jpg')
Edit 2: Sass file and its location.
It's location is src/router/mq.saas
Edit 3: Got the required one
Your issue is that ..../ is not a valid relative-path traversal symbol. Only ./ (current directory) or ../ (parent directory) are valid.
Assuming you've built the app with Vue CLI (v3), you should be able to use
background: url ('#/assets/clouds.jpg')
where # is configured as an alias for <projectRoot>/src.
See https://cli.vuejs.org/guide/html-and-static-assets.html#url-transform-rules
Alternately, construct a valid relative path from your Sass file / Vue component.
For example, say you're in src/mq.sass and want to reference src/assets/clouds.jpg, the relative path would be
background: url('./assets/clouds.jpg')
I am working on a legacy application that is being rewritten using Aurelia, the application has a bunch of static html in a tblHelp that needs to be displayed. I am using innerhtml.bind on a div in my view to databind the stored static HTML into the view. Each record is essentially a document complete with a full table of contents that links to other divs within the document (Bookmarks).
Something like:
<div id="toc">
<h1>Table of Contents</h1>
<ul>
<li>Section 1<li>
<li>Section 2<li>
</ul>
</div>
<div id="section1">
<h2>Section 1</h2>
<p>Paragraph Text...</p>
<p>Back to Table of Contents</p>
</div>
<div id="section2">
<h2>Section 2</h2>
<p>Paragraph Text...</p>
<p>Back to Table of Contents</p>
</div>
When I display the resulting page in my Aurelia view and click on the links, rather than moving to the proper Div on the current page, it seems to be attempting to route to an unknown route and ends up returning to the home page (that is my unknown route behavior). How do I make the Aurelia Router know that I am just moving around the same page and do not require it to route to another page?
I think you need to change your <div id= to <a id= which is the correct syntax for anchors. Hopefully Aurelia will recognize them as legitimate anchors when formatted correctly.
Also, since an anchor tag shouldn't wrap the whole content, you'll just open and close it at the top of the div. You can even leave the divs there but should not duplicate the id.
Update:
That being said, I created a GistRun that actually demonstrates that Aurelia should be able to handle the <div id= anchor targets. So, I'm not exactly sure why you're having problems.
Maybe this GistRun or the more standard <a id= approach will help you.
I am new to working with worklight enviroment and started working it on recently.
I am using dojo version 1.9 (the IBM supllied one) , worklight 6.1, OS windows 7, eclipse juno sr2 64bit, IE 10 (For RPE), Google chrome latest (As default browser).
I have tried many widgets in dojo mobile and all of them work fine, i have been through other questions too like "Worklight 6.1 Android Applicaiton renders all views with no widgets" and followed all steps given in the solution and successfully created and viewed the pages on both MBS and android emulator.
The only problem is when i am working with views. I add a tabBar from dojo and TabBarButtons for view transitions . Also add a few views in the pages and link them with the buttons. I also check and see that my main.js file is updated with all included elements.
Although the toolbar along with default view is visible it does not switch view when i click on other buttons in tabBar.
also onclicking the TabBarButtons an error popsup in chrome console -
Uncaught TypeError: undefined is not a function
This error pops up on each click .
here is the structure of my source code of in the body tag of index.html file :-
<body style="display: none;">
<div data-dojo-type="dojox.mobile.View" id="view2"
data-dojo-props="selected:true">
<div data-dojo-type="dojox.mobile.View" id="view0" data-dojo-props="selected:true" >
<div data-dojo-type="dojox.mobile.Heading"
data-dojo-props="label:'Hello world'"></div>
<button data-dojo-type="dojox.mobile.Button">Hello</button>
<input data-dojo-type="dojox.mobile.TextBox"><input type="range"
data-dojo-type="dojox.mobile.Slider"
data-dojo-props="orientation:'H'">
</div>
<div data-dojo-type="dojox.mobile.View" id="view1"
data-dojo-props="selected:false">
<div data-dojo-type="dojox.mobile.Heading"
data-dojo-props="label:'About',moveTo:'view0'">
</div>
<div data-dojo-type="dojox.mobile.RoundRect">
Hello, we are a leading company in innovations
</div>
</div>
<ul data-dojo-type="dojox.mobile.TabBar" fixed="bottom" id="Tab1">
<li data-dojo-type="dojox.mobile.TabBarButton" data-dojo-props="moveTo:view0,transition:'slide'" id="tabB1">Home</li>
<li data-dojo-type="dojox.mobile.TabBarButton" data-dojo-props="moveTo:view1,transition:'slide'" id="tabB2">About</li>
</ul>
</div>
<script src="js/initOptions.js"></script>
<script src="js/main.js"></script>
<script src="js/messages.js"></script>
</body>
// Rest all is default code, no changes in jquery version or anything else
I have also tried the following things and none of them seem to work:-
-Copied and replaced files in www folder from dojoLib/dojo/dojo/nls/core-web-layer.js and mobile-web-layer.js files.
-Kept the Tabbar out of any view directly into body tag and linked views to it.
-Added id attribute to tabBar and tab button elements, and view elements.
-turned off provide missing library resources and included missing files (if any) ,rebuilt the project and ran again.
The main issue (causing the exception) is the missing quotes around the view ids of the moveto attributes. It should be:
data-dojo-props="moveTo:'view0',
Once fixed, your sample will work.
But there are another issue, this time a design one: the TabBar fixed property is only meaningful when used with a ScrollableView (this property ensures the tabbar is not scrolled and keeps its bottom position). So your outer view should be a ScrollableView instead.
Also, note that nesting views come with some limitations. In particular, using the 'moveto' attribute you cannot transition from a view to another view if the latter is contained in another parent.
Do not hesitate to look at the various tests in dojox/mobile/tests and to the documentation
A rich snippet example from Schema.org http://schema.org/AggregateRating:
<html>
<div itemscope itemtype="http://schema.org/Product">
<img itemprop="image" src="dell-30in-lcd.jpg" />
<span itemprop="name">Dell UltraSharp 30" LCD Monitor</span>
<div itemprop="aggregateRating"
itemscope itemtype="http://schema.org/AggregateRating">
<span itemprop="ratingValue">87</span>
out of <span itemprop="bestRating">100</span>
based on <span itemprop="ratingCount">24</span> user ratings
</div>
</div>
</html>
But http://www.google.com/webmasters/tools/richsnippets won't show a preview.
So, the following words from http://support.google.com/webmasters/bin/answer.py?hl=en&answer=146645 are just lies?
New! schema.org lets you mark up a much wider range of item types on
your pages, using a vocabulary that Google, Microsoft, and Yahoo! can
all understand. Find out more. (Google still supports your existing
rich snippets markup, though.)
It is working absolutely fine.
Google is not obliged to show you preview every time, and here it shows an error when I inserted your give example from schema.org:
The following errors were found during preview generation:
This page does not contain authorship or rich snippet markup.
I have done it in my website's news pieces and it shows fine.