Bootstrap table not cropping for tablet devices - php

I'm using Twitter-Bootstrap for a table. The table works fine for bigger screens and for mobile. For tablet it doesn't work. What I want is the following:
The image above is how it is on mobile. I want this too for tablet, but when I select tablet resolution on Chrome I get this:
It's not responsive. How can I fix this?
Code:
<div class="table-responsive">
<table class="table">
<thead>
<tr>
<th>Breedte</th>
<th>Hoogte</th>
<th>Doekkleur</th>
<th>Omkastingkleur</th>
<th>Bedieningtype</th>
<th>Bedieningkant</th>
<th>Uitvoer</th>
<th>Geleider links</th>
<th>Geleider rechts</th>
<th>Opvulling</th>
<th>Onderlat-type</th>
<th>Extra</th>
<th>Prijs</th>
<th>Actie</th>
</tr>
</thead>
<tbody>
<?php foreach ($result as $offer) { ?>
<tr>
<td><?php echo $offer['width'] ?></td>
<td><?php echo $offer['height'] ?></td>
<td><?php echo $offer['clothingcolor'] ?></td>
<td><?php echo $offer['housingcolor'] ?></td>
<td><?php echo $offer['controltype'] ?></td>
<td><?php echo $offer['controlside'] ?></td>
<td><?php echo $offer['output'] ?></td>
<td><?php echo $offer['conductorleft'] ?></td>
<td><?php echo $offer['conductorright'] ?></td>
<td><?php echo $offer['stuffing'] ?></td>
<td><?php echo $offer['underlattype'] ?></td>
<td><?php echo $offer['extra'] ?></td>
<td><?php echo $offer['price'] ?></td>
<td><button type="submit" class="btn btn-link" name="getValue" data-toggle="modal" data-target=".editProduct<?php echo $offer['id']; ?>" data-id="<?php echo $offer['id']; ?>"><i class="fa fa-pencil" aria-hidden="true" style="color: red;"></i></a></td>
</tr>
<?php } ?>
</tbody>
</table>
</div>

Related

How can i use the a tag

I have some code and would like to add an hyperlink to each entry on my database
tried using the 'a' tag
<tr>
<td><?php echo $row['id']; ?></td>
<td><a href='details.php'><?php echo $row['game_name']; ?></a></td>
<td><?php echo $row['game_year']; ?></td>
<td><?php echo $row['system']; ?></td>
<td style="text-align: center; color:green"><?php echo $row['owned']; ?></td>
<td style="text-align: center; color:blue"><?php echo $row['completed']; ?></td>
<td><?php echo $row['media']; ?></td>
<td><?php echo $row['launcher']; ?></td>
<tr>
would like to be able to link to a details page

<a href='details.php?gameID=<?=$row['id']?>'>
And in your details.php page you could fetch your DB:
$gameID = (int)$_GET['gameID'] and a bit more error handling

Use variables in PHP foreach loop

I use a foreach loop in php to fill a table, after that I use id and data-id to work with the line of the table.
The problem is that I can't figured how to increment a variable during the loop and add it in the id like this :
id='addr0' data-id="0",
id='addr1' data-id="1"
// etc.
Here is my loop :
foreach($result as $key => $value): ?>
<tr id='addr0' data-id="0">
<td><?php echo $value['Nom']; ?></td>
<td><?php echo $value['Prenom']; ?></td>
<td><?php echo $value['Adresse']; ?></td>
<td><?php echo $value['Date de naissance']; ?></td>
<td><?php echo $value['Numero de telephone']; ?></td>
<td data-name="del">
<button nam"del0" class='btn btn-danger glyphicon glyphicon-remove row-remove'></button>
</td>
</tr>
<?php endforeach; ?>

Try the following.
$counter = 0;
foreach($result as $key => $value): ?>
<tr id='addr<?php echo $counter?>' data-id="<?php echo $counter?>">
<td><?php echo $value['Nom']; ?></td>
<td><?php echo $value['Prenom']; ?></td>
<td><?php echo $value['Adresse']; ?></td>
<td><?php echo $value['Date de naissance']; ?></td>
<td><?php echo $value['Numero de telephone']; ?></td>
<td data-name="del">
<button name = "del<?php echo $counter?>" class='btn btn-danger glyphicon glyphicon-remove row-remove'></button>
</td>
</tr>
<?php
$counter++;
endforeach;
?>

You can get auto increment in two way.
Case 1 : If your $result is indexed array.
foreach($result as $key => $value): ?>
<tr id="addr<?php echo $key ?>" data-id="<?php echo $key ?>">
<td><?php echo $value['Nom']; ?></td>
<td><?php echo $value['Prenom']; ?></td>
<td><?php echo $value['Adresse']; ?></td>
<td><?php echo $value['Date de naissance']; ?></td>
<td><?php echo $value['Numero de telephone']; ?></td>
<td data-name="del">
<button nam"del<?php echo $key ?>" class='btn btn-danger glyphicon glyphicon-remove row-remove'></button>
</td>
</tr> <?php endforeach; ?>
Case 2 : If your $result is associative array.
<?php
$i = 0;
foreach($result as $key => $value): ?>
<tr id="addr<?php echo $i ?>" data-id="<?php echo $i ?>">
<td><?php echo $value['Nom']; ?></td>
<td><?php echo $value['Prenom']; ?></td>
<td><?php echo $value['Adresse']; ?></td>
<td><?php echo $value['Date de naissance']; ?></td>
<td><?php echo $value['Numero de telephone']; ?></td>
<td data-name="del">
<button nam"del<?php echo $i ?>" class='btn btn-danger glyphicon glyphicon-remove row-remove'></button>
</td>
</tr>
<?php
$i++;
endforeach;
?>

