how to get the parameter value from the query string in codigniter - ajax

I am new to codeigniter. I am passing a id in a href tag. I want this id to be diplayed in the controller. can any one please help me out. I have seen the similar question in stack overflow and I have tried the all the ways but none is working. can anyone help me out please.
Mycontroller
<?php
/**
*
*/
class Url extends CI_Controller
{
public function menu1( $product_id;)
{
echo $product_id;
// $data1 = $this->uri->segment(4);
// $id['data'] =$data1;
// $this->load->view('menu1',$id);
//$this->input->get('id', TRUE);
}
public function menu2()
{
$this->load->view('menu2');
}
public function menu3()
{
$this->load->view('menu3');
}
}
?>
View file
<!DOCTYPE html>
<html>
<head>
<title></title>
<link href="<?php echo base_url('assets/lib/bootstrap/css/bootstrap.min.css'); ?>" rel="stylesheet">
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-4">
<ul class="">
<?php $id=1;
?>
<li>menu1</li>
<li>menu2</li>
<li>menu3</li>
</ul>
</div>
<div class="col-md-4">
<div id="body" class="col-lg-12" >
</div>
</div>
</div>
</div>
</body>
<script type="text/javascript" src="<?php echo base_url('assets/lib/jquery/jquery-1.11.2.min.js'); ?>"></script>
<script type="text/javascript" src="<?php echo base_url('assets/lib/bootstrap/js/bootstrap.min.js'); ?>"></script>
<script>
$(function()
{
$('.update').click(function(event)
{
event.preventDefault();
//$('.update').removeClass("active");
//$(this).addClass("active");
$('#body').load($(this).attr('href'));
});
});
</script>
</html>
menu1.php
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<?php echo $data;
?>
</body>
</html>

View:
<li>menu1</li>
Controller:
public function menu1()
{
$data['product_id'] = $this->input->get('id');
// echo $product_id;
$this->load->view('menu1',$data);
}
In order to display the product_id in menu1.php:
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<?php echo $product_id; ?>
</body>
</html>

Related

why Laravel #yield and #section not wokring?

I have Master as a main page where I load dynamic pages.
Master
<!DOCTYPE html>
<html lang="en">
<head>
#include('backend.includes.header')
#yield('style')
</head>
<body>
#include('backend.includes.navbar')
<div class="mobile-menu-overlay"></div>
#yield('content')
#yield('script')
</body>
</html>
Dashboard
#extends('backend.master.master')
#section('style')
<link rel="stylesheet" href="{{ asset('backend/css/apexcharts.css') }}">
#stop
#section('content')
// Dashboard Code here
#endsection
#section('script')
<script src="{{ asset('backend/js/dashboard.js') }}"></script>
#endsection
It doesn't render #yield('style') and #yield('script')
Also my controller:
public function index(){
return view('backend.pages.home.dashboard');
}

Response is empty string

I am creating a simple upload files web application using laravel in the backend and I am trying to print the response that is sent from the server -which is supposed to be informed about the uploaded file- in the console, but it shows me an empty string.
here is my controller:
<?php
namespace App\Http\Controllers;
use Carbon\Carbon;
use Illuminate\Http\Request;
use Illuminate\Http\Response;
use Storage;
class UploadsController extends Controller
{
public function getUpload(){
return view('upload');
}
public function postUpload(request $request){
// //
$result = print_r($request,true);
$time = Carbon::now();
if ($request->hasFile('file')) {
$file = $request->file('file');
$extension = $file->getClientOriginalExtension();
$fileName = $file->getClientOriginalName();
//$upload_success = $file->storeAs('public',$file->getClientOriginalName());
$upload_success=Storage::disk('local')->put($fileName, fopen($file, 'r+'));
if ($upload_success) {
return response()->json(['request'=>$request->getContent()], 200);
}
else {
return response()->json('error', 400);
}
}
return response()->json('no file to upload', 400);
}
}
and my view where I am printing the response:
<html>
<head>
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>upload</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="/js/xhr2.js"></script>
<script type="text/javascript">
$(function(){
$('#upload').on("click",function(){
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
$("#file").upload("/upload",function(data){
$('#spin').css('display','none');
$('#msg').css('display','block');
console.log(data);
},function(prog,val){
$('#prog').html(val+"%");
$('#prog').width(''+val+'%');
if(val == 100){
$("#prog").html('Completed');
$('#spin').css('display','block');
}
});
});
});
</script>
</head>
<body>
<div class="container">
<div style="margin-top:5px"><input type="file" id="file" name="file" ></div>
<div style="margin-top:5px;margin-bottom: 5px">
<input type="button" id="upload" value="upload" class="btn btn-success btn-lg">
</div>
<div class="progress">
<div class="progress-bar" role="progressbar" style="width: 0%;" aria-valuemin="0" aria-valuemax="100" id="prog"></div>
</div>
<div id="spin" style="display:none">
<i class="fa fa-circle-o-notch fa-spin" style="font-size:24px"></i>
</div>
<div class="alert alert-success" style="display: none" id="msg" style="text-align: center">
<strong>Success!</strong>You have uploaded the file successfully
</div>
</div>
</body>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</html>
and here is a sample of what I get:
I would know if I am doing it wrong, and if not, why it is empty,
Thanks.
You're not using a form element.
Wrap your inputs in a basic html form:
<form method="POST" action="#">
#csrf
...
</form>
Then use jquery to post the form to the laravel route.

