Change button text based on cell value in each table row - Jquery - html

I have a HTML table that is showing data from DB. A [status] column shows the status of each record as "AVAILABLE" , "BOOKED" or "ON-HOLD". the last column of table is [ACTION] column which contains a BUTTON. If the status of row = "Available" then button text should be "BOOK". Likewise if the status = "BOOKED" or "ON-HOLD" the the button text should be "VIEW". I have applied css successfully via jquery that changes the background-color of status column based on the text in the cell as mentioned above but the same code is not working for button text.
HTML
<tr id="data_row">
<td class="align-middle text-center"><?php echo $Project; ?></td>
<td class="align-middle text-center"><?php echo $Sector; ?></td>
<td class="align-middle text-center"><?php echo $Category ;?></td>
<td class="align-middle text-center"><?php echo $Plot_title ;?></td>
<td class="align-middle text-center"><?php echo $App_date ;?></td>
<td class="align-middle text-center"><?php echo $Customer ;?></td>
<td class="align-middle text-center" id= "status"><?php echo $Status ;?></td>
<td class="align-middle text-center">
<button type="button" name="edit" id="<?php echo $Plot_ID; ?>" class="btn btn-outline-primary btn-sm edit_data" data-toggle="modal" data-target="#modalform" data-backdrop="static" data-keyboard="false">Book</button>
</td>
</tr>
Jquery
$('#myTable tr#data_row td#status').each(function () {
switch ($(this).text()) {
case "Booked":
$(this).css({"background-color":"#eeac88", "color":" #7a3b2e"}); // (WORKING FOR CSS)
$(".edit_data").text("View"); // (NOT WORKING FOR TEXT CHANGE)
break;
case "on-Hold":
$(this).css("background-color","#fefbd8");
$(".edit_data").text("View");
break;
default:
$(this).css({"background-color": "#c5d5c5", "color":"green"});
$(".edit_data").text("Book");
break;
}
});

Try
$(".edit_data").hmtl("View");
Or put a <span> inside the button to access it with .text() method

Related

Update status column in codigniter is not working

Hi guys i am trying to update the status column of my table contentdetails To 0.I don't know what is the exact problem and where i have done mistake i couldn't able to update my status column.
Here is my controller:
function deleteImage() {
// Pass the $id to the contentDelete() method
$id = $this->input->post('image_id');
if ($id) {
$this->Content_model->imageDelete($id);
$this->session->set_flashdata('success', 'Image deleted.');
redirect('Content');
} else {
$this->session->set_flashdata('error', 'Image Id not captured.');
redirect('Content');
}
}
Here is my model:
function imageDelete($id) {
$this->db->set('status', 0); //value that used to update column
$this->db->where('id', $id); //which row want to upgrade
$this->db->update('contentdetails'); //table name
}
Here is my view:
<table class="table table-striped table-bordered" id="dataTable1">
<thead>
<tr>
<th>#</th>
<th>Image path</th>
<th class='text-center'>Delete</th>
</tr>
</thead>
<tbody>
<?php
foreach ($bgimglist as $bgimgs) {
?>
<tr>
<td><?php echo $bgimgs->id; ?></td>
<td><?php echo $bgimgs->details; ?></td>
<td class='text-center'>
<form method="post" action="<?php echo base_url('Content/deleteImage'); ?>">
<input type="text" name="image_id" value="<?php echo $bgimgs->id; ?>">
<button type="submit" onclick="return ConfirmDelete()" class="btn btn-danger btn-xs confirmation" name="login"><i class='fas fa-times'></i></button>
</form>
</td>
</tr>
<?php
}
?>
</tbody>
</table>
Can anyone help me where i have done mistake.
Thanks in advance.
Due to some misunderstanding OP though form_open() also closed the form in code available in the discussion in the above comments. Thus, any further form calls were going to the form that was never closed.
Adding a </form> for the open form solved the issue.

Why json data is showing in header in codeigniter HMVC - AJAX

