Closed aavrug closed 8 years ago
I don't exactly understand what you're trying to achieve haha
Can you give me some details?
I want to render a single file which will get data from php and js both.
So you want a template that can be used in PHP and JS?
How do you want to pass the data to the jade files?
There are multiple approaches to whatever you're trying to achieve, maybe you have some code examples and I just make them work? haha
article.story.article-hero
div.article-image-wrapper(alt=$post['story']['headline'], width='1280')
div.container
div.content
a.article-category(href=$link)= $post['story']['sections']['name']
h1.article-hero-headline= $post['story']['headline']
a.article-hero-author(href=$authorLink)
span= $post['story']['author-name']
div.timestamp= date('F d, Y, g:i a', $post['story']['published'])
And you want to use the same template in JavaScript?
What I'd do is probably rendering the template at the server and call it via AJAX (e.g. jQuery's load()
-method)
/path/to/your/templates/article.jade
article.story.article-hero
div.article-image-wrapper(alt=$post['story']['headline'], width='1280')
div.container
div.content
a.article-category(href=$link)= $post['story']['sections']['name']
h1.article-hero-headline= $post['story']['headline']
a.article-hero-author(href=$authorLink)
span= $post['story']['author-name']
div.timestamp= date('F d, Y, g:i a', $post['story']['published'])
/template.php
<?php
use Tale\Jade;
$renderer = new Jade\Renderer([
'cache_path' => './views/templates',
'paths' => ['/path/to/your/templates']
]);
//Get arguments fed by GET and POST
$args = array_replace($_POST, $_GET);
//Get template to parse by PATH_INFO or e.g. a specific $args variable
$path = $_SERVER['PATH_INFO'] ?? ($args['path'] ?? null);
if (!$path)
die("Template path not given");
//DONT FORGET TO SANITIZE $path, MAKE SURE . AND .. ARE NOT ALLOWED AND THE PATH DOESNT CONTAIN MALICIOUS STUFF
echo $renderer->render($path, $args);
/index.jade
[...]
body
#articleContainer
script.
$('#articleContainer').load('template.php/article', {
post: {
story: {
headline: 'Some headline',
sections: {
name: 'Some Category Name'
}
},
//etc.
}
})
This is the only way I see that really gives you full Tale Jade features in all your templates, server-side and client-side.
So, as much I got, this means I have to create two different files.
No, you basically just need one Jade template, but you need some kind of processing mechanism/proxy file to render these templates, since Tale Jade is simply a PHP library, you can't load it in JS dynamically.
Look at the above code, the article.jade
template can be used in PHP and JavaScript. In PHP you can use it normally ($renderer->render('article', ...)
) while in JS you have to use the Proxy-File (template.php
above) and AJAX (jQuery's load()
method in this case) ($('#selectorOfTheElementYouWantTheTemplateContentsIn').load('path/to/proxy/file.php/article', ...)
)
Ok great thanks. I think this will definitely solve my problem.
Sure. If you have further questions, keep this thread updated, we can re-open it then :)
Is there a way that I can create a single file and use for both purpose. One I am loading the contents setting some variable and if the content will send from js it will replace those variables?