Issue:
I am trying to parse an HTML string inside a blade template and then once the blade template is build, it get passed into a slot inside Vue.
example.blade.php
<p>{!! $market['description'] !!}</p>
Example.vue
<div class="d-none d-md-block">
<slot name="description"></slot>
</div>
Right now, when I click refresh it actually parses the HTML string and displays it correctly. And then once the blade template is injected into the slot in the Vue file, it goes back to an HTML string.
I hope this explanation makes sense. Let me know if you have any questions. Also, edits for the wording of the title are welcome.
Related
i have a laravel project where I need to print a pdf. I made the printing without problems, using a library DOMPDF, but inside the pdf i need to print a content of a Rich Text Area.
The UI:
The output is
Note
<p><b>Test</b></p><p><b><br></b></p><ul><li><b>Test 1</b></li><li><b>Test 2</b></li></ul><p><br></p>
The blade page have:
<div class="row">
<div class="col-xs-12">
<h4>Note</h4>
{{$plan->note}}
</div>
</div>
How can i print the html content correctly?
Basically Laravel does html entity encoding when you print something using {{ $plan->note }}.
In order to not to encode HTML elements, you have to use
{!! $plan->note !!}
This is not only for PDF. It can be used for web page rendering as well.
Is there any way to save the Laravel Component into the database and run it later in the Blade along with the HTML tags? For example, lets say the following HTML tags are recorded in the database:
<h1>Title Here</h1>
<x-component />
<p>The rest of the HTML tags</p>
I know you can render the HTML with {!! $query !!} tag but it's not actually rendering the component.
Thanks.
I recently started to build a Laravel/blade web application and I want to switch between what my layout view is showing. I want to replace 'content' with some other blade.php view when I press a button in the layout file. For example in ReactJS you can just determine the rendered content with an IF statement and some vars.
<div class="container">
#yield ('content')
</div>
I googled a bit but couldn't find a straight forward solution so I wondered if this is common in Laravel or do you just have to make a lot of different layout files with other #yield('...')? A lot of code would be duplicated right?
You can use conditional blade directives
#if(Session::get(user_type') == 'Admin')
#extends('layouts.admin')
#else
#extends('layouts.normal')
#endif
#section('title')
#endsection
#section('content')
etc ....
I have a header.blade.php in an includes folder, this header page is the whole webpage base. i have links on it and i have the header of the website which is included in all other web pages.
The heading part i want to retrive just the first line of the table result in it so the admin can update that line whenever possible.
The thing is that it is hard to figure out a route to give to it as it is a partial page.
The code on it is:
<div class="site-heading" data-webid="{{ $web_header->id }}>
<h1>{{ $web_header->header }}</h1>
<hr class="small">
<span class="subheading">{{ $web_header->slogan }}</span>
</div>
My home controller has the following code to display in the information on the header partial page:
public function showWebHeader()
{
$web_header = WebHeader::all()->first();
return view('include/header', [
'web_header' => $web_header
]);
}
I am lost and confused here because I keep getting undefined variable on every single page I have on my web system.
I'm cooking an extension using EXTbase and fluid for TYPO3 v7+ .
I'm here.. because I'm rendering my fluid templates based on certain controller conditions.Under a condition I want something like the html code being rendered from a user supplied template file.
I've used jQuery to bypass the situation..
<script>
$(function(){
$("#some_div_id").load("template_file.html");
});
</script>
Guess what.. I got the result I expected,but not really..
<div class="clearfix">
<ul id="image-gallery" class="gallery list-unstyled cS-hidden">
<f:for each="{slider}" as="user" key="label" iteration="iterator">
<li data-thumb="{user.src}">
<f:image crop="{user.crop}" treatidasreference="true" src="{user.filepath}" alt="{user.title}" style="width:100%; height:auto;"></f:image>
<f:if condition="{config.metadata.switch}!= 0">
<f:if condition="{user.title}">
<p class="light-caption" style="background: {config.metadata.opacity}; color: {config.metadata.color}; font-size: {config.metadata.size}%; text-align:{config.metadata.align};">{user.title}</p>
</f:if>
</f:if>
</li>
</f:for>
</ul>
</div>
This above is the code resulted.. See, the TypoScript variables are untouched.Little embarrassing.!!
Searching round the clock for an answer.Any ideas ?
What you need is a partial: https://docs.typo3.org/typo3cms/ExtbaseGuide/Fluid/ViewHelper/Render.html
In your Fluid template you would add a condition based on the variables provided from the controller
<f:if condition="{showPartial1}">
<f:render partial="SomePartial1" arguments="{_all}" />
</f:if>
<f:if condition="{showPartial2}">
<f:render partial="SomePartial2" arguments="{_all}" />
</f:if>
The partials are typically added in the Partials folder (should be in the same folder as your Templates folder) like that
Partials/SomePartial1.html
Partials/SomePartial2.html
In your controller action you can use $this->view->setTemplate('myDynamicTemplateName'); to use a different template than suggested by the action name.
Refer to: https://typo3.org/api/typo3cms/class_t_y_p_o3_1_1_c_m_s_1_1_fluid_1_1_view_1_1_template_view.html#a9c46c7bfe6a39b26478a2f37aec38d80
You are loading the plain template from the server - there is no PHP code involved that could render your template. You need to send the request in a way that the controller action is executed, renders the template, and then sends the rendered result to you.
The simplest way to do this is to use the extension typoscript_rendering. To use it, render a link to your controller action using the ViewHelper that the extension provides. It would look like this:
{namespace helhum=Helhum\TyposcriptRendering\ViewHelpers}
// Other stuff
<helhum:uri.ajaxAction action="actionName" controller="YourController"/>
Maybe you need to add other parameters - the ViewHelper takes the same parameter that the other f:uri.*-ViewHelpers take. In your JS, you can then send a request to that link (maybe put the link into some data-attribute), and will receive the rendered template.