How do I get the selected value in the dropdown and then display further information

Question

I have this dropdown that fetches the options from the database. I would like to know how can I get the value of that selected option then after selecting, other datas from the database will be displayed in a table or form? It would look like this

Before selecting

Select from dropdown : option1

Name:
Age:

After Selecting

Select from dropdown : option2

Name: Michael
Age: 21

Controller

 public function salesorders() { if ($this->session->userdata('logged_in')) { $this->header2(); $data['groups'] = $this->secretary_model->getAllGroups(); $this->load->view('secretary/transactions',$data); } else { redirect('secretary/sec_login_view'); } }

Model

function getAllGroups() { $query = $this->db->query('SELECT firstname FROM tblcustomer'); return $query->result(); }

View

<?php echo "Select Customer"; $options = array(); foreach($groups as $group) { $options[$group->firstname] = $group->firstname; } echo form_dropdown('dropdown', $options); ?> <br> <br> <br> <table id="myTable" class="table table-bordered" > <thead > <tr> <th>Order #</th> <th>Customer Name </th> <th>Items</th> <th>Note</th> <th>Qtt.</th> <th>Total Price</th> <th>Shipping Address</th> <th>Status</th> <th>Edit</th> </tr> </thead> <tbody>

can you teach me how i would be doing it ? I really have no idea thanks — Christian
– Christian, Commented Apr 26, 2015 at 0:42

Tpojka · Accepted Answer · 2015-04-26 01:47:44Z

Seems you need to populate first dropdown fields on page loading, than you need AJAX call to another method where you would pass selected name. In that method you would have code that pass AJAX input value to model that returns data by value (in this case by name) wich you would echo as json_encode back to ajax.

$(document).ready(function(){ $('.dropdownElementClass').on('change', function(){ var value = $(this).val(); $.ajax({ method: "POST", url: "<?php echo base_url('secretary/getDataByName');?>", data: { name: value } }) .done(function( output ) { $('.classOfElementExpectingData').text( output ); }); }); });

//next code for controller

public function getDataByName() { if ($this->input->is_ajax_request()) { echo $this->Secretary_model->getDataByName( $this->input->post('name') ) != FALSE ? json_encode( $this->Name_m->getDataByName( $this->input->post('name') ) ) : 'No data for selected name.' ; } else { echo 'No direct script access allowed.'; } }

There is fair amount of tutorials you can search on google or even on youtube for that. Study this one, could help you though. Or you would search for something like "codeigniter ajax" on this place first. I believe you can find many similar questions and answers. Good luck.

thank you for this one I already have the dropdown populated although i still cant figure out the way to post the other datas
I am not sure what is your next issue. Example I coded for you and also link I found and posted do the job. If you don't see next step in your code, try this way.

Collectives™ on Stack Overflow

How do I get the selected value in the dropdown and then display further information

1 Answer 1

2 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Related