I'm new in ajax and I don't know how to get over this error. I don't understand this error. Please help.
Here is my Modal User_m.
I fetch data from database successfully
<?php
class Users_m extends CI_Model
{
public function showAllAdmins()
{
$query = $this->db->get('admin_users');
if($query->num_rows() > 0){
return $query->result();
}else{
return false;
}
}
}
?>
Here is my Controller AdminUsers
I get all data from database through my modal and encode it using by json_encode
but I don't know why this json data is showing on my page header.In this Image
class AdminUsers extends MY_Controller
{
public function __construct()
{
parent::__construct();
$this->load->model('AdminUsers/Users_m');
}
public function index()
{
$data['content_view'] = 'AdminUsers/viw_users';
$data['page_title'] = 'Users';
$data['page_descr'] = 'all admin users';
$result = $this->Users_m->showAllAdmins();
echo json_encode($result);
$this->template->admin_template($data);
}
}
And this is my ajax code
When I Every time refresh my page it execute alert Could not get data from database. I don't know How to pass Json data in ajax. I see console log but not show any error. I load jQuery also. Any help will be appreciated. Thanks for your answers.
And when I loop through this it goes to infinity.
$(function(){
showAllAdmins();
function showAllAdmins(){
$.ajax({
type:'ajax',
url: 'http://localhost/hmvcExample/AdminUsers',
async:false,
success: function(data){
var html = '';
var i = 0;
for(i=0; i<data.length; i++){
html +='<tr>'+
'<td>Rakesh</td>'+
'<td>Kumar</td>'+
'<td>Rakeshkrishan1992#gmail.com</td>'+
'<td>Rocky</td>'+
'<td><button class="btn btn-primary">Edit</button> <button class="btn btn-danger">Delete</button></td>'+
'</tr>';
}
$('#showData').html(html);
},
error: function(){
alert('Could not load Data from Database');
}
});
}
});
View file
<div class="box">
<div class="box-header">
<h3 class="box-title">Users List</h3>
<button class="btn btn-success pull-right">Add New</button>
</div>
<!-- /.box-header -->
<div class="box-body">
<table id="example2" class="table table-bordered table-hover table-responsive">
<thead>
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Email Address</th>
<th>User Name</th>
<th>Action</th>
</tr>
</thead>
<tbody id="showData">
</tbody>
</table>
</div>
<!-- /.box-body -->
</div>
I'm posting a sample code. Please refer.
<table id="example1" class="table table-bordered table-striped">
<thead>
<tr>
<th>Slno</th>
<th>Name</th>
<th>Username</th>
<th>Email</th>
<th>Status</th>
<th>Actions</th>
</tr>
</thead>
<tbody id="user_table">
<?php if($result) { $i =1; foreach ($result as $row){ ?>
<tr>
<td><?php echo $i; ?></td>
<td><?php echo $row->fullname; ?></td>
<td><?php echo $row->username; ?></td>
<td><?php echo $row->email; ?></td>
<td><?php if($row->active == "1"){ ?>
<span class="label label-success"><?php echo 'Active'; ?></span>
<?php }elseif($row->active == "0"){ ?>
<span class="label label-warning"><?php echo 'Inactive'; ?></span>
<?php } ?></td>
<td>
<div class="btn-group">
<a class="btn btn-xs btn-success" href="<?php echo base_url().'admin/user/view_user?id='.$row->user_id.'&action=edit'; ?>" title="View">
<i class="ace-icon fa fa-pencil-square-o bigger-120"></i>
</a>
</div>
</td>
</tr>
<?php $i++; } } ?>
</tbody>
</table>
You have to pass the data from the controller as follows
$data['result'] = $result; //your sql query resultset
$this->template->admin_template($data);
No need to use ajax at all. Hope this can help you.
Feel free to ask if you have any queries.

css color condition in html based on database