php table not displaying contents and only creating table boxes

I would like the table to display all the values inside of it, but it is currently not displaying the values and only creating an empty table
[what the table is displayed as (image)][1]
$result = mysqli_query( $conn,'SELECT * FROM Pictures ');
$conn->close();
Html
<html>
<table border="2" style= "background-color: #84ed86; color: #761a9b; margin: 0 auto;"
<thead>
<tr>
<th>id</th>
<th>Name</th>
<th>image</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<?php
if( $result != null){
Result is not empty
while( $row1 = mysqli_fetch_assoc( $result ) ){
foreach ($row1 as $row){
?>
<tr>
<td><?php $row['id'] ?></td>
<td><?php $row['hname'] ?></td>
<td><?php $row['himage'] ?></td>
<td><?php $row['hdesc'] ?></td>
</tr>
<?php
}
}
}else{
echo "Something went wrong with the result";
}
?>
</tbody>
</table>
<?php //mysqli_close($conn); ?>
</body>
</html>
changed the out put to match the answer you gave but the output came out as picture 2 while my table is actually picture 3 any ideas
output:
table im trying to display

Display the data in this way:
<td><?php echo $row['id']; ?></td>

Try changing
<td><?php $row['id'] ?></td>
<td><?php $row['hname'] ?></td>
<td><?php $row['himage'] ?></td>
<td><?php $row['hdesc'] ?></td>
to
<td><?php echo $row['id']; ?></td>
<td><?php echo $row['hname']; ?></td>
<td><?php echo $row['himage']; ?></td>
<td><?php echo $row['hdesc']; ?></td>
or the shorthand variant
<td><?= $row['id']; ?></td>
<td><?= $row['hname']; ?></td>
<td><?= $row['himage']; ?></td>
<td><?= $row['hdesc']; ?></td>
And as Samuel pointed out in a comment, are you sure there is a need for the extra foreach considering you're already looping with the while?
Update: OP have you tried the following?
while( $row = mysqli_fetch_assoc( $result ) ){
//removed foreach()
?>
<tr>
<td><?php echo $row['id']; ?></td>
<td><?php echo $row['hname']; ?></td>
<td><?php echo $row['himage']; ?></td>
<td><?php echo $row['hdesc']; ?></td>
</tr>
<?php
}
}else{
Update 2 OP wishes to have the image load instead of showing the raw URL.
To do this, we need to use an actual image tag and insert the url into the src.
I assume that this line is the image URL
<td><?php echo $row['himage']; ?></td>
So change it to
<td> <img src="<?php echo $row['himage']; ?>" > </td>

updating a textfield based on radio button selection

I have some 25 radio buttons, such that only one selection can be done. On selecting a particular radio-button, an ajax update is to be performed on the risk grade textfield of this form. And, this textfield should get uniquely updated on every radio-button selection.
How's this possible. Please, I am really stuck here.
I had done by normal radio button code for each one.
I used the ajax update as done in dependent dropdown textfield, but, I am not sure the same thing is appropriate here.
I think I am getting something wrong here. Any thing would be really helpful.
<table id="department_permissions_table" class="display">
<thead>
<tr style="background-color: lavender"><td style="background-color: white"></td><td><b>Effect</b></td>
<td></td><td></td>
<td></td><td></td></tr>
<tr>
<td style="background-color: lavender"><b>Likelihood of recurrence</b></td>
<td style="background-color: #f5f5f5"><b>Negligible</b></td>
<td style="background-color: #f5f5f5"><b>Minor</b></td>
<td style="background-color: #f5f5f5"><b>Moderate</b></td>
<td style="background-color: #f5f5f5"><b>Major</b></td>
<td style="background-color: #f5f5f5"><b>Catastrophic</b></td>
</tr>
</thead>
<tbody>
<tr>
<td style="background-color: #f5f5f5"><b>Almost certain</b></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>11,'uncheckValue'=>null)); ?></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>12,'uncheckValue'=>null)); ?></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>13,'uncheckValue'=>null)); ?></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>14,'uncheckValue'=>null)); ?></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>15,'uncheckValue'=>null)); ?></td>
</tr>
<tr>
<td style="background-color: #f5f5f5"><b>Likely</b></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>21,
'uncheckValue'=>null,
'ajax' => array(
'type'=>'POST',
'url'=>Yii::app()->createUrl('Cinvestigation/load'),
'update'=>'#risk_grade',
'data'=>array('region_id'=>'js:this.value'),
)
)); ?></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>22,'uncheckValue'=>null)); ?></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>23,'uncheckValue'=>null)); ?></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>24,'uncheckValue'=>null)); ?></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>25,'uncheckValue'=>null)); ?></td>
</tr>
<tr>
<td style="background-color: #f5f5f5"><b>Possible</b></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>31,'uncheckValue'=>null)); ?></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>32,'uncheckValue'=>null)); ?></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>33,'uncheckValue'=>null)); ?></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>34,'uncheckValue'=>null)); ?></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>35,'uncheckValue'=>null)); ?></td>
</tr>
<tr>
<td style="background-color: #f5f5f5"><b>Unlikely</b></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>41,'uncheckValue'=>null)); ?></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>42,'uncheckValue'=>null)); ?></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>43,'uncheckValue'=>null)); ?></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>44,'uncheckValue'=>null)); ?></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>45,'uncheckValue'=>null)); ?></td>
</tr>
<tr>
<td style="background-color: #f5f5f5"><b>Rare</b></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>51,'uncheckValue'=>null)); ?></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>52,'uncheckValue'=>null)); ?></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>53,'uncheckValue'=>null)); ?></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>54,'uncheckValue'=>null)); ?></td>
<td><?php echo $form->radioButton($model,'a11',array('value'=>55,'uncheckValue'=>null)); ?></td>
</tr>
</tbody>
</table>
</div>
</td>
</tr>
</tbody>
</table>
<table class="table">
<tbody>
<tr>
<td><div class="span2" style="width:auto; margin-top:5px; margin-bottom: 5px">Grade risk: </div></td>
<td><?php echo $form->textFieldRow($model,'risk_grade',array('class'=>'span2','maxlength'=>100)); ?>
</td>
</tr>
<tr>

