How to include css and jquery in joomla component

Question

I am add some jquery and css into a joomla component file view/edit/tmpl/default.php. I know I need to use jdoc include, but what is the steps of doing so? Where should I put the jdoc:include?

The code is like this.

<?php
// No direct access to this file
defined('_JEXEC') or die('Restricted access');

 $row = $this->row;
?>

<div class="componentheading" style="margin-bottom:10px;">Edit Event</div>

<form id="form" method="post" action="index.php?option=com_event&view=save" >

        <table >
                    <tr>
                            <td>Title</td>
<td><input type="text"     name="title" value="<?php echo $row->title;?>"></td>
                    </tr>

                    <tr>
                            <td>Start Time</td>
   <td><input type="text" name="from" value="<?php echo $row->from;?>" id="datetimepicker"></td>
                    </tr>
</form>

The files that need to be include

-jquery.datetimepicker.css
-jquery.datetimepicker.js
-jquery.js

Krish R · Accepted Answer · 2014-01-03 07:09:07Z

3

Can you try this,

 $document =& JFactory::getDocument();
 $document->addStyleSheet('your css url here ');// for css
 $document->addScript('your jaavscript url here ');// for script

Ref: http://docs.joomla.org/J3.2:Adding_JavaScript_and_CSS_to_the_page

answered Jan 3, 2014 at 7:09

Krish R

22.7k7 gold badges54 silver badges60 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Soya Over a year ago

I am not quite understand the logic behind & JFactory::getDocument(); Could you please explain? Thank you!

Ejaz · Accepted Answer · 2016-01-14 14:51:16Z

1

Since jQuery is included with Joomla 3, you can use following code in the view you want to include jQuery in

JHtml::_('jquery.framework');

And for the CSS part, use following traditional method

/**
 * Notice only = instead of &=
 *
 */
$doc = JFactory::getDocument();
$doc->addStyleSheet(JURI::root(true) . '/your/css/path/here');

or

JHTML::stylesheet('/your/css/URL/here');

edited Jan 14, 2016 at 14:51

answered Jan 14, 2016 at 14:34

Ejaz

8,8723 gold badges38 silver badges52 bronze badges

Collectives™ on Stack Overflow

How to include css and jquery in joomla component

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related