I used here bootstrap. I want to red mark those row which Activity contains "N" .In my database Activity field has two characters. they are Y & N. I also used here jquery data table.What can i do?
<?php
while($reg_data = mysqli_fetch_array($result_sql2))
{
?>
<tr class="success">
<td > <?php echo $reg_data['ID'] ?> </td>
<td> <?php echo $reg_data['Name'] ?> </td>
<td> <?php echo $reg_data['Email'] ?> </td>
<td> <?php echo $reg_data['Type'] ?> </td>
<td> <?php echo $reg_data['Dept'] ?> </td>
<td> <?php echo $reg_data['Activity'] ?> </td> // based on this field //////
</tr>
One best quick and easy way to do is to give an inline style:
<td style="background-color: <?php echo ($reg_data['Activity'] == "Y") ? "green": "red" ?>;">
<?php echo $reg_data['Activity'] ?>
</td>
You might want to add !important just in case if needs an overriding:
<td style="background-color: <?php echo ($reg_data['Activity'] == "Y") ? "green": "red" ?> !important;">
Note: I know inline styles are bad.
Update: Sorry I missed that you need to do it on the row. You can just apply the same thing on the <tr> instead of that <td>. So your code will be:
<tr class="success" style="background-color: <?php echo ($reg_data['Activity'] == "Y") ? "green": "red" ?>;">
<td > <?php echo $reg_data['ID'] ?> </td>
<td> <?php echo $reg_data['Name'] ?> </td>
<td> <?php echo $reg_data['Email'] ?> </td>
<td> <?php echo $reg_data['Type'] ?> </td>
<td> <?php echo $reg_data['Dept'] ?> </td>
<td> <?php echo $reg_data['Activity'] ?> </td>
</tr>
Thanks to Darren Sweeney for pointing it out.
Check for window.onload.
Reference : https://developer.mozilla.org/en/docs/Web/API/GlobalEventHandlers/onload
Set a class based on activity on the desired <td> then upon window.onload use jQuery .parent() function and add css to the parent of <td> which containes "Y" as a class.
window.onload = function() {
$('.YClassName').parent().css('background', 'YOURCOLOR');
};
Another approach would be creating a CSS class and adding it to the element if your condition is met.
.red {
background-color: red;
}
.green {
background-color: green;
}
And then
<tr class="success <?php echo ($reg_data['Activity'] == "Y") ? "green": "red" ?>">
//table data
</tr>
As a sidenote, it'd be better to use "1" and "0" instead of "Y" and "N". Integer table-row types tend to perform better? At least, that's what I've believed until now.

Zend form input box aligning

This is my HTML view:
<tr class="header">
<th>CLASS</th>
<th>NAME</th>
<th>Actions</th>
</tr>
<?php
foreach($this->documents as $row): ?>
<tr>
<td><?php echo $row['CLASS'];?></td>
<td><?php echo $row['NAME'];?></td>
href="/admin/documents/delete?ID=<?php echo $row['ID'];?>">
delete</a>
</td>
</tr>
<?php endforeach; ?>
</table>
</div>
This is my view Form:
public function init()
{
$CLASS = new Zend_Form_Element_Text('CLASS');
$CLASS->setLabel('CLASS')
->setRequired(true);
$NAME = new Zend_Form_Element_Text('NAME');
$NAME->setLabel('NAME')
->setRequired(true);
$submit = new Zend_Form_Element_Submit('Submit');
$submit->setAttrib('ID', 'submitbutton');
$this->addElements(array($CLASS, $NAME,$submit));
}
I have zend form, having two inputs CLASS and NAME.
How to display CLASS and required input text box column in the same line?
This is my output image:
And same thing, how to put submit and Reset button in the same line?

table with an url image inside header

I have a sortable table in html and looking to put an add.png inside each table header so if a user wants to add another url - they just click the add.png and redirects them to the addurl.php (if they click outside it will still sort the table just like normal). Right now it sorting when I click on the .png and/or outside it. If this something that can't be done, I've also thought about trying to add a final row with [add another site] but have no idea how to work it into the $j++ so it appears at the final row.
what it looks like
[PHP snippet]
<table class="datatable sortable selectable full">
<thead>
<tr class="theader">
<th width="100%">
<b><li><img src="images/logos/googlebuzz-2-icon.png" height="18" border="0" />Google <img src="img/icons/add.png" height="18" border="0" align="right"/></li></b>
</th>
<th>
<b>Coins</b>
</th>
<th>
<b>CPC</b>
</th>
</tr>
</thead>
<tbody>
<?
$site2 = mysql_query("SELECT * FROM `sites` WHERE `user`='{$data->login}' ORDER BY `cpc` DESC");
for($j=1; $site = mysql_fetch_object($site2); $j++)
{
?>
<tr>
<td>
<? if($site->banned == 1){ ?><font color="red"><? }else{ ?><font color="green"><? } echo($site->title); ?></font><span class="edit"></span>
</td>
<td align="right">
<? if($site->points <= 10){ ?><font color="red"><? }else{ ?><font color="green"><? } echo($site->points); ?></font><span class="add"></span>
</td>
<td>
<? echo $site->cpc;?>
</td>
</tr>
<?}?>
</tbody>
</table>
First of all, instead of a for loop, you should use while:
while($site = mysql_fetch_object($site2))
If you want to add a final row, just add it outside the iteration, before </tbody>:
<tbody>
<? while($site = mysql_fetch_object($site2)): ?>
<tr>
<td>
<? if($site->banned == 1){ ?><font color="red"><? }else{ ?><font color="green"><? } echo($site->title); ?></font><span class="edit"></span>
</td>
<td align="right">
<? if($site->points <= 10){ ?><font color="red"><? }else{ ?><font color="green"><? } echo($site->points); ?></font><span class="add"></span>
</td>
<td>
<? echo $site->cpc;?>
</td>
</tr>
<? endwhile; ?>
<tr>
<td colspan="3">
[add another site]
</td>
</tr>
</tbody>
It seems you are using a javascript to do the sorting. I don't know if that can be changed so your add button in the header works.
You can check if it's the final row by checking the actual row against all rows:
$site2 = mysql_query("SELECT * FROM `sites` WHERE `user`='{$data->login}' ORDER BY `cpc` DESC");
$rows = mysql_num_rows($site2);
$i = 0;
And add this in your for loop:
$i++;
if($rows == $i) {
// do something only at the final row
}