Home/ Questions/Q 8777101
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-13T19:12:45+00:00

I want to redesign keyboard app to touchscreen app for a bar ( I

  • 0

I want to redesign keyboard app to touchscreen app for a bar ( I am using Codeigniter).

I want that articles is displayed in two parts:
1. List of all the article_category
2. Below the tabs that selected article_category display article_name+article_price+article_image

VINES BEERS DRINKS<-categories

WHITE VINE <-different aricle names under tab VINES

RED VINE

MERLOT
CABERNET

I have SQL table articles with struct:
article_id
aricle_name
article_category
article_price
article_image

Looking for a solution, i found that JQUERY tabs will help me to solve a problem.

I found the CI cart demo on the web. I replaced its database with my.
It is working as expacted for tabs! I got all the categories listed in tabs.

But i dont know how to get the data for selected tab(look into category.php) ?

My file: app/controllers/cart.php

<?php
    class Cart extends Controller { // Our Cart class extends the Controller class
        function Cart()
        {
            parent::Controller(); // We define the the Controller class is the parent.

            $this->load->model('cart_model'); // Load our cart model for our entire class
        }
        function index()
        {
            $data['categories'] = $this->cart_model->retrieve_category(); // Retrieve an array with all categories
            $data['products'] = $this->cart_model->retrieve_products(); // Retrieve an array with all products
            $data['content'] = 'cart/categories'; // Select view to display
            $this->load->view('index', $data); // Display the page
        }
    }

My file: app/models/cart_model.php

<?php
class Cart_model extends Model {
    // Function to retrieve an array with all product information
    function retrieve_products(){
        $query = $this->db->get('phppos_item_kits');
        return $query->result_array();
    }
    // Function to retrieve an array with all product information
    function retrieve_category(){
        $this->db->select('distinct(category)');
        $this->db->from('phppos_item_kits');
        $query = $this->db->get();
        return $query->result_array();
    }
}

My file: app/views/cart/categories.php

<head>
<link href="<?php echo base_url(); ?>assets/js/base/jquery-ui.css" media="screen" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="<?php echo base_url(); ?>assets/js/jquery-1.8.2.js"></script>
<script type="text/javascript" src="<?php echo base_url(); ?>assets/js/base/jquery-ui.js"></script>
  <script>
  $(document).ready(function() {
    $("#tabs").tabs({event: "mouseover"});
  });
  </script>
</head>
<div id="tabs">
    <ul>
    <?php foreach($categories as $c): ?>
        <li><a href="#fragment"><span><?php echo $c['category']; ?></span></a></li>
    <?php endforeach;?>
    </ul>
        <div id="fragment">
        <?php foreach($products as $p): ?>
                <li><?php echo $p['name']; ?>,<?php echo $p['category']; ?></li>
        <?php endforeach;?>
        </div>
</div>

My file: app/views/index.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xml:lang="en-us" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CodeIgniter Shopping Cart</title>
<link href="<?php echo base_url(); ?>assets/js/base/jquery-ui.css" media="screen" rel="stylesheet" type="text/css"/>
<link href="<?php echo base_url(); ?>assets/css/core.css" media="screen" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="<?php echo base_url(); ?>assets/js/jquery-ui.min.js"></script>
<script type="text/javascript" src="<?php echo base_url(); ?>assets/js/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="<?php echo base_url(); ?>assets/js/core.js"></script>
</head>
<body>
<div>
    <?php $this->view($content); ?>
</div>
</body>
</html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    The solution should be in the PHP code (mainly), and then you should adapt your JavaScript accordingly.

    Specifically, for each category should be assigned a list of products belong to the category.
    It could be done with SQL or PHP.

    With SQL it could be done in a straightforward approach – one select for category list and then one select per category, which means 1+n select problem. But it might be acceptable for small amount of categories.

    Or it could be done with JOIN, which would eliminate 1+n problem.
    If you need to display even empty categories you will need LEFT OUTER JOIN, and [INNER] JOIN if you don’t.

    Hope it helps. Tell me if you need clarifications/examples.

    • 0