[eluser]Pedro Luz[/eluser]
I've been reading the documentation for the Javascript class, and doesn't make any sense to me.
what is suposed to return?
Code: <?php echo $library_src;?>
<?php echo $script_head;?>
and this path. This is a path to a directory? to the jquery file? to what?
http://localhost/codeigniter/themes/js/jquery/
Code: $config['javascript_location'] = 'http://localhost/codeigniter/themes/js/jquery/';
$config['javascript_ajax_img'] = 'images/ajax-loader.gif';
because... i don't know.. but everything i've tried, doesn't work.
thanks
[eluser]eokorie[/eluser]
Hi Pedro,
You aren't the only one who found it confusing as well.. I suppose they might still be working on that aspect of the library. I did however figure a few things out.
$library_src will output the location to you javascript files if you have defined them in your controller, where as $script_head, the way I understand it, should output any javascript codde defined in your controller.
"http://localhost/codeigniter/themes/js/jquery/" is still a bit dubious to me so hopefully someone can explain the issue here.
If you are using a template and want to use the javascript library, you may want to add Code: <?php echo $library_src;?>
<?php echo $script_head;?>
to the head of your html file and Code: <?php echo $script_foot; ?>
to your html footer, ideally before the closing </body> tag.
Any scripts, you enter in the controller will be displayed in $script_foot by default. If you wish to see an example of the Javascript library in use, let me know. Have been working on this for the past 2 days.
[eluser]Pedro Luz[/eluser]
hi, thanks for the reply.
im not in real urgency to put that to work, but if u have any idea how to do that, please do 
thanks
[eluser]eokorie[/eluser]
Just a quick example - for the example I am just showing below, I was trying to setup jQuery datatables with CodeIgniter
Define your template as I suggested earlier on.
This the code I had in my controller:
Code: <?php if (!defined('BASEPATH')) exit('No direct script access allowed');
/**
* @author [$username]
* @copyright [$year]
*/
class Javascript_Exp extends FrontController
{
function __construct()
{
parent::__construct();
$this->load->library('table');
$this->load->library('javascript', array('js_library_driver' => 'scripto'));
$this->load->model('blog_model');
}
function index()
{
$data = array();
$data['library_src'] = $this->javascript->external('/assets/js/jquery/jquery.js', TRUE);
$data['library_src'] .= $this->javascript->external('/assets/js/jquery/plugins/jquery.dataTables.js', TRUE);
$data['library_src'] .= $this->javascript->external('/assets/js/jquery/plugins/TableTools.js', TRUE);
$data['library_src'] .= $this->javascript->external('/assets/js/jquery/plugins/ZeroClipboard.js', TRUE);
$data['library_src'] .= $this->javascript->external('/assets/js/jquery.ui/js/jquery-ui-1.8.9.custom.min.js', TRUE);
$data['script_head'] = "";
$limit = 10;
$total = $this->blog_model->getArticles(array('count'=>TRUE));
$offset = $this->uri->segment(4);
if (!$this->input->is_ajax_request()) {
$data['blog_entries'] = $this->blog_model->getArticles(array('iDisplayStart'=>$limit, 'iDisplayLength'=>$offset,
'sortBy'=>'date_art', 'sortDirection'=>'desc'
));
} else {
$data['blog_entries'] = $this->blog_model->getArticles(array('limit'=>$limit, 'offset'=>$offset,
'sortBy'=>'date_art', 'sortDirection'=>'desc'
));
}
$tmpl = array (
'table_open' => '<table id="example" class="display" border="0" cellpadding="0" cellspacing="0" style="width: 100%">',
//'row_start' => '<tr valign="top">',
//'row_alt_start' => '<tr valign="top">',
'table_close' => '</table>'
);
$this->table->set_template($tmpl);
$table_data = array(form_checkbox('select_all', 'true', FALSE, 'class="toggle_all" id="select_all"'),
'ID',
'Article Title',
'Date Created',
'Status',
'Actions'
);
$this->table->set_heading($table_data);
$config['base_url'] = base_url() . 'experiments/javascript_exp/index';
$config['total_rows'] = $total;
$config['per_page'] = $limit;
$config['uri_segment'] = 4;
// $config['page_query_string'] = TRUE;
$this->pagination->initialize($config);
$this->javascript->output(array(
" $('#example').dataTable({
'bJQueryUI': true,
'bStateSave': true,
//'sDom': 'T<\"clear\">lfrtip',
//'sDom': '<\"H\"Tfr>t<\"F\"ip>',
'sDom': 'T<\"clear\">lfrtip<\"clear spacer\">T',
'oTableTools': {
'sSwfPath': '".base_url()."assets/js/jquery/plugins/copy_cvs_xls_pdf.swf',
'aButtons': [
{
'sExtends': 'text',
'sButtonText': 'Add New',
'sButtonClass': 'DTTT_button_new_item',
'sButtonClassHover': 'DTTT_button_new_item_hover',
'fnClick': function ( nButton, oConfig, oFlash ) {
alert( 'Mouse click' );
}
},
'copy', 'csv', 'xls', 'pdf','print',
{
'sExtends': 'collection',
'sButtonText': 'Save',
'aButtons': [ 'csv', 'xls', 'pdf' ]
}
]
}
});
$('.toggle_all').toggle(
function(){
$('input.toggle').each(function() {
this.checked = true;
});
}, function (){
var checked_status = this.checked;
$('input.toggle').each(function() {
this.checked = false;
});
}
);"
)
);
$this->javascript->compile();
$this->template->set_layout('one_column');
$this->template->build('javascript/javascript_1',$data);
}
}
[eluser]eokorie[/eluser]
In My View File:
Code: <?php echo "<link href='/assets/js/jquery/plugins/demo_table.css' type='text/css' rel='stylesheet' media='screen' />"; ?>
<?php echo "<link href='/assets/js/jquery/plugins/TableTools.css' type='text/css' rel='stylesheet' media='screen' />"; ?>
<?php echo "<link href='/assets/js/jquery.ui/css/redmond/jquery-ui-1.8.9.custom.css' type='text/css' rel='stylesheet' media='screen' />"; ?>
<h1>Javascript 1 Example</h1>
<div style="padding-right: 15px; padding-left: 15px;">
<?php
if (count($blog_entries) > 0) :
echo form_open(uri_string());
foreach ($blog_entries as $b) {
$this->table->add_row(array(form_checkbox("toggle[]",$b->id_art,FALSE,"id='edit_box_".$b->id_art."' class='toggle'"),
$b->id_art,
$b->title_art,
date("d-m-Y",strtotime($b->date_art)),
$b->status_art,
anchor(base_url().'admin/enquiries/update/'.$b->id_art,'Update').' | '.anchor(base_url().'admin/enquiries/delete/'.$b->id_art,'Delete')
));
}
echo $this->table->generate();
?>
<div>
<p style="clear: both;"><span><?php echo (isset($page_links) ? $page_links : ''); ?></span></p>
<span class="pagination" id="filter_pagination"></span>
</div>
<?php
echo form_close();
?>
<?php
else:
echo "No articles available";
endif;
?>
</div>
When you view the page in your browser, you should be able to see the libraries shown between the head tag of your html and the script in the controller shown just before the the closing body tag. Hope this helps in some way...
[eluser]Pedro Luz[/eluser]
thanks alot 
[eluser]ramm[/eluser]
Quote:In My View File:
Code: <?php echo "<link href='/assets/js/jquery/plugins/demo_table.css' type='text/css' rel='stylesheet' media='screen' />"; ?>
<?php echo "<link href='/assets/js/jquery/plugins/TableTools.css' type='text/css' rel='stylesheet' media='screen' />"; ?>
<?php echo "<link href='/assets/js/jquery.ui/css/redmond/jquery-ui-1.8.9.custom.css' type='text/css' rel='stylesheet' media='screen' />"; ?>
Can I ask why you echo the links to the js files with php instead of writing the tags in plain html?
I also was trying to figure this out, but just haven't had too much time...
[eluser]eokorie[/eluser]
[quote author="ramm" date="1296553594"] Quote:In My View File:
Code: <?php echo "<link href='/assets/js/jquery/plugins/demo_table.css' type='text/css' rel='stylesheet' media='screen' />"; ?>
<?php echo "<link href='/assets/js/jquery/plugins/TableTools.css' type='text/css' rel='stylesheet' media='screen' />"; ?>
<?php echo "<link href='/assets/js/jquery.ui/css/redmond/jquery-ui-1.8.9.custom.css' type='text/css' rel='stylesheet' media='screen' />"; ?>
Can I ask why you echo the links to the js files with php instead of writing the tags in plain html?
I also was trying to figure this out, but just haven't had too much time...[/quote]
It was a slight oversight on my behalf... I was planning on using the asset helper but I guess just got carried away with the coding.. Did not realise till it was all done.. my bad..
|
