How to load javascript css files into codeigniter ci

Question

I want to transfer my site to CI. I just changed from the ci welcome.php sample file in the index () function, I load the view to display. however I put a lot of javascripts and css files in the header file. and name it $this->load->view('header'); but I can not load javascript files correctly! Can someone give me some advice? It’s hard to configure how to set the right path.

 <script type="text/javascript" src="/assets/javascripts/order.js"></script> <script type="text/javascript" src="../assets/javascripts/order.js"></script> <script type="text/javascript" src="../../assets/javascripts/order.js"></script> 

my controller code is as follows

  class Welcome extends CI_Controller { public function index() { $this->load->helper('url'); $this->base = $this->config->item('base_url'); $this->load->view('header'); $this->load->view('welcome_message'); } 

}

belows is my folder structure

Answer 1

put your resources folder applications, system, assets

not in the application and just load the url helper class in the controller, where you call part of the header view something like

 $this->load->helper('url'); $this->load->view('header'); 

and just use something like this in your header file.
because $this->base_url() returns the / folder.

 <script src="<?php echo $this->base_url();?>assets/javascript/jquery.js"></script> 

Changing the folder structure because access to the application folder is only for the main part that I know.

here is the link if you want to know more about url helper

Answer 2

This is the best way with minimal code.

 <script src="<?php echo base_url('assets/javascript/jquery.js');?>"></script> <script src="<?php echo base_url('assets/css/bootstrap.min.js');?>"></script> 

Answer 3

Jogesh_p answer will surely solve the asset loading problem. I would like to continue this question that you gave

Thank you or your support. By the way, if I want to use some kind of library like phpMailler or the zend framework.

You can add application / libraries /

Then load it into the controller using the library class name

 $this->load->library('phpmailer'); 

Its choice for loading inside a constructor or an individual method.

Good luck

Answer 4

To solve my problem, I created helper functions for loading assets. And here is my code deployed in my application. PS: At first I planned a good / flexible directory structure.

[ some_helper.php ]

 /* * Created: 2017/12/14 00:28:30 * Updated: 2017/12/14 00:28:39 * @params * $url_structure = 'assets/js/%s.js' * $files = ['main.min', 'social'] * $echo = FALSE * */ function load_js($files = [], $url_structure = NULL, $version = '1.0', $echo = FALSE){ $html = ""; foreach ($files as $file) { if($url_structure){ $file = sprintf($url_structure, $file); } $file_url = base_url($file); $html .= "<script src=\"{$file_url}?v={$version}\"></script>"; } if($echo) { echo $html; } return $html; } /* * Created: 2017/12/14 00:28:48 * Updated: 2017/12/14 00:28:51 * @params * $version = '1.0' // Later load from configuration * $url_structure = 'assets/js/%s.css' * $files = ['main.min', 'social'] * $echo = FALSE * */ function load_css($files = [], $url_structure = NULL, $version = '1.0', $echo = FALSE){ $html = ""; foreach ($files as $file) { if($url_structure){ $file = sprintf($url_structure, $file); } $file_url = base_url($file); echo "<link rel=\"stylesheet\" href=\"{$file_url}?v={$version}\">"; } if($echo) { echo $html; } return $html; } 

Then called in view

[ some_view.php ]

 $css = [ 'path' => 'assets/css/%s.css', 'files' => ['bootstrap.min','style'] ]; load_css($css['files'], $css['path'], '1.0', TRUE); 

Hope this helps someone. In the case of OP $css['path'] = 'application/assets/css/%s.css'; the trick will be performed.

Updated Github code, which I will continue to update.

Answer 5

assets /CSS/bootstrap.min.css "

  <!-- Include JS --> <script src="<?php echo base_url();?>assets/js/jquery.js"></script> <script src="<?php echo base_url();?>assets/js/bootstrap.min.js"></script> 

Answer 6

 function addcategory() { //alert("<?php echo base_url();?>") $.ajax({ complete: function() {}, //Hide spinner url : '<?php echo base_url();?>category/search', data:$('#add_category').serialize(), type : "POST", dataType : 'json', success : function(data) { if(data.code == "200") { alert("category added successfully"); } }, beforeSend: function(XMLHttpRequest){}, //$.blockUI(); cache: false, error : function(data) { } }); }