I have been creating template for joomla 3.1, I was followed the instruction from joomla doc how to create it. Every thing is going fine. But, when I set module title is showed on front end, that module title is not showed. Below is snippet code of my template
<?php
defined('_JEXEC') or die( 'Restricted access' );
JLoader::import('joomla.filesystem.file');
?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" dir="<?php echo $this->direction; ?>" >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<jdoc:include type="head" />
</head>
<body>
<jdoc:include type="modules" name="top" />
<jdoc:include type="component" />
</body>
</html>
All module content is showed. Only the module title is not showed. Thanks for your advance
Your jdoc statement is missing the style attribute, which is what defines the type of module chrome is used, which is what renders the module's title. See http://docs.joomla.org/Module_chrome for more details.
Related
I have a situation where i have a view file users.blade.php which extends master. and the master includes another file called header.blade.php, i want to pass some data from users.blade to header.blade.
Here is the simplified version of the files
/****** Users.blade.php *********/
#extends('shared.master')
#section('title', 'Dashboard')
#section('pagecss')
<link rel="stylesheet" href="links to css file" />
#endsection
Here is the master.blade.php
/******Shared/master.blade.php ********/
<html>
<head>
<title>#yield('title')</title>
#include('shared.header')
</head>
<body >
#yield('content')
</body>
</html>
Here is the header file
/******Shared/header.blade.php ********/
<link rel="stylesheet" href="links to bootstrap" />
#yield('pagecss')
<link rel="stylesheet" href="links to other files" />
#yield('pagecss') doesn't work in the header.blade, but it does work in master.blade. Now i cant paste it in master.blade because there are some files which override other files, so it has to be in a specific order. Any ideas how to make the yield work in header.blade?
EDIT:
I do like Bharat Geleda approach, i have modified the code to include some heredocs to make it more convenient. But i think its kind of a hack and still looking for a better solution.
/********** Users.blade.php ***********/
#extends('shared.master')
#section('title', 'Dashboard')
#section('pagecss')
<link rel="stylesheet" href="links to css file" />
#endsection
<?php $pagecss = <<<CSS_FILES
<link rel="stylesheet" href="links to page css" />
CSS_FILES;
?>
/*********** Shared/header.blade.php **********/
#if(isset($pagecss))
{{-- */ echo $pagecss;/* --}}
#endif
A possible solution would be to do this
<?php $pagecss = '<link rel="stylesheet" href="links to css file" />'?>
/****** Users.blade.php *********/
#extends('shared.master')
#section('title', 'Dashboard')
master.blade.php would remain the same
/******Shared/master.blade.php ********/
<html>
<head>
<title>#yield('title')</title>
#include('shared.header')
</head>
<body >
#yield('content')
</body>
</html>
And then in your header file you could do this
/******Shared/header.blade.php ********/
<link rel="stylesheet" href="links to bootstrap" />
#if(isset($pagecss))
{{ $pagecss }}
#endif
<link rel="stylesheet" href="links to other files" />
EDIT: TESTING OUT QUESTION
main.blade.php (master in your case)
<html>
<head>
#include('test.header')
</head>
<body >
#yield('content')
</body>
</html>
header.blade.php
<link rel="stylesheet" href="links to bootstrap" />
#yield('pagecss')
<link rel="stylesheet" href="links to other files" />
users.blade.php
#extends('test.main')
#section('content')
CONTENT
#endsection
#section('pagecss')
<link rel="stylesheet" href="links to css file" />
#endsection
OUTPUT :
<html>
<head>
<link rel="stylesheet" href="links to bootstrap" />
<link rel="stylesheet" href="links to css file" />
<link rel="stylesheet" href="links to other files" />
</head>
<body >
CONTENT
</body>
</html>
I guess this is as expected.
Simple if it's working on homepage and not in inner views, that means you've used it, and Blade will take only the higher level and resolve it (include its content where it should be placed within #yield).
What I'm trying to say that if you got a #yield within your header file and you've used it as #section('pagecss') later you got another view as in your case Users.blade.php with the same statement #section('pagecss') blade won't take the inner one.
Solution
Nice way but foolish:
create another #yield within your shared header blade file and name it as level two or like so. i.e #yield('pagecss-2')
Good way:
using #parent, this directive is going to append (rather than overwriting) content to the layout
as mentioned here within docs of laravel
i'm a web devoper from Italy...I have a problem with loading with href
example:
i have one.html with this code
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta names="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<title>dkrMobile</title>
<!--caricamento librerie-->
<script src="js/jquery-1.9.1.min.js"></script>
<script src="js/jquery.mobile-1.3.1.min.js"></script>
<link rel="stylesheet" href="css/jquery.mobile-1.3.1.min.css">
</head>
<body>
<!-- LOGIN -->
<div data-role="page" id="loginPage">
<div data-role="content">
<div style=" text-align:center">
<img style="width: 70%;" src="http://www.laboncloud.it/dkrmobile/css/images/logdkr.png">
</div>
<form action="#pageFile">
<div data-role="fieldcontain">
<label for="userNameLogin">
Username
</label>
<input name="" id="userNameLogin" placeholder="" value="" type="text">
</div>
<div data-role="fieldcontain">
<label for="passwordLogin">
Password
</label>
<input name="" id="passwordLogin" placeholder="" value="" type="password">
</div>
<a data-role="button" data-theme="a" data-transition="fade" href="two.html" data-prefetch="trues">
Login
</a>
</form>
</div>
</div>
</body>
</html>
and the two.html with this code:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta names="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<title>dkrMobile</title>
<!--caricamento librerie-->
<script src="js/jquery-1.9.1.min.js"></script>
<script src="js/jquery.mobile-1.3.1.min.js"></script>
<link rel="stylesheet" href="css/jquery.mobile-1.3.1.min.css">
<link rel="stylesheet" href="css/jqm-icon-pack-fa.css">
<script type="text/javascript" src="js/tolito-1.0.5.min.js"></script>
<link rel="stylesheet" type="text/css" href="css/tolito-1.0.5.min.css" />
<!--css userinterface-->
<link rel="stylesheet" href="css/ui.css" />
</head>
<body>
<div data-role="page" id="loadingPage">
<div data-role="content">
<h1>caricamento di tutti i contenuti in corso</h1>
<a data-role="button" data-theme="a" data-transition="fade" href="#pageFile">skip</a>
</div>
</div>
<div data-role="page" id="pageFile">
<div data-role="content">
<h1>dueeee</h1>
</div>
</div>
<!-- FILE-->
</body>
</html>
now if tap on login - the two.html will no be loaded.
want a demo?
here the demo
if I click on skip in two.html dont show nothing (if I refresh the page it start work).
the only way is data-ajax="false" ? why?
This is not an error. To understand this problem you must understand how jQuery Mobile works.
Multi HTML template can't be mixed with multi page template. For example when working with several HTML pages, only first one can have more then one page. When jQuery Mobile loads other HTML files it will strip HEAD (we dont need it because first HTML HEAD content is already loaded into the DOM) and it will load ONLY first page it can find in a file, every other page will be discarded.
data-prefetch will not help you here. Also you are initializing it incorrectly, data-prefetch attribute don't have a value, it is just data-prefetch, example:
<a data-role="button" data-theme="a" data-transition="fade" href="two.html" data-prefetch>Login</a>
If you want to find out more how jQuery Mobile handles multiple HTML and multiple page templates or what are they take a look at this ARTICLE or THIS one. To be transparent they are my personal blog articles. Everything you need to know can be found there.
Basically solution to your problem would be to have all pages inside a single HTML file, or you should brake two.html into two separate HTML files. you decide what is a best solution for you.
My Search.cshtml has a div named "search-results" that is to be updated. SearchResults is the action name. I have done this many times on MVC2/VS2008 projects, but this is my first using MVC3 and VS2010.
The problem is, instead of my search result being rendered in my div, it clicking submit is redirecting me displaying my partial as a standalone page.
I have read that this may be because Ajax is not enabled. My _Layout.cshtml looks like this:
<!DOCTYPE html>
<html>
<head>
<title>#ViewBag.Title</title>
<script src="#Url.Content("~/Scripts/2011.2.712/jquery-1.5.1.min.js")" type="text/javascript"></script>
<link href="#Url.Content("~/Content/themes/base/jquery.ui.core.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/Content/themes/base/jquery.ui.datepicker.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/Content/themes/base/jquery.ui.theme.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/Content/main.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<script src="#Url.Content("~/Scripts/2011.2.712/jquery-1.5.1.min.js")" type="text/javascript"></script>
#(Html.Telerik().StyleSheetRegistrar().DefaultGroup(group => group.Add("telerik.common.css").Add("telerik.transparent.css").Combined(true).Compress(true)))
</head>
<body>
<div class="page">
<div id="header">
<div id="title">
<h1>My MVC Application</h1>
</div>
#(Html.Telerik().Menu()
.Name("menu")
.Items(menu => {
menu.Add().Text("Home").Action("Index", "Home");
menu.Add().Text("About").Action("About", "Home");
menu.Add().Text("Employees").Action("List", "Employee");
}))
</div>
<div id="main">
#RenderBody()
<div id="footer">
</div>
</div>
</div>
#(Html.Telerik().ScriptRegistrar().DefaultGroup(group => group.Combined(true).Compress(true)))</body>
</html>
Do I need to add MicrosoftMvcAjax.js or jquery.unobtrusive-ajax.js in? My web.config (root) contians the following:
<appSettings>
<add key="ClientValidationEnabled" value="true" />
<add key="UnobtrusiveJavaScriptEnabled" value="true" />
</appSettings>
If I add MicrosoftMvcAjax.js in at the end of the element, I get an error sayning namespace 'Type' is undefined error from the first line of MicrosoftMvcAjax.js:
Type.registerNamespace('Sys.Mvc');Sys.Mvc.$create_AjaxOptions=function(){return {};}
What am I missing here. I am sure my code is fine, as it copied alsmost verbatim from my MVC2 projects.
You forgot to include the jquery.unobtrusive-ajax.js script to your page (adjust the path as necessary):
<script src="#Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>
As far as Microsoft*.js scripts are concerned, they are obsolete in ASP.NET MVC 3 and should no longer be used unless you are porting some legacy application. They have been replaced by jQuery.
Ok, figured out my problem.
I was calling Ajax.BeginForm with the AjaxOption OnSuccess pointint to a js function that updated my place holder. But this is not needed, with unobtrusive. Once I removed the OnSucces from the Ajax options everything started working.
~S
I notice Magento uses prototype.js:
<script type="text/javascript\" src="http://www.example.com/js/prototype/prototype.js"></script>
My question is how I can change the URL to a Google hosted version of prototype.js which is minified.
I tried to change the URL in page.xml but it doesn’t work as the URL always starts with http://www.example.com
Any idea how to specify an absolute URL for this?
Thanks a lot!
The addJs, addCSS, etc. action methods are specifically designed for local files. You can't use them to add files at external URLs to the page. Instead, you'll need to add the URLs directly to Magento's head template.
You can do this by copying the base head template at
app/design/frontend/base/default/template/page/html/head.phtml
To your theme's template folder
app/design/frontend/default/your-theme/template/page/html/head.phtml
If you look at that template, you'll see the HTML and PHP template code used to render the head element of all Magento HTML pages.
<meta http-equiv="Content-Type" content="<?php echo $this->getContentType() ?>" />
<title><?php echo $this->getTitle() ?></title>
<meta name="description" content="<?php echo htmlspecialchars($this->getDescription()) ?>" />
<meta name="keywords" content="<?php echo htmlspecialchars($this->getKeywords()) ?>" />
<meta name="robots" content="<?php echo htmlspecialchars($this->getRobots()) ?>" />
<link rel="icon" href="<?php echo $this->getFaviconFile(); ?>" type="image/x-icon" />
<link rel="shortcut icon" href="<?php echo $this->getFaviconFile(); ?>" type="image/x-icon" />
<!--[if lt IE 7]>
<script type="text/javascript">
//<![CDATA[
var BLANK_URL = '<?php echo $this->helper('core/js')->getJsUrl('blank.html') ?>';
var BLANK_IMG = '<?php echo $this->helper('core/js')->getJsUrl('spacer.gif') ?>';
//]]>
</script>
<![endif]-->
<?php echo $this->getCssJsHtml() ?>
<?php echo $this->getChildHtml() ?>
<?php echo $this->helper('core/js')->getTranslatorScript() ?>
<?php echo $this->getIncludes() ?>
You can simply add HTML tags to this file to add any additional script tags you need. Don't forget to use the removeItem method to ensure the local prototype.js is NOT rendered.
If you wanted to get really fancy, rather than edit the template you could use Layout XML to add new scripts with something like this
<default>
<reference name="head">
<block type="core/text" name="cdn_prototype">
<action method="setText">
<text><![CDATA[<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/prototype/1.6.0.2/prototype.js"></script>]]></text>
</action>
</block>
</reference>
</default>
(advice here is 1.6.1 specific, but should apply to most, if not all, versions of Magento)
You'll find an extension for this purpose at the ever-helpful Inchoo blog (link).
If you read through the post, it will help understand some of the Block and layout architecture that Magento uses too.
This Magento extension allows to include external JS and CSS files via layout XML files.
After installing the extension, put the following line in page.xml:
<action method="addItem"><type>absolute_js</type><name>http://ajax.googleapis.com/ajax/libs/prototype/1.6.0.2/prototype.js</name>
Don't forget to use the removeItem method to ensure the local prototype.js is NOT rendered.
Link to the source directly:
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/prototype/1.6.0.2/prototype.js"></script>
Or via Google API:
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">google.load("prototype", "1.6.0.2");</script>
Read the manual, Search online before asking
I tried to retrieve the value of a particular variable and alert it.
That is,I wanted to get the value "{"attributes":[{"type":"Text","labels":"Untitled1"}]}
" in that variable. Using the success: function(msg) in ajax ,I alerted the value.
But instead of the required value :{"attributes":[{"type":"Text","labels":"Untitled1"}]}
I am getting the text given below. What is the problem?
1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>
CakePHP: the rapid development php framework: Forms
</title>
<link href="/cake_1_2/favicon.ico" type="image/x-icon" rel="icon" />
<link href="/cake_1_2/favicon.ico" type="image/x-icon" rel="shortcut icon" />
<link rel="stylesheet" type="text/css" href="/cake_1_2/css/cake.generic.css" />
</head>
<body>
<div id="container">
<div id="header">
<h1>
CakePHP: The rapid development php framework
</h1>
</div>
<div id="content">
{"attributes":[{"type":"Text","labels":"Untitled1"}]}
</div>
<div id="footer">
<a href="http://www.cakephp.org/" target="_blank">
<img src="/cake_1_2/img/cake.power.gif" alt="CakePHP: The rapid development php framework" border="0" />
</a>
</div>
</div>
</body>
The problem is that you still use the default layout. Try switching to another shipped layout for Ajax-responses:
// In your controller
$this->layout = 'ajax';