Link to home
Start Free TrialLog in
Avatar of Eduardo Fuerte
Eduardo FuerteFlag for Brazil

asked on

Could you point how to correctly positionate this icon at left side of this Bootstrap combobox?

Hi Experts

Could you point how to correctly positionate this icon at left side of this Bootstrap combobox?

It must appear in a similar way than the textbox.

Accordingly with:
User generated image
  <div class="row">
	<div class="col-xs-12 mb15">                           
		<!--label for="fk_seguradora" class="field-label text-muted mb10">Cliente Corporativo</label-->
		<!--span class="input-group-addon "-->
				<i class="fa fa-search c-gray"></i>
		<!--/span-->
		<label for="fk_seguradora" class="validar field select">
			<?php echo $fk_seguradora; ?>
			<i class="arrow double"></i>
		</label>
	</div>
</div>

Open in new window


Thanks in advance!
Avatar of Julian Hansen
Julian Hansen
Flag of South Africa image

Do you mean like this
<div class="input-group">
  <span class="input-group-addon"><i class="glyphicon glyphicon-search"></i></span>
  <select class="selectpicker form-control">
    <option>Selecione ...</option>
    <option>ZURICH</option>
    <option>BANCO SAFRA</option>
    <option>SANTANDER</option>
  </select>
</div>

Open in new window

Working sample here

EDIT
NB: I changed to using GlyphIcons as that is what is supported on my server. Change to FontAwesome as required.
Avatar of Eduardo Fuerte

ASKER

Hi Julian

Your examle perfectly runs in my test.
User generated image
But since this combobox is dynamically mounted:
<div class="input-group">
  <span class="input-group-addon"><i class="glyphicon glyphicon-search"></i></span>
  <select class="selectpicker form-control">
    <option>Selecione ...</option>
    <option><?php echo $fk_seguradora; ?></option>
  </select>
</div>

Open in new window


It doesn't run correctly in this case:
User generated image
This question is directly conected to that other (If you could have a look)
I can't see why it won't work - are you saying that CI does not generate the right code?
Codeigniter's Controller code relevant to combobox:

public function index() {

	// SELECT/DROPDOWN do Seguradora
	$fk_seguradora = $this->cliente_corporativo_model->new_get(array('query' => 'select * from meeta_ike_relatorios.system_seguradora'));
	$dropdown[0] = 'Selecione ...';
	foreach ($fk_seguradora as $key => $value)
		$dropdown[$value->id_seguradora] = $value->nome_seguradora;

	$this->data['fk_seguradora'] = form_dropdown('fk_seguradora', $dropdown, '', 'id="id_seguradora"');
	unset($dropdown);

Open in new window


If I use this view code:
<label for="fk_seguradora" class="validar field select">
    <?php echo $fk_seguradora; ?>
    <i class="arrow double"></i>
</label>

Open in new window


Runs this way:
User generated image
But since the value must be a "selected", working the same way as this harded code:
<div class="col-xs-12 mb15">
	<div class="input-group">
		<span class="input-group-addon ">
			<i class="fa fa-search c-gray"></i>
		</span>
		<span class="select">
			<select id="fk_seguradora" name="fk_seguradora">
				<option value="" selected="selected">...Cliente Corporativo...</option>
				<option value="1">Ace</option>
				<option value="2">Zurich</option>
				<option value="3">Banco Safra</option>
				<option value="4">SANTANDER</option>
				...
			</select>
		</span>
	</div>
</div>

Open in new window


My doubt is: what changes have to be done in CI Controller and View to have it working ....
(if possible with the icon left side)
I am still not with you. This code outputs a <label>
<label for="fk_seguradora" class="validar field select">
    <?php echo $fk_seguradora; ?>
    <i class="arrow double"></i>
</label>

Open in new window

Where is the <select> part?
The presented  Codeigniter's Controller perfectly mounts  combo without select.

I'm trying to mount a combo - that must work in a similar way than the harded coded above, that uses select.
(it must to use select since the value must to be used in a filter)

I don't know if I'm going the right way by coding this in Controller:
$fk_seguradora_f= $this->cliente_corporativo_model->new_get(array('query' => 'select * from meeta_ike_relatorios.system_seguradora'));
$options = array();
foreach ($fk_segurdora_f as $key => $value){
	$options[$value['id_seguradora']] = $value['fk_seguradora'];
	}
	$this->data['fk_seguradora_f'] = form_dropdown($dropdown, $options);
	unset($dropdown);

Open in new window



Than in the view code something like this:
<div class="col-xs-12 mb15">
	<div class="input-group">
		<span class="input-group-addon ">
			<i class="fa fa-search c-gray"></i>
		</span>
		<span class="select">
			<select id="id_seguradora" name="fk_seguradora_f">
			</select>
		</span>
	</div>
</div>

Open in new window

ASKER CERTIFIED SOLUTION
Avatar of Julian Hansen
Julian Hansen
Flag of South Africa image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Hi Julian

In the meanwhile I strugled a lot with this issue.

Controller's Code:
public function index() {
   ...
	$this->data['fk_seguradora_f'] = $this->seguradora_model->get_seguradoras();

Open in new window




View Code:
<div class="row">
	<div class="col-xs-12 mb15">
		<div class="input-group">
			<span class="input-group-addon ">
				<i class="fa fa-search c-gray"></i>
			</span>
			 <span class="select">
				 <select id="fk_seguradora" name="fk_seguradora">
						<?php
						foreach($fk_seguradora_f as $each)
						{
						?>
							<option value="<?=$each['id_seguradora']?>"><? echo '????'?></option>
						<?php
						}
						?>
				</select>
			  </span>
		</div>
	</div>
</div>

Open in new window


The filter runs OK.


But I still don't know to correctly form the combo in the

 Model code:

 function get_seguradoras($fk_seguradora_f=null  ) 
    { 
        $data_room_type = array();
        $this->db->select('id_seguradora', 'nome_seguradora');
        $this->db->from('system_seguradora');
        $query = $this->db->get();

        
        if ($query->num_rows() > 0) {
            foreach ($query->result_array() as $row) {

               //----- How to obtain here  id / name ????
                $data_room_type[] = $row;
               //-----------------------------------------------------

            }
        }
        return $data_room_type;
    }
}

Open in new window


The filter perfectly runs (even the name doesn't appears):
User generated image
So I guess this question is closer the solution... could you give your talent again?
Still struggling to fill in the gaps but is it not as simple as
<div class="row">
	<div class="col-xs-12 mb15">
		<div class="input-group">
			<span class="input-group-addon ">
				<i class="fa fa-search c-gray"></i>
			</span>
			 <span class="select">
				 <select id="fk_seguradora" name="fk_seguradora">
						<?php
						foreach($fk_seguradora_f as $each)
						{
						?>
							<option value="<?php echo $each['id_seguradora']?>"><?php echo $each['nome_seguradora'];?></option>
						<?php
						}
						?>
				</select>
			  </span>
		</div>
	</div>
</div>

Open in new window


If you want a specific value selected then we would need to know where to get this value from - what determines what value is selected in the list?
Thanks for help.

Since this question had a derivation I decided to open another question.
Just doing this:

<option value="<?=$each['id_seguradora']?>"> <?=$each['nome_seguradora']?></option>

Open in new window


Instead of:
<option value="<?php echo $each['id_seguradora']?>"><?php echo $each['nome_seguradora'];?></option>

Open in new window


Made it correctly runs.
That makes sense.

As a general rule avoid any and all implementations that make use of the "old" PHP short cut tags.

<?php echo

Is the only way you should be doing your outputs - never <?= ...
Ok!

I followed your advice.