I have one html table which consists of a button on each row. When I click on that button I want to get the index of the row. With my code I am getting the index value but it starts with 1 instead of 0. In other examples I saw that row index is starting from value "0", but in my case it starts with "1". Can anybody help me where I did mistake.
Here is my table.
<div class="table-style table-municipality table-edit-community-view">
<table id="sum_table">
<tr class="titlerow">
<th>S.N.</th>
<th>Community</th>
<th>Address</th>
<th>Area</th>
<th>Estimated</th>
<th>Total</th>
<th>Action</th>
</tr>
<?
$sn = 1;
while($result= mysql_fetch_row($res))
{
?>
<tr id="<?php echo $result[0];?>">
<td align="center"><? echo $sn++; ?></td>
<td align="center"><? echo $result[1] ?></td>
<td align="center"><? echo $result[2] ?></td>
<td align="center" class="rowDataSd"><? echo $result[3] ?></td>
<td align="center" class="rowDataSd"><? echo $result[4] ?></td>
<td align="center" class="rowDataSd"><? echo $result[5] ?></td>
<td>
<button class="test">Test</button>
</td>
</tr>
<?
}
?>
</table>
</div>
script:
$(".test").click(function(){
console.log("name: ", $(this).closest('td').parent()[0].sectionRowIndex);
});
You are getting index starting by 1 because you have one tr element in start of table for headers. You can -1 from returned index to get index starting with 0.
$(".test").click(function(){
console.log("name: ", $(this).closest('tr').index()-1);
});
Or find the current rows index in collection of desired rows excluding headers row:
$(".test").click(function(){
console.log("name: ", $('#sum_table tr:not(.titlerow)').index($(this).closest('tr')));
});
The index function tells you that.
$(".test").click(function(){
console.log("name: ", $(this).closest('td').parent().index());
});
Also note that you can probably just use .closest('tr') rather than .closest('td').parent().
$(".test").click(function(){
console.log("name: ", $(this).closest('tr').index());
});
Note, though, that your title row is in the same parent as your data rows, and so will occup the index = 0 position. If you want to avoid that, put it in its own thead with the data rows in a tbody:
<div class="table-style table-municipality table-edit-community-view">
<table id="sum_table">
<thead><!-- *** Note -->
<tr class="titlerow">
<th>S.N.</th>
<th>Community</th>
<th>Address</th>
<th>Area</th>
<th>Estimated</th>
<th>Total</th>
<th>Action</th>
</tr>
</thead><!-- *** Note -->
<tbody><!-- *** Note -->
<?
$sn = 1;
while($result= mysql_fetch_row($res))
{
?>
<tr id="<?php echo $result[0];?>">
<td align="center"><? echo $sn++; ?></td>
<td align="center"><? echo $result[1] ?></td>
<td align="center"><? echo $result[2] ?></td>
<td align="center" class="rowDataSd"><? echo $result[3] ?></td>
<td align="center" class="rowDataSd"><? echo $result[4] ?></td>
<td align="center" class="rowDataSd"><? echo $result[5] ?></td>
<td>
<button class="test">Test</button>
</td>
</tr>
<?
}
?>
</tbody><!-- *** Note -->
</table>
</div>
It's generally best practice to use thead and tbody anyway.
$(".test").click(function() {
console.log("name: ", $(this).closest('tbody tr').index());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="table-style table-municipality table-edit-community-view">
<table id="sum_table">
<thead>
<tr class="titlerow">
<th>S.N.</th>
<th>Community</th>
<th>Address</th>
<th>Area</th>
<th>Estimated</th>
<th>Total</th>
<th>Action</th>
</tr>
</thead>
<tr>
<td align="center">1</td>
<td align="center">1</td>
<td align="center">1</td>
<td align="center" class="rowDataSd">1</td>
<td align="center" class="rowDataSd">1</td>
<td align="center" class="rowDataSd">1</td>
<td>
<button class="test">Test</button>
</td>
</tr>
<tr>
<td align="center">2</td>
<td align="center">2</td>
<td align="center">2</td>
<td align="center" class="rowDataSd">2</td>
<td align="center" class="rowDataSd">2</td>
<td align="center" class="rowDataSd">2</td>
<td>
<button class="test">Test</button>
</td>
</tr>
</table>
</div>
Use tr with index()
Related
I have a table like this:
<table class="table" id = "posts_table">
<caption><h2>cars</h2></caption>
<tr class="success">
<th style="text-align:center"> post_id
<th style="text-align:center"> autor
<th style="text-align:center"> title
</tr>
<?php
$cursor = $MySQLdb->prepare("SELECT * FROM posts WHERE topic_id=:topic_id");
$cursor->execute( array(":topic_id"=>"1") ); //לשנות
foreach ($cursor->fetchAll() as $obj): ?>
<tr>
<td style="text-align:center"><? echo $obj['post_id'] ?></td>
<td style="text-align:center"><? echo $obj['full_name']?></td>
<td style="text-align:center"><? echo $obj['post_title']?></td>
</tr>
<? endforeach; ?>
</table
I want to create function that when u click on the title im getting the post_id for this raw. What should I do to make it happen?
So i try to do this code and it works:
<table class="table" id = "posts_table">
<caption><h2>cars</h2></caption>
<tr class="success">
<th style="text-align:center"> post_id </th>
<th style="text-align:center"> autor </th>
<th style="text-align:center"> title </th>
</tr>
<?php
$cursor = $MySQLdb->prepare("SELECT * FROM posts WHERE topic_id=:topic_id");
$cursor->execute( array(":topic_id"=>"1") ); //לשנות
foreach ($cursor->fetchAll() as $obj): ?>
<tr>
<td class="post_id_c" style="text-align:center"><? echo $obj['post_id'] ?></td>
<td style="text-align:center"><? echo $obj['full_name']?></td>
<td style="text-align:center"><a class="click_title"><? echo $obj['post_title']?></a></td>
</tr>
<? endforeach; ?>
</table>
<script>
$(".click_title").click(function() {
var $item = $(this).closest("tr") // Finds the closest row <tr>
.find(".post_id_c") // Gets a descendent with class="nr"
.text();
console.log($item);
});
</script>
I'm trying to select the current row <td> tag input value, when check box is selected for that particular row, but it returns null.
I've tried to fetch the current row and I got it to read the value of input box of the selected checkbox row
var allVals = [];
$('input[name=selectedBilties]:checked').each(function() {
var freight_id = $(this).closest('tr').find( $('input[name="freight_id[]"]') ).val();
allVals.push($(this).val());
allVals.push(freight_id);
});
console.log("All Values"+ allVals);
html table with php->codeigniter
<table id="example1" class="table table-bordered table-striped table-sm" style=" overflow: auto; ">
<thead class="bg-info">
<tr>
<th>Select</th>
<th>Bilty No</th>
<th>Bilty Date</th>
<th>Pkgs</th>
<th>weight</th>
<th>From</th>
<th>TO</th>
<th>Consignor</th>
<th>Consignee</th>
<th>Remark</th>
</tr>
</thead>
<tbody class="table-hover">
<?php foreach($crossing as $pod){?>
<tr>
<td><input type="checkbox" id="selectedBilties" name="selectedBilties" value="<?php echo $pod->id;?>"></td>
<td><?php echo $pod->id;?></td>
<td><?php echo $pod->lr_date;?></td>
<td><?php echo $pod->no_of_pkgs;?></td>
<td><?php echo $pod->lr_actual_weight;?></td>
<td><?php echo $pod->lr_from;?></td>
<td><?php echo $pod->lr_to;?></td>
<td><?php echo $pod->consignor_name;?></td>
<td><?php echo $pod->consignee_name;?></td>
<td><?php echo $pod->lr_description;?></td>
<input class="selected" type="text" id="freight_id" name="freight_id[]" value="<?php echo $pod->fr_memo_ids; ?>">
<input class="selected" type="hidden" id="challan_id" name="challan_id[]" value="<?php echo $pod->challan_id; ?>">
</tr>
<?php }?>
</tbody>
</table>
You have to place the input elements inside td, otherwise the selector will not work. Also you have to execute your code on changing the check box as there is no check box checked initially:
$('input[name=selectedBilties]').click(function(){
var allVals = [];
$('input[name=selectedBilties]:checked').each(function() {
var freight_id = $(this).closest('tr').find('input[name="freight_id[]"]').val();
var temp = [];
temp.push($(this).val());
temp.push(freight_id);
allVals.push(temp);
});
console.log(allVals);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="example1" class="table table-bordered table-striped table-sm" style=" overflow: auto; ">
<thead class="bg-info">
<tr>
<th>Select</th>
<th>Bilty No</th>
<th>Bilty Date</th>
<th>Pkgs</th>
<th>weight</th>
<th>From</th>
<th>TO</th>
<th>Consignor</th>
<th>Consignee</th>
<th>Remark</th>
</tr>
</thead>
<tbody class="table-hover">
<tr>
<td><input type="checkbox" id="selectedBilties" name="selectedBilties" value="11"></td>
<td>gjhg</td>
<td>ghj</td>
<td>ghjg</td>
<td>ghj</td>
<td>ghjg</td>
<td>ghj</td>
<td>gjh</td>
<td>ghj</td>
<td>ghj</td>
<td><input class="selected" type="text" id="freight_id" name="freight_id[]" value="val11"></td>
<td><input class="selected" type="hidden" id="challan_id" name="challan_id[]" value="<?php echo $pod->challan_id; ?>"></td>
</tr>
<tr>
<td><input type="checkbox" id="selectedBilties" name="selectedBilties" value="22"></td>
<td>vbv</td>
<td>gh</td>
<td>gjh</td>
<td>gh</td>
<td>ghj</td>
<td>ghj</td>
<td>ghj</td>
<td>ghj</td>
<td>gjghj</td>
<td><input class="selected" type="text" id="freight_id" name="freight_id[]" value="val22"></td>
<td><input class="selected" type="hidden" id="challan_id" name="challan_id[]" value=""></td>
</tr>
</tbody>
</table>
I have a table with multiple columns (index.php). One column is a checkbox. Whenever the checkbox is checked, it displays another column where you can select a quantity.
I want to then be able to hit a button called "Add to Order" and have it use AJAX to add any selected rows to the index-order.php page. After all selections have been made, I want to be able to click the "Checkout" button and have it take me to the index-order.php page where it should display all of the added selections in a table.
I know how to navigate to the index-order.php page so my main question is how can I add the selected rows to the page while using ajax and staying on the current page when doing so?
Index.php code:
<form name="form1" action="index-order.php">
<section id="checkout-btn">
<button type="submit" id="checkout" name="order">Checkout</button>
</section>
</form>
<form name="form2" method="POST" action="index-order.php">
<section id="addToOrder">
<button type="submit" class="order" id="order" name="order" value="AddToOrder">Add to Order</button>
</section>
<br>
<div id="my-div2" class="ui-widget">
<div class="ui-widget">
<table id="merchTable" cellspacing="5" class="sortable">
<thead>
<tr class="ui-widget-header">
<th class="sorttable_nosort"></th>
<th class="sorttable_nosort">Loc</th>
<th class="merchRow">Report Code</th>
<th class="merchRow">SKU</th>
<th class="merchRow">Special ID</th>
<th class="merchRow">Description</th>
<th class="merchRow">Quantity</th>
<th class="sorttable_nosort">Unit</th>
<th style="display: none;" class="num">Quantity #</th>
</tr>
</thead>
<tbody>
<?php foreach ($dbh->query($query) as $row) {?>
<tr>
<td class="ui-widget-content"><input type="checkbox" class="check" name="check"></td>
<td name="rows[0][0][loc]" class="loc ui-widget-content" id="loc-<?php echo intval ($row['Loc'])?>"><?php echo $row['Loc'];?></td>
<td name="rows[0][0][rp-code]" class="rp-code ui-widget-content" align="center" id="rp-code-<?php echo intval ($row['Rp-Code'])?>"><?php echo $row['Rp-Code'];?></td>
<td name="rows[0][0][sku]" class="sku ui-widget-content" id="sku-<?php echo intval ($row['SKU'])?>"><?php echo $row['SKU'];?></td>
<td name="rows[0][0][special-id]" class="special-id ui-widget-content" align="center" id="special-id-<?php echo intval ($row['Special-ID'])?>"><?php echo $row['Special-ID'];?></td>
<td name="rows[0][0][description]" class="description ui-widget-content" id="description-<?php echo intval ($row['Description'])?>"><?php echo $row['Description'];?></td>
<td name="rows[0][0][quantity]" class="quantity ui-widget-content" data-quantity="<?php echo $row['Quantity'] ?>" align="center" id="quantity-<?php echo intval ($row['Quantity'])?>"><?php echo $row['Quantity'];?></td>
<td name="rows[0][0][unit]" class="unit ui-widget-content" id="unit-<?php echo intval ($row['Unit'])?>"><?php echo $row['Unit'];?></td>
<td name="rows[0][0][quant]" style="display: none;" class="quantity_num ui-widget-content"><input type="textbox" style="width: 100px;" class="spinner" name="value" id="test"></td>
</tr>
<?php } ?>
</tbody>
</table>
</div>
</div>
</form>
Index-order.php:
<?php if(isset($_POST['rows'])): ?>
<table cellspacing="20">
<tr align="center">
<th>Loc</th>
<th>Report Code</th>
<th>SKU</th>
<th>Special ID</th>
<th>Description</th>
<th>Quantity</th>
<th>Unit</th>
<th>Quantity #</th>
</tr>
<?php
foreach($_POST['rows'][0] as $row):
?>
<tr align="center">
<td><?php echo $row['loc']; ?></td>
<td><?php echo $row['rp-code']; ?></td>
<td><?php echo $row['sku']; ?></td>
<td><?php echo $row['special-id']; ?></td>
<td><?php echo $row['description']; ?></td>
<td><?php echo $row['quantity']; ?></td>
<td><?php echo $row['unit']; ?></td>
<td><?php echo $row['quant']; ?></td>
</tr>
<?php
endforeach;
?>
</table>
<?php endif; ?>
JavaScript (obviously needs some work. Posting what I have so far):
$(function () {
$('#form2').on('submit', function (e) {
if($('input.check').is(':checked')) {
$(this).closest('tr');
e.preventDefault();
var request = $.ajax({
type: 'post',
url: 'index-order.php',
data: $('#form2').serialize(),
success: function(){
alert('success');
},
error: function(){
alert('failure');
}
});
}
});
});
What you can do is get all the siblings of the current checked checkbox and based on that get all the columns and separate the data to finally send it via ajax.
You can do something like this:
$('#form2').on('submit', function (e) {
$checkbox = $(this).find('input.check:checked').parent('td'); //Finds the checked checkbox's column inside #form2
$otherColumns = $checkbox.nextAll(); //Gets all the siblings
});
The above code will get you all the other columns next to the checked checkbox inside your form. What you an do next is travel across $otherColumns and get each individual value using $otherColums.eq(n).html() where n is the number of the column you are trying to get.
I have a file where php dynamically generates a bunch of tables and each of these tables also has a dynamically generated number of rows.
<?php foreach($trees as $tree): ?>
<div class="tree">
<table>
<thead>
<tr>
<th>Fruit</th>
<th>Price</th>
</tr>
</thead>
<tbody>
<?php foreach($tree as $fruit => $fruitPrice) ?>
<tr>
<td><?php echo $fruit; ?></td>
<td><?php echo $fruitPrice; ?></td>
</tr>
<?php endforeach; ?>
<tr>
<td>Total:</td>
<td class="totalPrice"></td>
</tr>
</tbody>
<table>
</div>
<?php endforeach; ?>
A resulting table would look something like this (but there would be close to 100 of those tables):
<div class="tree">
<table>
<thead>
<tr>
<th>Fruit</th>
<th>Price</th>
</tr>
</thead>
<tbody>
<tr>
<td>Apple</td>
<td>$1.99</td>
</tr>
<tr>
<td>Banana</td>
<td>$1.29</td>
</tr>
<tr>
<td>Peach</td>
<td>$2.25</td>
</tr>
<tr>
<td>Total:</td>
<td class="totalPrice"></td>
</tr>
</tbody>
<table>
</div>
How would I access the <td>s using jQuery to sum total of the values and display the total price in .totalPrice?
The table being dynamic irritates me here.
I tried to write a loop within a loop, but couldn't get it to access the correct fields.
This should do it:
<?php foreach($trees as $tree): ?>
<div class="tree">
<table>
<thead>
<tr>
<th>Fruit</th>
<th>Price</th>
</tr>
</thead>
<tbody>
<?php foreach($tree as $fruit => $fruitPrice) ?>
<tr>
<td><?php echo $fruit; ?></td>
<td id="fruitPrice"><?php echo $fruitPrice; ?></td>
</tr>
<?php endforeach; ?>
<tr>
<td>Total:</td>
<td class="totalPrice"></td>
</tr>
</tbody>
<table>
</div>
<?php endforeach; ?>
<script>
var totalPrice = null;
$("#fruitPrice").each(function()
{
totalPrice += $(this).text();
$(".totalPrice").text(totalPrice);
});
</script>
$("table").each(function () {
var totalSum = 0;
//find all tr in current table
var $dataRow = $(this).find('tbody tr');
$dataRow.each(function () {
$(this).find('td:nth-child(2)').each(function (i) {
// remove currency symbol
totalSum += parseFloat($(this).text().replace("$", ""));
});
});
var totalFixedValue = parseFloat(totalSum).toFixed(2);
//find totalPrice td and update with result
$(this).find(".totalPrice").html(totalFixedValue);
});
Give your price a class attribute to make easy the retrieve of values :
<tr>
<td><?php echo $fruit; ?></td>
<td class="price"><?php echo $fruitPrice; ?></td>
</tr>
Then get the value of price of every table :
$('table').each(function(){
var total = 0;
$('.price',this).each(function(){
total += parseFloat($(this).text().replace('$',''));
})
$('.totalPrice',this).text('$'+total);
})
Hope this helps.
$('table').each(function(){
var total = 0;
$('.price',this).each(function(){
total += parseFloat($(this).text().replace('$',''));
})
$('.totalPrice',this).text('$'+total);
})
table,table td{
border: 1px solid;
}
.totalPrice{
color: #FFF;
background-color: green;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="tree">
<table>
<thead>
<tr>
<th>Fruit</th>
<th>Price</th>
</tr>
</thead>
<tbody>
<tr>
<td>Apple</td>
<td class='price'>$1.99</td>
</tr>
<tr>
<td>Banana</td>
<td class='price'>$1.29</td>
</tr>
<tr>
<td>Peach</td>
<td class='price'>$2.25</td>
</tr>
<tr>
<td>Total:</td>
<td class="totalPrice"></td>
</tr>
</tbody>
</table>
<br>
<table>
<thead>
<tr>
<th>Fruit</th>
<th>Price</th>
</tr>
</thead>
<tbody>
<tr>
<td>Peach</td>
<td class='price'>$1</td>
</tr>
<tr>
<td>Banana</td>
<td class='price'>$3.9</td>
</tr>
<tr>
<td>Total:</td>
<td class="totalPrice"></td>
</tr>
</tbody>
</table>
<br>
<table>
<thead>
<tr>
<th>Fruit</th>
<th>Price</th>
</tr>
</thead>
<tbody>
<tr>
<td>Banana</td>
<td class='price'>$1.96</td>
</tr>
<tr>
<td>Apple</td>
<td class='price'>$6.25</td>
</tr>
<tr>
<td>Total:</td>
<td class="totalPrice"></td>
</tr>
</tbody>
</table>
</div>
I try to get the content of table and put it in a new windows to print , but i alwys get this error:
the table is inside a modal , and it is return to modal dynamcly by ajax function :
this is the ajax function :
function view(id){
var html;
$.ajax({
url: "<?php echo site_url('admin/prescription/view_prescription_ajax') ?>/"+id,
type: 'POST',
dataType: 'html',
success:function(data){
html = data;
},
async: false
});
$('#view .modal-body').html(html);
$('#view').modal('show');
}
this is the htmt returned by this code
$data='';
$prescription = $this->prescription_model->get_prescription_by_id($id);
$template= $this->notification_model->get_template();
$data.='<table width="100%" border="0" id="printTable" class="pt" style="padding-bottom:0px; height:100%;" >
<thead>
<tr>
<td>
<table width="100%" style="border-bottom:1px solid;">
<tr>
<td style="line-height:110%">'.$template->header.'
</td>
</tr>
</table>
</td>
</tr>
</thead>
<tbody>
<tr>
<td >
<table width="100%">
<tr>
<td width="40%"><b>'.lang('name').'</b> : '.substr($prescription->patient,0,20).'</td>
<td width="18%"><b>'.lang('age').'</b> : '. date("Y")-$prescription->dob .' Years</td>
<td ><b>'.lang('sex').'</b> : '. $prescription->gender.'</td>
<td ><b>'.lang('id').'></b> :'.$prescription->prescription_id.'</td>
<td ><b>'.lang('date').'</b> : '. date("d-m-y", strtotime($prescription->date_time)).'</td>
</tr>
</table>
</td>
</tr>
<tr height="100%">
<td valign="top">
<table width="100%" border="0">
<tr>
<td width="51%" valign="top">
<table width="80%" border="0">
<tr>
<td width="100%">
<table border="0" >
<tr>
<td><b>Medical History</b></td>
</tr>';
$c = json_decode($prescription->case_history_id);
if(is_array($c)){
foreach($c as $new){
$data.='<tr><td>'.$dis = $new .'</td></tr>';
}
}else{
$data.='<tr><td>'.$c.'</td></tr>';
}
$data.='<tr>
<td>'. $prescription->case_history.'</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table border="0">
<tr>
<td><b>Frequency</b></td>
</tr>
<tr>
<td>'.$prescription->frequency.'</td>
</tr>
</table>
</td>
</tr>
<tr>
<td width="51%">';
$d = json_decode($prescription->tests);
//echo '<pre>'; print_r($d);'</pre>';
if(!empty($d[0])){
$data.='<table border="0" width="100%">
<tr>
<td><b>'.lang('test').'</b></td>
</tr>';
$ins = json_decode($prescription->test_instructions);
if(is_array($d)){
$i=1;
foreach($d as $key => $new){
$data.='<tr><td>'.$i.'. '.$d[$key] .'<td></tr>';
if(!empty($ins[$key])){
$data.='<tr><td><p style="padding-left:14px;"><small>('.$ins[$key] .')</small></p><td></tr>';
}
$i++;}
}else{
$data.='<tr><td>'.$i.' '.$d.'<td></tr>';
$data.='<tr><td><p style="padding-left:14px;"><small>( '.$ins.' )</small></p><td></tr>';
}
$data.='</table>';
}
$data.='</td>
</tr>
</table>
</td>
<td valign="top">
<table border="0" width="100%" >
<tr>
<td><p><span style="font-size:26px"><b>R</span ><sub style="font-size:18px">x</b></sub></p></td>
</tr>';
$d = json_decode($prescription->medicines);
$ins = json_decode($prescription->medicine_instruction);
if(is_array($d)){
$i=1;
foreach($d as $key => $new){
if(!empty($d[$key]))
$data.='<tr><td style="padding-left:18px;">'.$i.'. '.$d[$key] .'<td></tr>';
$data.='<tr><td><p style="padding-left:32px;"><small>'.#$ins[$key] .'</small></p><td></tr>';
$i++;}
}else{
$data.='<tr><td style="padding-left:18px;">'.$i.' '.$d.'<td></tr>';
$data.='<tr><td><p style="padding-left:32px;"><small>'.$ins.'</small></p><td></tr>';
}
$data.='<tr>
<td>';
if(!empty($prescription->remark)){
$data.='<table width="100%" border="0">
<tr>
<td><b>'.lang('remark').'</b></td>
</tr>
<tr>
<td>'.$prescription->remark.'</td>
</tr>
</table>';
}
$data.='</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</tbody>
<tfoot>
<tr>
<td style="border-top:1px solid;" class="aligncenter">
'.$template->footer.'
</td>
</tr>
</tfoot>
</table>
<div class="form-group no-print">
<div class="row no-print">
<div class="col-sm-4 pull-right">
<a class="btn btn-default yes-print no-print" id="print_p" onClick="printData();" style="margin-right: 5px;"><i class="fa fa-print"></i>'.lang('print').'</a>
<i class="fa fa-download"></i>'.lang('generate_pdf').'
</div>
</div>
</div>
';
echo $data;
this is javascript
function printData()
{
var divToPrint=document.getElementById("printTable");
newWin= window.open("");
newWin.document.write(divToPrint.outerHTML);
newWin.print();
newWin.close();
}
you should call print data on success because events are not binding after dom content added to dom later.
also don't forget to remove onClick="printData" from button attribute
function view(id){
var html;
$.ajax({
url: "<?php echo site_url('admin/prescription/view_prescription_ajax') ?>/"+id,
type: 'POST',
dataType: 'html',
success:function(data){
html = data;
$("#print_p").on("click", function(e){ printData(); });
},
async: false
});
$('#view .modal-body').html(html);
$('#view').modal('show');
}