(CodeIgniter) Ajax return the main layout instead of the needed view

I got a headache with the ajax return result. Can everybody show me what's wrong with my code?
I have a main layout named "home.php", some important codes in this file as belows:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="<?=base_url();?>favicon.ico">
<title>IT Ebooks - Knowledge Sharing<?php if(isset($title_page)) echo " | ".$title_page ?></title>
<link href="<?=base_url();?>css/bootstrap.min.css" rel="stylesheet">
<link href="<?=base_url();?>css/font-awesome.min.css" rel="stylesheet">
<link href="<?=base_url();?>css/custom.css" rel="stylesheet">
</head>
<body>
<div id="main-content" class="col-md-9"><!--I will load the content here based on my controller & action-->
<?php
if($this->router->fetch_class()=="ListBy"){
$this->load->view("listby");
}
elseif($this->router->fetch_class()=="Home"){
$this->load->view("index");
}
elseif($this->router->fetch_class()=="User"){
if($this->router->fetch_method()=="Signup")
$this->load->view('signup.php');
}
?>
</div>
<script src="<?=base_url();?>js/jquery-3.1.1.min.js"></script>
<script src="<?=base_url();?>js/bootstrap.min.js"></script>
<script src="<?=base_url();?>js/bootbox.js"></script>
<script src="<?=base_url();?>js/listby.js"></script><!--this file do ajax function-->
</body>
</html>
My Home controller:
<?php
class Home extends CI_Controller {
public function __construct(){
parent::__construct();
$this->load->view('home.php');
}
public function index(){
//Do nothing
}
} //class
?>
My index.php file:
<section id="latest"><!--Latest upload-->
<div class="row">
<div class="col-md-8">
<p class="text-center text-primary header">Latest Uploads</p>
</div>
<div class="col-md-4">
<div class="form-inline">
<label>Books per page : </label>
<select class="form-control" id="PageSize" name="PageSize">
<option value="12" selected>12</option>
<option value="24">24</option>
<option value="36">36</option>
</select>
</div>
</div>
<div class="col-md-12" id="ajax-content">Ajax content loaded</div>
</div>
</section>
My ajax function file "listby.js":
$(document).ready(function(){
$.ajax({
type:"POST",
url:"AjaxProcessing1/loadByCategory",
data:"PageNo="+1+"&PageSize="+12,
dataType: "text",
success: function(response){
alert(response);//I used alert to show the problem
//$('#ajax-content').html(response);
},
error: function (xhr, ajaxOptions, thrownError) {
alert(xhr.status);
alert(thrownError);
}
});
})
My AjaxProcessing1 controller file:
<?php
class AjaxProcessing1 extends CI_Controller {
public function loadByCategory(){
$PageNo = $this->input->post('PageNo');
$PageSize = $this->input->post('PageSize');
$this->load->model('model_book');
$data['books'] = $this->model_book->get_latest_book($PageSize,$PageNo);
$this->load->view('ajax_result1',$data);
}
} //class
?>
My ajax_result1 page:
<?php
if(isset($books)){
?>
<div class="row">
<?php foreach($books as $book): ?>
<div class="col-md-3 col-sm-6">
<a href="<?=base_url();?>/ListBy/detail/<?=$book->id?>/<?=$book->slug?>">
<img class="anhsach" src="<?=base_url();?>img/cover/<?=$book->image;?>" alt="<?=$book->slug;?>"/>
</a>
</div>
<?php endforeach; ?>
</div>
<?php
}
?>
So, until here. Everything's OK when I'm in home page, the ajax function return the ajax_result1 as expected
[Pic1 - Load as expected][1]
But, when I'm in ListBy controller, the return of the ajax function is the main layout?
My ListBy Controller:
<?php
class ListBy extends CI_Controller {
public function __construct(){
parent::__construct();
$this->load->model('model_book');
}
public function index(){
//Nothing to do here
}
public function ListByCategory($category_id){
$data['title_page'] = "List by category";
$data['num_books'] = $this->model_book->number_of_books_bycategory($category_id);
$data['category_id'] = $category_id;
$this->load->view('home.php',$data);
}
} //class
?>
My listby.php file:
<?php
echo "<h3 class='text-center text-success'>".$num_books." book(s) found</h3>"
?>
<section id="cate">
<div class="row">
<div class="col-md-8">
<p class="text-center text-primary header">Select your books view per page</p>
</div>
<div class="col-md-4">
<div class="form-inline">
<label>Books per page : </label>
<select class="form-control" id="PageSize" name="PageSize">
<option value="12" selected>12</option>
<option value="24">24</option>
<option value="36">36</option>
</select>
</div>
</div>
<div class="col-md-12" id="ajax-content">Ajax content loaded</div>
</div>
</section>
<input type="hidden" id="total_record" value="<?=$num_books?>"/>
<input type="text" id="category_id" value="<?=$category_id?>"/>
<div class="row text-center">
<ul class="pagination">
</ul>
</div>
And the result I got when I'm in this controller (return the main layout):
[Not as expected][2]
So, what's going on with my code. Thanks so much for any help or suggestion in advanced.
[1]: https://i.stack.imgur.com/PeADW.png
[2]: https://i.stack.imgur.com/PAiO1.png
My project link in case you need: http://www.mediafire.com/file/ed1e31od1fk5vkg/itebooks-23Oct16.zip
Home extends CI_Controller { public function __construct() { parent::__construct(); //$this->load->view('home.php');
// THE PROBLEM is : you can't load the main/home layout in Home controller construct function }

How to properly insert a Bootstrap navbar in a Codeigniter view?

I'm learning to develop with CodeIgniter and would like a help to know how to properly insert a navbar in a view. I need to know which directory to save the navbar file and how to call this file in a view.
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<title><?php echo $produto['nome']; ?></title>
<!-- link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" -->
<link rel="stylesheet" href="<?php echo base_url("assets/css/bootstrap.min.css"); ?>">
</head>
<body>
I need navbar here (This is a home view)
<div class="container">
<div class="row">
<div class="col-md-12">
<?php echo $produto['nome']; ?>
<?php echo $produto['preco']; ?>
<?php echo $produto['descricao']; ?>
</div>
</div>
</div>
</body>
</html>
You can try create a template folder inside views folder and put some files like header.php, nav.php, footer.php. Inside your main view you can use like $this->load->view('template/nav);.
UPDATED
This is the typical of header.php
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
...
<title>Put_your_title_here</title>
<link rel="stylesheet" href="<?php echo base_url('css/bootstrap.min.css'); ?>">
...
</head>
<body>
<!-- depends on your template design -->
<div class="dashboard-wrapper">
<div class="main-content">
<?php $this->load->view('template/nav.php'); ?>
footer.php
<footer>Some footer content</footer>
</div><!-- /.main-content -->
</div><!-- /.dashboard-wrapper -->
<!-- Core Scripts - Include with every page -->
<script src="<?php echo base_url('js/jquery.min.js'); ?>"></script>
<script src="<?php echo base_url('js/bootstrap.min.js'); ?>"></script>
</body>
</html>
nav.php
<div class="navbar navbar-default" role="navigation">
...
</div>
Let say that your Controller (in this case Welcome.php) load a view like this:
<?php defined('BASEPATH') OR exit('No direct script access allowed');
class Welcome extends CI_Controller
{
public function __construct()
{
parent::__construct();
}
public function home()
{
$data['message'] = 'Welcome to My Website';
$this->load->view('welcome', $data);
}
}
welcome.php
<?php $this->load->view('template/header'); ?>
<p><?php echo $message; ?></p>
<?php $this->load->view('template/header'); ?>
NOTE Avoid echoing something directly from controller except some particular situation that force you to do so

jQuery mobile run on pagechange event to a specific page

I want to catch the event if a specific jQuery mobile page changes. For example, I used the code which I indicated below:
$(document).on("pagechange", function () {
alert("page changed");
});
But, how can I make this function run only for a specific page, for example: the page which has id="myPage"? I want to make it give alert only when myPage is changed.
(* I use multiple page structure in jquery mobile)
I think you could register events on page instead of document:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
</head>
<body>
<div data-role="page" id="pageone">
<div data-role="main" class="ui-content">
<p>Page 1</p>
<div data-role="navbar">
<ul>
<li><a href="#pagetwo" >TWO</a></li>
<li>ONE</li>
</ul>
</div>
</div>
</div>
<div data-role="page" id="pagetwo">
<div data-role="main" class="ui-content">
<p>Page 2</p>
<div data-role="navbar">
<ul>
<li>TWO</li>
<li><a href="#pageone" >ONE</a></li>
</ul>
</div>
</div>
</div>
<script>
$("#pageone").on("pageshow", function() {
alert("cambio a pagina 1");
});
$("#pagetwo").on("pageshow", function() {
alert("cambio a pagina 2");
});
</script>
</body>
</html>
If you prefer pagechange event, you could get the page URL:
$(document).on("pagechange", function(toPage) {
alert(toPage.currentTarget.URL);
});
$(document).on('pagechange', '#myPage', function (event) {
alert("I alert only on #myPage");
});

Resources