I don't think you need ajax update for this task. You could easily do it with jQuery, you just need to have some kind of mapper for radio button values and string you want to set for the text field
First set the class for each radio button
<?php echo $form->radioButton($model,'a11',array('value'=>51,'uncheckValue'=>null, 'class'=>'radioClass')); ?>
Than set the class for textfield
<?php echo $form->textFieldRow($model,'risk_grade',array('class'=>'textClass span2','maxlength'=>100)); ?>
Then attach event listener in javascript
<script>
$(function(){
$(".radioClass").click(function(){
$(".textClass").val($(this).val());
});
});
</script>
This code will but clicked radio button value into textfield's value
Now you may need some kind of mapper for radio button values and the text you want to display, which may be generated by the server side
I hope I helped

Replace buttons with image in PHP code

I am trying to display images in place of buttons for various activities like Edit Record, Delete Record, Download, Save, Reset. I am able to show the image but the result is very output is looks very childish and nonprofessional. Actually images are coming on button as shown in image
But I want image to display like this
Here is the code which gives the 1st image output.
<tr style="background-color: rgb(253, 253, 183); color: rgb(42, 16, 179);font-size: 13px;" >
<td><?php echo $row->eq_application_no; ?></td>
<td><?php echo $row->eq_class; ?></td>
<td><?php echo $row->eq_name;?></td>
<td><?php echo $row->mid_name; ?></td>
<td><?php echo $row->last_name; ?></td>
<td><?php echo $row->eq_sex; ?></td>
<td><?php echo $row->father_name; ?></td>
<td><?php echo $row->eq_dob; ?></td>
<td><?php echo $row->age.",".$row->month.",".$row->day;?></td>
<td><?php echo $row->scat_id;?></td>
<td><?php echo $row->parent_cate_id;?></td>
<td><?php echo $row->no_of_transfer;?></td>
<td><?php echo $tc_case; ?></td>
<td><?php echo$row->last_school_type; ?></td>
<td><?php echo $row->eq_prv_acdmic;?></td>
<td><?php if($row->kv_tc_date=="1970-01-01"){echo "-";}else{echo $row->kv_tc_date;}?></td>
<td><?php echo $row->kv_tc_no;?></td>
<td><?php echo $row->last_class_cgpa;?></td>
<!--value="Edit"-->
<td><input type="button" id="<?php echo $row->es_enquiryid;?>" onclick="edit_record(<?php echo $row->es_enquiryid;?>)" style="background-image:url(images/edit24.png);width:24px;height:24px;"></td><td>
<!--value="Delete"-->
<input type="button" id="<?php echo $row->es_enquiryid;?>" onclick="delete_record(<?php echo $row->es_enquiryid;?>)" style="background-image:url(images/delete24.png);width:24px;height:24px;" ></td><td><?php
if($eligible=="Y")
{?><input type="checkbox" class="app" name="app[]" d="
<?php echo $row->es_enquiryid;?>" value="<?php echo $row->es_enquiryid;?>">
<?php }
else
{
echo"-";
}
?></td>
</tr>
<?php } ?>
</tbody>
</table>
<table>
<tr>

Add image directly then:
<img src="images/delete24.png" id="<?php echo $row->es_enquiryid;?>" onclick="delete_record(<?php echo $row->es_enquiryid;?>)" style="cursor:pointer;width:24px;height:24px;" />

Categories