How to modify code to work with my database - javascript

New Code(not working) :
(index.php) :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Workorder System</title>
<!-- Bootstrap core CSS -->
<link href="css/jquery-ui.min.css" rel="stylesheet">
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/datepicker.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="css/sticky-footer-navbar.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<!-- Begin page content -->
<div class="container content">
<div class='row'>
<div class='col-xs-12 col-sm-12 col-md-12 col-lg-12'>
<h1 class="text-center title">Workorder System </h1>
</div>
<h2> </h2>
<div class='row'>
<div class='col-xs-12 col-sm-12 col-md-12 col-lg-12'>
<table class="table table-bordered table-hover">
<thead>
<tr>
<th width="2%"><input id="check_all" class="formcontrol" type="checkbox"/></th>
<th width="15%">Model #</th>
<th width="38%">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td><input class="case" type="checkbox"/></td>
<td><input type="text" data-type="productCode" name="itemNo[]" id="itemNo_1" class="form-control autocomplete_txt" autocomplete="off"></td>
<td>
<input type="text" data-type="model" name="modelName[]" id="modelName_1" class="form-control autocomplete_txt" autocomplete="off">
</td>
<td>
<input type="text" data-type="category" name="category[]" id="categoryName_1" class="form-control autocomplete_txt" autocomplete="off">
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class='row'>
<div class='col-xs-12 col-sm-3 col-md-3 col-lg-3'>
<button class="btn btn-danger delete" type="button">- Delete</button>
<button class="btn btn-success addmore" type="button">+ Add More</button>
</div>
<div class='col-xs-12 col-sm-offset-4 col-md-offset-4 col-lg-offset-4 col-sm-5 col-md-5 col-lg-5'>
<form class="form-inline">
<div class="form-group">
<label>Subtotal: </label>
<div class="input-group">
<div class="input-group-addon">$</div>
<input type="number" class="form-control" id="subTotal" placeholder="Subtotal" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;">
</div>
</div>
<div class="form-group">
<label>Tax: </label>
<div class="input-group">
<div class="input-group-addon">$</div>
<input type="number" class="form-control" id="tax" placeholder="Tax" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;">
</div>
</div>
<div class="form-group">
<label>Tax Amount: </label>
<div class="input-group">
<input type="number" class="form-control" id="taxAmount" placeholder="Tax" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;">
<div class="input-group-addon">%</div>
</div>
</div>
<div class="form-group">
<label>Total: </label>
<div class="input-group">
<div class="input-group-addon">$</div>
<input type="number" class="form-control" id="totalAftertax" placeholder="Total" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;">
</div>
</div>
<div class="form-group">
<label>Amount Paid: </label>
<div class="input-group">
<div class="input-group-addon">$</div>
<input type="number" class="form-control" id="amountPaid" placeholder="Amount Paid" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;">
</div>
</div>
<div class="form-group">
<label>Amount Due: </label>
<div class="input-group">
<div class="input-group-addon">$</div>
<input type="number" class="form-control amountDue" id="amountDue" placeholder="Amount Due" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;">
</div>
</div>
</form>
</div>
</div>
<h2>Notes: </h2>
<div class='row'>
<div class='col-xs-12 col-sm-12 col-md-12 col-lg-12'>
<div class="form-group">
<textarea class="form-control" rows='5' id="notes" placeholder="Your Notes"></textarea>
</div>
</div>
</div>
</div>
<script src="js/jquery.min.js"></script>
<script src="js/jquery-ui.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/bootstrap-datepicker.js"></script>
<script src="js/auto.js"></script>
</body>
</html>
(auto.js) :
//adds extra table rows
var i=$('table tr').length;
$(".addmore").on('click',function(){
html = '<tr>';
html += '<td><input class="case" type="checkbox"/></td>';
html += '<td><input type="text" data-type="productCode" name="itemNo[]" id="itemNo_'+i+'" class="form-control autocomplete_txt" autocomplete="off"></td>';
html += '<td><input type="text" data-type="model" name="modelName[]" id="modelName_'+i+'" class="form-control autocomplete_txt" autocomplete="off"></td>';
html += '<td><input type="text" data-type="category" name="category[]" id="categoryName_'+i+'" class="form-control autocomplete_txt" autocomplete="off"></td>';
html += '</tr>';
$('table').append(html);
i++;
});
//to check all checkboxes
$(document).on('change','#check_all',function(){
$('input[class=case]:checkbox').prop("checked", $(this).is(':checked'));
});
//deletes the selected table rows
$(".delete").on('click', function() {
$('.case:checkbox:checked').parents("tr").remove();
$('#check_all').prop("checked", false);
calculateTotal();
});
//autocomplete script
$(document).on('focus','.autocomplete_txt',function(){
type = $(this).data('type');
if(type =='productCode' )autoTypeNo=0;
if(type =='model' )autoTypeNo=1;
$(this).autocomplete({
source: function( request, response ) {
$.ajax({
url : 'ajax.php',
dataType: "json",
method: 'post',
data: {
name_startsWith: request.term,
type: type
},
success: function( data ) {
response( $.map( data, function( item ) {
var code = item.split("|");
return {
label: code[autoTypeNo],
value: code[autoTypeNo],
data : item
}
}));
}
});
},
autoFocus: true,
minLength: 0,
select: function( event, ui ) {
var names = ui.item.data.split("|");
id_arr = $(this).attr('id');
id = id_arr.split("_");
$('#itemNo_'+id[1]).val(names[0]);
$('#modelName_'+id[1]).val(names[1]);
$('#cateogryName_'+id[1]).val(names[1]);
calculateTotal();
}
});
});
//price change
$(document).on('change keyup blur','.changesNo',function(){
id_arr = $(this).attr('id');
id = id_arr.split("_");
quantity = $('#quantity_'+id[1]).val();
price = $('#price_'+id[1]).val();
if( quantity!='' && price !='' ) $('#total_'+id[1]).val( (parseFloat(price)*parseFloat(quantity)).toFixed(2) );
calculateTotal();
});
$(document).on('change keyup blur','#tax',function(){
calculateTotal();
});
//total price calculation
function calculateTotal(){
subTotal = 0 ; total = 0;
$('.totalLinePrice').each(function(){
if($(this).val() != '' )subTotal += parseFloat( $(this).val() );
});
$('#subTotal').val( subTotal.toFixed(2) );
tax = $('#tax').val();
if(tax != '' && typeof(tax) != "undefined" ){
taxAmount = subTotal * ( parseFloat(tax) /100 );
$('#taxAmount').val(taxAmount.toFixed(2));
total = subTotal + taxAmount;
}else{
$('#taxAmount').val(0);
total = subTotal;
}
$('#totalAftertax').val( total.toFixed(2) );
calculateAmountDue();
}
$(document).on('change keyup blur','#amountPaid',function(){
calculateAmountDue();
});
//due amount calculation
function calculateAmountDue(){
amountPaid = $('#amountPaid').val();
total = $('#totalAftertax').val();
if(amountPaid != '' && typeof(amountPaid) != "undefined" ){
amountDue = parseFloat(total) - parseFloat( amountPaid );
$('.amountDue').val( amountDue.toFixed(2) );
}else{
total = parseFloat(total).toFixed(2);
$('.amountDue').val( total );
}
}
//It restrict the non-numbers
var specialKeys = new Array();
specialKeys.push(8,46); //Backspace
function IsNumeric(e) {
var keyCode = e.which ? e.which : e.keyCode;
console.log( keyCode );
var ret = ((keyCode >= 48 && keyCode <= 57) || specialKeys.indexOf(keyCode) != -1);
return ret;
}
//datepicker
$(function () {
$('#invoiceDate').datepicker({});
});
(ajax.php)
<?php
require_once 'config.php';
if(!empty($_POST['type'])){
$type = $_POST['type'];
$name = $_POST['name_startsWith'];
$query = "SELECT model, category FROM products where UPPER($type) LIKE '".strtoupper($name)."%'";
$result = mysqli_query($con, $query);
$data = array();
while ($row = mysqli_fetch_assoc($result)) {
$name = $row['model'].'|'.$row['category'];>>
array_push($data, $name);
}
echo json_encode($data);exit;
}
This is a sample of what I am trying to get to function. When you click in the "Model #" field, it should auto correct from a "products" database with the needed data. Right now it has "model,category" but the end result should have :
model, category, subcategory, description, cost, retail
I cannot for the life of me figure out how to fix this to where it autocompletes correctly :(


in the first code there are two required vars, the name and type with which the query is made in the database to return the information, as I see in the second code not you are considering .. before creating the query.. also you could check console log with dev tools on your browser to get error
if(!empty($_POST['type'])){
$type = $_POST['type'];
$name = $_POST['name_startsWith'];
} else { return false; }
$query = "SELECT ID, model, category, subcategory, description, cost, retail FROM products where UPPER($type) LIKE '".strtoupper($name)."%'";
....
the type var is the data-type in input type element using in js and send it as aditional post var .. check here:
html += '<td><input type="text" data-type="productCode" name="itemNo[]" id="itemNo_'+i+'" class="form-control autocomplete_txt" autocomplete="off"></td>';
and here
$(document).on('focus','.autocomplete_txt',function(){
type = $(this).data('type');
the type and name vars are send here in the ajax call
url : 'ajax.php',
dataType: "json",
method: 'post',
data: {
name_startsWith: request.term,
type: type
},
and those vars are "captured" using php $_POST you see.. in the ajax call the data option make 2 vars name_startsWith, type and in the php code $type = $_POST['type']; $name = $_POST['name_startsWith'];

Related

Error with ValidateCreditCard function in my Javascript Cart with PHP

when i click the Pay Now button in the Chrome console i see this error and nothing happens. I really need your help guys because my site is good, i need only to fix this error. Thanks in advance! Feel free to contact me for any incomprehension! Also you can find over here one photo of the error : Photo of Error in Console
//order_process.php
session_start();
$total_price = 0;
$item_details = '';
$order_details = '
<div class="table-responsive" id="order_table">
<table class="table table-bordered table-striped">
<tr>
<th>Prodotto</th>
<th>Quantità</th>
<th>Prezzo</th>
<th>Totale</th>
</tr>
';
if(!empty($_SESSION["shopping_cart"]))
{
foreach($_SESSION["shopping_cart"] as $keys => $values)
{
$order_details .= '
<tr>
<td>'.$values["product_name"].'</td>
<td>'.$values["product_quantity"].'</td>
<td align="right">€ '.$values["product_price"].'</td>
<td align="right">€ '.number_format($values["product_quantity"] * $values["product_price"], 2).'</td>
</tr>
';
$total_price = $total_price + ($values["product_quantity"] * $values["product_price"]);
$item_details .= $values["product_name"] . ', ';
}
$item_details = substr($item_details, 0, -2);
$order_details .= '
<tr>
<td colspan="3" align="right">Totale</td>
<td align="right">€ '.number_format($total_price, 2).'</td>
</tr>
';
}
$order_details .= '</table>';
?>
<!DOCTYPE html>
<html>
<head>
<title>Ordine</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="https://js.stripe.com/v2/"></script>
<script src="js/jquery.creditCardValidator.js"></script>
<meta charset="UTF-8" />
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js#1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<style>
.popover
{
width: 100%;
max-width: 800px;
}
.require
{
border:1px solid #FF0000;
background-color: #cbd9ed;
}
</style>
</head>
<body>
<div class="container">
<br />
<br />
<span id="message"></span>
<div class="panel panel-default">
<div class="panel-heading">Inserisci i dati per completare il tuo ordine.</div>
<div class="panel-body">
<form method="post" id="order_process_form" action="payment.php">
<div class="row">
<div class="col-md-8" style="border-right:1px solid #ddd;">
<h4 align="center">Dati Personali</h4>
<div class="form-group">
<label><b><i style="font-size:24px" class="fa"></i> Titolare Carta <span class="text-danger">*</span></b></label>
<input type="text" name="customer_name" id="customer_name" class="form-control" value="" />
<span id="error_customer_name" class="text-danger"></span>
</div>
<div class="form-group">
<label><b><i style="font-size:24px" class="fa"></i> Email <span class="text-danger">*</span></b></label>
<input type="text" name="email_address" id="email_address" class="form-control" value="" />
<span id="error_email_address" class="text-danger"></span>
</div>
<div class="form-group">
<label><b><i style="font-size:24px" class="fa"></i> Indirizzo <span class="text-danger">*</span></b></label>
<textarea name="customer_address" id="customer_address" class="form-control"></textarea>
<span id="error_customer_address" class="text-danger"></span>
</div>
<div class="row">
<div class="col-sm-6">
<div class="form-group">
<label><b>Città <span class="text-danger">*</span></b></label>
<input type="text" name="customer_city" id="customer_city" class="form-control" value="" />
<span id="error_customer_city" class="text-danger"></span>
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<label><b>CAP <span class="text-danger">*</span></b></label>
<input type="text" name="customer_pin" id="customer_pin" class="form-control" value="" />
<span id="error_customer_pin" class="text-danger"></span>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-6">
<div class="form-group">
<label><b>Stato </b></label>
<input type="text" name="customer_state" id="customer_state" class="form-control" value="" />
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<label><b>Nazione <span class="text-danger">*</span></b></label>
<input type="text" name="customer_country" id="customer_country" class="form-control" />
<span id="error_customer_country" class="text-danger"></span>
</div>
</div>
</div>
<hr />
<h4 align="center">Inserisci la carta di Credito.</h4>
<div class="form-group">
<label><i style="font-size:24px" class="fa"></i> Numero Carta <span class="text-danger">*</span></label>
<input type="text" name="card_holder_number" id="card_holder_number" class="form-control" placeholder="1234 5678 9012 3456" maxlength="20" onkeypress="" />
<span id="error_card_number" class="text-danger"></span>
</div>
<div class="form-group">
<div class="row">
<div class="col-md-4">
<label>mese di Scadenza</label>
<input type="text" name="card_expiry_month" id="card_expiry_month" class="form-control" placeholder="MM" maxlength="2" onkeypress="return only_number(event);" />
<span id="error_card_expiry_month" class="text-danger"></span>
</div>
<div class="col-md-4">
<label>Anno di Scadenza</label>
<input type="text" name="card_expiry_year" id="card_expiry_year" class="form-control" placeholder="YYYY" maxlength="4" onkeypress="return only_number(event);" />
<span id="error_card_expiry_year" class="text-danger"></span>
</div>
<div class="col-md-4">
<label>CVC</label>
<input type="text" name="card_cvc" id="card_cvc" class="form-control" placeholder="123" maxlength="4" onkeypress="return only_number(event);" />
<span id="error_card_cvc" class="text-danger"></span>
</div>
</div>
</div>
<br />
<div align="center">
<input type="hidden" name="total_amount" value="<?php echo $total_price; ?>" />
<input type="hidden" name="currency_code" value="EUR" />
<input type="hidden" name="item_details" value="<?php echo $item_details; ?>" />
<input type="button" name="button_action" id="button_action" class="btn btn-success btn-sm" onclick="stripePay(event)" value="Pay Now" />
</div>
<br />
</div>
<div class="col-md-4">
<h4 align="center">Details:</h4>
<?php
echo $order_details;
?>
</div>
</div>
</form>
</div>
</div>
</div>
</body>
</html>
<script>
function validate_form()
{
var valid_card = 0;
var valid = false;
var card_cvc = $('#card_cvc').val();
var card_expiry_month = $('#card_expiry_month').val();
var card_expiry_year = $('#card_expiry_year').val();
var card_holder_number = $('#card_holder_number').val();
var email_address = $('#email_address').val();
var customer_name = $('#customer_name').val();
var customer_address = $('#customer_address').val();
var customer_city = $('#customer_city').val();
var customer_pin = $('#customer_pin').val();
var customer_country = $('#customer_country').val();
var name_expression = /^[a-z ,.'-]+$/i;
var email_expression = /^([a-z0-9\+_\-]+)(\.[a-z0-9\+_\-]+)*#([a-z0-9\-]+\.)+[a-z]{2,6}$/;
var month_expression = /^01|02|03|04|05|06|07|08|09|10|11|12$/;
var year_expression = /^2017|2018|2019|2020|2021|2022|2023|2024|2025|2026|2027|2028|2029|2030|2031$/;
var cvv_expression = /^[0-9]{3,3}$/;
$('#card_holder_number').validateCreditCard(function(result){
if(result.valid)
{
$('#card_holder_number').removeClass('require');
$('#error_card_number').text('');
valid_card = 1;
}
else
{
$('#card_holder_number').addClass('require');
$('#error_card_number').text('Numero Carta Invalido');
valid_card = 0;
}
});
if(valid_card == 1)
{
if(!month_expression.test(card_expiry_month))
{
$('#card_expiry_month').addClass('require');
$('#error_card_expiry_month').text('Data Errata');
valid = false;
}
else
{
$('#card_expiry_month').removeClass('require');
$('#error_card_expiry_month').text('');
valid = true;
}
if(!year_expression.test(card_expiry_year))
{
$('#card_expiry_year').addClass('require');
$('#error_card_expiry_year').error('Data Errata');
valid = false;
}
else
{
$('#card_expiry_year').removeClass('require');
$('#error_card_expiry_year').error('');
valid = true;
}
if(!cvv_expression.test(card_cvc))
{
$('#card_cvc').addClass('require');
$('#error_card_cvc').text('Data Errata');
valid = false;
}
else
{
$('#card_cvc').removeClass('require');
$('#error_card_cvc').text('');
valid = true;
}
if(!name_expression.test(customer_name))
{
$('#customer_name').addClass('require');
$('#error_customer_name').text('Nome Errato');
valid = false;
}
else
{
$('#customer_name').removeClass('require');
$('#error_customer_name').text('');
valid = true;
}
if(!email_expression.test(email_address))
{
$('#email_address').addClass('require');
$('#error_email_address').text('Indirizzo Email Errato');
valid = false;
}
else
{
$('#email_address').removeClass('require');
$('#error_email_address').text('');
valid = true;
}
if(customer_address == '')
{
$('#customer_address').addClass('require');
$('#error_customer_address').text('Inserisci Indirizzo');
valid = false;
}
else
{
$('#customer_address').removeClass('require');
$('#error_customer_address').text('');
valid = true;
}
if(customer_city == '')
{
$('#customer_city').addClass('require');
$('#error_customer_city').text('Inserisci Città');
valid = false;
}
else
{
$('#customer_city').removeClass('require');
$('#error_customer_city').text('');
valid = true;
}
if(customer_pin == '')
{
$('#customer_pin').addClass('require');
$('#error_customer_pin').text('Inserisci CAP');
valid = false;
}
else
{
$('#customer_pin').removeClass('require');
$('#error_customer_pin').text('');
valid = true;
}
if(customer_country == '')
{
$('#customer_country').addClass('require');
$('#error_customer_country').text('Inserisci Nazione');
valid = false;
}
else
{
$('#customer_country').removeClass('require');
$('#error_customer_country').text('');
valid = true;
}
}
return valid;
}
Stripe.setPublishableKey('pk_test_JKDlpKvWn3oe1nIwl75D9pC400hFQsqUwu');
function stripeResponseHandler(status, response)
{
if(response.error)
{
$('#button_action').attr('disabled', false);
$('#message').html(response.error.message).show();
}
else
{
var token = response['id'];
$('#order_process_form').append("<input type='hidden' name='token' value='" + token + "' />");
$('#order_process_form').submit();
}
}
function stripePay(event)
{
event.preventDefault();
if(validate_form() == true)
{
$('#button_action').attr('disabled', 'disabled');
$('#button_action').val('Payment Processing....');
Stripe.createToken({
number:$('#card_holder_number').val(),
cvc:$('#card_cvc').val(),
exp_month : $('#card_expiry_month').val(),
exp_year : $('#card_expiry_year').val()
}, stripeResponseHandler);
return false;
}
}
function only_number(event)
{
var charCode = (event.which) ? event.which : event.keyCode;
if (charCode != 32 && charCode > 31 && (charCode < 48 || charCode > 57))
{
return false;
}
return true;
}
</script>

How to insert dynamically added input fields values in single database column?

I have added 2 dynamically added input fields in my application.
I want insert 2 field values in to 2 database column.
<div class="form-group ">
<div id="itemRows" class="col-md-12">
<div class="row">
<label>Earnings</label> <input type="text" name="add_qty" size="4" />
<label>Amount <input type="text" name="add_name" oninput="this.value
= this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');" />
<button onclick="addRow(this.form);"><i class="menu-icon mdi mdi-
plus-circle"></i></button></div>
<script>
var rowNum = 0;
function addRow(frm) {
rowNum ++;
var row = '<p id="rowNum'+rowNum+'">Earnings: <input type="text"
name="qty[]" size="4" value="'+frm.add_qty.value+'"> Amount: <input
type="text" name="name[]" value="'+frm.add_name.value+'">
<input type="button" value="Remove"
onclick="removeRow('+rowNum+');"></p>';
jQuery('#itemRows').append(row);
frm.add_qty.value = '';
frm.add_name.value = '';
}
</script>
<script>
function removeRow(rnum) {
jQuery('#rowNum'+rnum).remove();
}
</script>
</div>
</div>
I want to add all the earnings in earnings column and amount in amount column in database

First please correct your code In this naming is diffrent in both Html
<?php include 'config.php';
for($i = 0; $i < count($_POST['add_qty']); $i++)
{
$add_qty = mysqli_real_escape_string($connect, $_POST['add_qty'][$i]);
$add_name = mysqli_real_escape_string($connect, $_POST['add_name'][$i]);
if (empty(trim($add_qty))) continue;
$sql = "INSERT INTO earnigs_tbl(earnings, amount)
VALUES('$add_qty', '$add_name')";
mysqli_query($connect, $sql);
}
if(mysqli_error($connect))
{
echo "Data base error occure";
}
else
{
echo $i . " rows added";
}
?>
<div class="form-group ">
<div id="itemRows" class="col-md-12">
<div class="row">
<label>Earnings</label> <input type="text" name="add_qty" size="4" />
<label>Amount <input type="text" name="add_name" oninput="this.value
= this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');" />
<button onclick="addRow(this.form);"><i class="menu-icon mdi mdi-
plus-circle"></i></button></div>
<script>
var rowNum = 0;
function addRow(frm) {
rowNum ++;
var row = '<p id="rowNum'+rowNum+'">Earnings: <input type="text"
name="add_qty[]" size="4" value="'+frm.add_qty.value+'"> Amount: <input
type="text" name="add_name[]" value="'+frm.add_name.value+'">
<input type="button" value="Remove"
onclick="removeRow('+rowNum+');"></p>';
jQuery('#itemRows').append(row);
frm.add_qty.value = '';
frm.add_name.value = '';
}
</script>
<script>
function removeRow(rnum) {
jQuery('#rowNum'+rnum).remove();
}
</script>
</div>
</div>

best approach in adding a comma to a number like 123,456.78 in jquery

found this solution in this solution
function commaSeparateNumber(val){
while (/(\d+)(\d{3})/.test(val.toString())){
val = val.toString().replace(/(\d+)(\d{3})/, '$1'+','+'$2');
}
return val;
}
in this link add commas to a number in jQuery
I am trying to apply it in my project. it works in one column but it doesn't work in price and sub total
function commaSeparateNumber(val){
while (/(\d+)(\d{3})/.test(val.toString())){
val = val.toString().replace(/(\d+)(\d{3})/, '$1'+','+'$2');
}
return val;
}
var rowCount = 1;
$('#add').click(function() {
rowCount++;
$('#orders').append('<tr id="row'+rowCount+'"><td><input class="form-control product_price" type="number" data-type="product_price" id="product_price_'+rowCount+'" name="product_price[]" for="'+rowCount+'"/></td><input class="form-control" type="hidden" data-type="product_id" id="product_id_'+rowCount+'" name="product_id[]" for="'+rowCount+'"/><td><input class="form-control quantity" type="number" class="quantity" id="quantity_'+rowCount+'" name="quantity[]" for="'+rowCount+'"/> </td><td><input class="form-control total_cost" type="text" id="total_cost_'+rowCount+'" name="total_cost[]" for="'+rowCount+'" readonly/> </td><td><button type="button" name="remove" id="'+rowCount+'" class="btn btn-danger btn_remove cicle">-</button></td></tr>');
});
// Add a generic event listener for any change on quantity or price classed inputs
$("#orders").on('input', 'input.quantity,input.product_price', function() {
getTotalCost($(this).attr("for"));
});
$(document).on('click', '.btn_remove', function() {
var button_id = $(this).attr('id');
$('#row'+button_id+'').remove();
});
// Using a new index rather than your global variable i
function getTotalCost(ind) {
var qty = $('#quantity_'+ind).val();
var price = $('#product_price_'+ind).val();
var totNumber = (qty * price);
var tot = totNumber.toFixed(2);
tot = commaSeparateNumber(totNumber);
$('#total_cost_'+ind).val(tot);
calculateSubTotal();
}
function calculateSubTotal() {
var subtotal = 0;
$('.total_cost').each(function() {
subtotal += parseFloat($(this).val());
});
$('#subtotal').val(commaSeparateNumber(subtotal));
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
<body>
<div class="col-md-12">
<div class="line line-dashed line-lg pull-in"></div>
<div class="row">
<table class="table table-bordered" id="orders">
<tr>
<th>Price</th>
<th>Quantity</th>
<th>Total Cost</th>
<th>
</th>
</tr>
<tr>
<td><input class="form-control product_price" type='number' data-type="product_price" id='product_price_1' name='product_price[]' for="1"/></td> <!-- purchase_cost -->
<td><input class="form-control quantity" type='number' id='quantity_1' name='quantity[]' for="1"/></td>
<td><input class="form-control total_cost" type='text' id='total_cost_1' name='total_cost[]' for='1' readonly/></td>
<td><button type="button" name="add" id="add" class="btn btn-success circle">+</button></td>
</tr>
</table>
<input class="form-control" type='hidden' data-type="product_id_1" id='product_id_1' name='product_id[]'/>
</div>
</div>
<div class="line line-dashed line-lg pull-in" style="clear: both;"></div>
<div class="col-md-12 nopadding">
<div class="col-md-4 col-md-offset-4 pull-right nopadding">
<div class="col-md-8 pull-right nopadding">
<div class="form-group">
<td><input class="form-control subtotal" type='text' id='subtotal' name='subtotal' readonly/></td>
</div>
</div>
<div class="col-md-3 pull-right">
<div class="form-group">
<label>Subtotal</label>
</div>
</div>
</div>
</div>
</body>
</html>
Thank you so much in advance!

The problem is that parseFloat fails to correctly parse the value from the total cost textbox because it contains one or more ,. You need to remove the , from the string before parsing to float. You can remove any ,'s by calling .replace(/,/g,'') on the textbox value in the calculateSubTotal function.
It seems that for some values the function commaSeparateNumber doesn't work as expected. I removed it from the snippet below and replaced it with toLocaleString() which takes parameters for locale and minimum/maximum fraction digits .toLocalString("en-US", { maximumFractionDigits: 2}). Set the locale to one you know uses , to separate thousands. If you know that won't be an issue you can pass undefined for the locale.
Your snippet has been updated below:
var rowCount = 1;
$('#add').click(function() {
rowCount++;
$('#orders').append('<tr id="row'+rowCount+'"><td><input class="form-control product_price" type="number" data-type="product_price" id="product_price_'+rowCount+'" name="product_price[]" for="'+rowCount+'"/></td><input class="form-control" type="hidden" data-type="product_id" id="product_id_'+rowCount+'" name="product_id[]" for="'+rowCount+'"/><td><input class="form-control quantity" type="number" class="quantity" id="quantity_'+rowCount+'" name="quantity[]" for="'+rowCount+'"/> </td><td><input class="form-control total_cost" type="text" id="total_cost_'+rowCount+'" name="total_cost[]" for="'+rowCount+'" readonly/> </td><td><button type="button" name="remove" id="'+rowCount+'" class="btn btn-danger btn_remove cicle">-</button></td></tr>');
});
// Add a generic event listener for any change on quantity or price classed inputs
$("#orders").on('input', 'input.quantity,input.product_price', function() {
getTotalCost($(this).attr("for"));
});
$(document).on('click', '.btn_remove', function() {
var button_id = $(this).attr('id');
$('#row'+button_id+'').remove();
});
// Using a new index rather than your global variable i
function getTotalCost(ind) {
var qty = $('#quantity_'+ind).val();
var price = $('#product_price_'+ind).val();
var totNumber = (qty * price);
// .toLocaleString
var tot = totNumber.toLocaleString("en-US", { maximumFractionDigits: 2});
$('#total_cost_'+ind).val(tot);
calculateSubTotal();
}
function calculateSubTotal() {
var subtotal = 0;
$('.total_cost').each(function() {
// replace ',' here
subtotal += parseFloat($(this).val().replace(/,/g,''));
});
// toLocaleString
$('#subtotal').val(subtotal.toLocaleString("en-US", { maximumFractionDigits: 2}));
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
<body>
<div class="col-md-12">
<div class="line line-dashed line-lg pull-in"></div>
<div class="row">
<table class="table table-bordered" id="orders">
<tr>
<th>Price</th>
<th>Quantity</th>
<th>Total Cost</th>
<th>
</th>
</tr>
<tr>
<td><input class="form-control product_price" type='number' data-type="product_price" id='product_price_1' name='product_price[]' for="1"/></td> <!-- purchase_cost -->
<td><input class="form-control quantity" type='number' id='quantity_1' name='quantity[]' for="1"/></td>
<td><input class="form-control total_cost" type='text' id='total_cost_1' name='total_cost[]' for='1' readonly/></td>
<td><button type="button" name="add" id="add" class="btn btn-success circle">+</button></td>
</tr>
</table>
<input class="form-control" type='hidden' data-type="product_id_1" id='product_id_1' name='product_id[]'/>
</div>
</div>
<div class="line line-dashed line-lg pull-in" style="clear: both;"></div>
<div class="col-md-12 nopadding">
<div class="col-md-4 col-md-offset-4 pull-right nopadding">
<div class="col-md-8 pull-right nopadding">
<div class="form-group">
<td><input class="form-control subtotal" type='text' id='subtotal' name='subtotal' readonly/></td>
</div>
</div>
<div class="col-md-3 pull-right">
<div class="form-group">
<label>Subtotal</label>
</div>
</div>
</div>
</div>
</body>
</html>

Get all values in my added column using PHP (codeigniter)

I am studying the dbforge, and trying to apply it with my website. My basis or guide is the localhost/phpmyadmin where you will create a new table, i am done with the part of table name, name,type,attribute,length of the column and also the adding the column(see the picture below) .
Question: How can I retrieve all the post value?
Note: I tried to echo json_encode($_POST); im only getting 1 value.
View
<form id="new-table">
<div class="col-md-6">
<label>Table Name:</label>
<input type="hidden" name="type" value="new_table">
<input type="text" class="form-control border-input" name="table_name" id="table_name"><br>
<div class="text-danger" id="table_name_error"></div>
</div>
<!-- col-md-6 -->
<div class="col-md-3">
<label>Columns:</label>
<!-- <input type="text" class="form-control border-input" name="table_name" id="table_name"> -->
<input type="text" class="form-control border-input" id="number_of_column" >
</div>
<div class="col-md-3">
<br>
<button type="button" class="btn btn-info btn-fill btn-wd" onclick="addColumn()">Add</button>
</div>
<!-- col-md-3 -->
</div> <!-- row-->
<!-- <input type='button' value='Add Children' id='addButton' class="btn btn-sm btn-primary"> -->
<div class="row">
<div class="col-md-2">
<h6>Name</h6>
<input type="text" class="form-control border-input" name="field_name" id="field_name">
<div class="text-danger" id="field_name_error"></div>
</div>
<div class="col-md-2">
<h6>Type</h6>
<select class="form-control border-input" name="field_type" id="field_type">
<option value="volvo">Varchar</option>
<option value="saab">Int</option>
<option value="mercedes">Date</option>
<option value="audi">Text</option>
</select>
</div>
<div class="col-md-2">
<h6>Length/Value</h6>
<input type="text" class="form-control border-input" name="field_length" id="field_length">
<div class="text-danger" id="field_length_error"></div>
</div>
<div class="col-md-2">
<h6>Default</h6>
<input type="text" class="form-control border-input" name="field_default" id="field_default">
<div class="text-danger" id="field_default_error"></div>
</div>
<div class="col-md-2">
<h6>Attributes</h6>
<input type="text" class="form-control border-input" name="field_attributes" id="field_attributes">
<div class="text-danger" id="field_attributes_error"></div>
</div>
<div class="col-md-2">
<h6>Null</h6>
<input type="text" class="form-control border-input" name="field_null" value="null"><br>
<div class="text-danger" id="field_null_error"></div>
</div>
<div id="append">
<div id="TextBoxDiv1">
</div>
</div>
</div> <!-- row -->
<div class="text-right">
<button type="submit" class="btn btn-info btn-fill btn-wd">Update Profile</button>
</div>
</div>
<div class="clearfix"></div>
</form>
Controller
JS
My creating new column function
function addColumn()
{
var i = 0;
var columns = document.getElementById("number_of_column").value;
for(i=1;i<=columns;i++)
{
var newTextBoxDiv = $(document.createElement('div')).attr("id", 'TextBoxDiv' );
newTextBoxDiv.after().html('<div class="col-md-2">'+
'<label>Name</label>'+
'<input type="text" class="form-control border-input" name="field_name[]" id="field_name[]">'+
'<div class="text-danger" id="children_fname_error"></div>'+
'</div>'+
'<div class="col-md-2">'+
'<h6>Type</h6>'+
'<select class="form-control border-input" name="field_type[]" id="field_type[]">'+
'<option value="volvo">Varchar</option>'+
'<option value="saab">Int</option>'+
'<option value="mercedes">Date</option>'+
'<option value="audi">Text</option>'+
'</select>'+
'</div>'+
'<div class="col-md-2">'+
'<h6>Length/Value</h6>'+
'<input type="text" class="form-control border-input" name="field_length[]" id="field_length[]">'+
'<div class="text-danger" id="field_length_error"></div>'+
'</div>'+
'<div class="col-md-2">'+
'<h6>Default</h6>'+
'<input type="text" class="form-control border-input" name="field_default" id="field_default">'+
'<div class="text-danger" id="field_default_error"></div>'+
'</div>'+
'<div class="col-md-2">'+
'<h6>Attributes</h6>'+
'<input type="text" class="form-control border-input" name="field_attributes" id="field_attributes">'+
'<div class="text-danger" id="field_attributes_error"></div>'+
'</div>'+
'<div class="col-md-2">'+
'<h6>Null</h6>'+
'<input type="text" class="form-control border-input" name="field_null" id="field_null"><br>'+
'<div class="text-danger" id="field_null_error"></div>'+
'</div>'
);
newTextBoxDiv.appendTo("#append");
}
document.getElementById("number_of_column").value = "";
}
** My submit form**
$(document).ready(function(){
$("#new-table").on('submit',function(e){
$.ajax({
url: base_url+"formsubmit/new_form_submit",
type: "POST",
data: $(this).serialize(),
success:function(data)
{
var result = JSON.parse(data);
if(result === "success")
{
$("h5").html("");
success_message("#success-message-edit-content-1","Update Successfully!");
window.setTimeout(function(){location.href=base_url+"administrator/view_content"},2000);
}
else{
$("#table_name_error").html(result.table_name_error);
$("#field_name_error").html(result.field_name_error);
$("#field_type_error").html(result.field_type_error);
$("#field_length_error").html(result.field_length_error);
}
},
error: function(data) {
alert('error');
}
})
e.preventDefault();
})
})

In your code, I see you already have an input with name="field_name" and in the addColumn()
function you are also adding another input with the same name.
When you have a input named "field_name" in the form and later you again dynamically add another input with the same name again, they replaces one another and there is only one of their value present in the post data with that same name.
You can use array inputs here, like
<input name="field_name[]" ... />
<input name="field_type[]" ... />
...
<input name="field_name[]" ... />
<input name="field_type[]" ... />
...
<input name="field_name[]" ... />
<input name="field_type[]" ... />
...
You will get the Post array like:
Array
(
[field_name] => Array
(
[0] => fv1
[1] => fv2
....
)
[field_type] => Array
(
[0] => ftv1
[1] => ftv12
...
)
)
So for parsing:
$fields_array = array();
$no_of_fields = isset($_POST['field_name'])? count($_POST['field_name']) : 0;
for ($i=1; $i<=$no_of_fields; $i++) {
$tmp = array();
if (isset($_POST['field_name'][$i])) $tmp[] = $_POST['field_name'][$i];
if (isset($_POST['field_type'][$i])) $tmp[] = $_POST['field_type'][$i];
...
if (!empty($tmp)) $fields_array[] = array();
}
It is a little bit errorprone(assuming field_name, field_type will have arrays of same number of elements, if one is missing the parallel serial among them will be corrupted) approach.
Better to use counter for the fields.
For example:
<input name="no_of_fields" value="1"/>
Which's value will be increased in each addition.
And your form be like:
<input name="field_name_1" .../>
<input name="field_type_1" .../>
...
<input name="field_name_2" .../>
<input name="field_type_2" .../>
...
<input name="field_name_3" .../>
<input name="field_type_3" .../>
...
For parsing on the server side, you can go for:
$fields_array = array();
$no_of_fields = isset($_POST['no_of_fields'])? intval($no_of_fields) : 0;
if ($no_of_fields > 0) {
for ($i=1; $i<=$no_of_fields; $i++) {
$tmp = array();
if (isset($_POST['field_name_'.$i])) $tmp[] = $_POST['field_name_'.$i];
if (isset($_POST['field_type_'.$i])) $tmp[] = $_POST['field_type_'.$i];
...
if (!empty($tmp)) $fields_array[] = array();
}
}
// Now process/output the $fields_array;

CKeditor not working in my second textarea editing,

If I put my code in a single file to get a single webpage I get the results.
When introduce to the main page via get data with a function type with ajax it's not working, tried multiple solution but no winning one.
I've put the script tag with the url for ckeditor and still no luck.
But if I code it like just one page for a single website page, ckeditor works fine but not when link to another coded page in 2 separate files.
Need help and thanks
I've tried CKEDITOR.replaceAll(); in the script at the bottom of page before the end body tag like suggested and still only works for the first textarea.
I'll put the 2 files in question
items_list.php
<?php
include "../includes/db.php";
if(isset($_POST['item_submit'])){
//mysqli_real_escape_string is a web protection for intrusion
$item_title = mysqli_real_escape_string($conn, strip_tags($_POST['item_title']));
$item_description = mysqli_real_escape_string($conn, $_POST['item_description']);
$item_category = mysqli_real_escape_string($conn, strip_tags($_POST['item_category']));
$item_qty = mysqli_real_escape_string($conn, strip_tags($_POST['item_qty']));
$item_cost = mysqli_real_escape_string($conn, strip_tags($_POST['item_cost']));
$item_price = mysqli_real_escape_string($conn, strip_tags($_POST['item_price']));
$item_discount = mysqli_real_escape_string($conn, strip_tags($_POST['item_discount']));
$item_delivery = mysqli_real_escape_string($conn, strip_tags($_POST['item_delivery']));
if(isset($_FILES['item_image']['name'])){
$file_name = $_FILES['item_image']['name'];
$path_address = "../images/items/$file_name";
$path_address_db = "images/items/$file_name";
$img_confirm = 1;
$file_type = pathinfo($_FILES['item_image']['name'], PATHINFO_EXTENSION);
if($_FILES['item_image']['size']>200000){
$img_confirm = 0;
echo "size 2 big";
}
if($file_type != 'jpg' && $file_type != 'png' && $file_type != 'gif'){
$img_confirm = 0;
echo "type mismatch";
}
if($img_confirm == 0){
}else{
if(move_uploaded_file($_FILES['item_image']['tmp_name'], $path_address)){
$item_ins_sql = "INSERT INTO items (item_image, item_title, item_description, item_cat, item_qty, item_cost, item_price, item_discount, item_delivery) VALUES ('$path_address_db','$item_title','$item_description','$item_category','$item_qty','$item_cost','$item_price','$item_discount','$item_delivery')";
$item_ins_run = mysqli_query($conn, $item_ins_sql);
}
}
}else{
echo "sorry";
}
}
if( isset($_POST['edit_submit'])){
//include "item_list_process.php";
$item_id = mysqli_real_escape_string($conn, strip_tags($_POST['item_id']));
$item_title = mysqli_real_escape_string($conn, strip_tags($_POST['item_title1']));
$item_description = mysqli_real_escape_string($conn, $_POST['item_description1']);
$item_category = mysqli_real_escape_string($conn, strip_tags($_POST['item_cat']));
$item_qty = mysqli_real_escape_string($conn, strip_tags($_POST['item_qty']));
$item_cost = mysqli_real_escape_string($conn, strip_tags($_POST['item_cost']));
$item_price = mysqli_real_escape_string($conn, strip_tags($_POST['item_price']));
$item_discount = mysqli_real_escape_string($conn, strip_tags($_POST['item_discount']));
$item_delivery = mysqli_real_escape_string($conn, strip_tags($_POST['item_delivery']));
echo $item_id;
$item_up_sql = "UPDATE items SET item_title = '$item_title', item_description = '$item_description', item_cat = '$item_category', item_qty = '$item_qty', item_cost = '$item_cost', item_price = '$item_price', item_discount = '$item_discount', item_delivery = '$item_delivery' WHERE item_id = '$item_id' ";
$item_up_run = mysqli_query($conn, $item_up_sql);
}
?>
<html>
<head>
<title>Online Shopping | Admin Panel</title>
<link rel="stylesheet" href="../css/bootstrap.css">
<link rel="stylesheet" href="../css/admin_style.css">
<script src="../js/jquery.js"></script>
<script src="../js/bootstrap.js"></script>
<script src="https://cdn.ckeditor.com/4.7.1/standard-all/ckeditor.js"></script>
<script>
function get_item_list_data(){
xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
document.getElementById('get_item_list_data').innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open('GET', 'item_list_process.php', true);
xmlhttp.send();
}
function del_item(item_id){
xmlhttp.onreadystatechange = function() {
if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
document.getElementById('get_item_list_data').innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open('GET', 'item_list_process.php?del_item_id='+item_id, true);
xmlhttp.send();
}
</script>
</head>
<body onload="get_item_list_data()">
<?php include "includes/header.php"; ?>
<div class="container">
<button class="btn btn_red btn-danger" data-toggle="modal" data-target="#add_new_item" data-backdrop="static" data-keyboard="false">Add New Item</button>
<div id="add_new_item" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Add New Item</h4>
</div>
<div class="modal-body">
<form method="post" enctype="multipart/form-data" name="addNewItemForm">
<div class="form-group">
<label>Item Image</label>
<input type="file" id="image" name="item_image" class="form-control" placeholder="Enter location on drive for the image of item" required>
</div>
<div class="form-group">
<label>Item Title</label>
<input type="text" id="item_title" name="item_title" class="form-control" placeholder="Enter Title or Name of Item" required>
</div>
<div class="form-group">
<label>Item Description</label>
<!------Here is the ckeditor that's working-------------->
<textarea class="form-control ckeditor" id="item_description" name="item_description" required></textarea>
</div>
<div class="form-group">
<label>Item Category</label>
<select class="form-control" name="item_category" required>
<option>Select a Category</option>
<?php
$cat_sql = "SELECT * FROM item_cat";
$cat_run = mysqli_query($conn, $cat_sql);
while($cat_rows = mysqli_fetch_assoc($cat_run)){
$cat_name = ucwords($cat_rows['cat_name']);
if($cat_rows['cat_slug'] == ''){
$cat_slug = $cat_rows['cat_name'];
}else{
$cat_slug = $cat_rows['cat_slug'];
}
echo "
<option value='$cat_slug'>$cat_name</option>";
}
?>
</select>
</div>
<div class="form-group">
<label>Item Quantity</label>
<input type="number" name="item_qty" class="form-control" placeholder="Enter the quantity you have in stocks" required>
</div>
<div class="form-group">
<label>Item Cost</label>
<input type="number" name="item_cost" class="form-control" placeholder="Enter the cost you paid for the item" required>
</div>
<div class="form-group">
<label>Item Price</label>
<input type="number" name="item_price" class="form-control" placeholder="Enter the price to sell to clients" required>
</div>
<div class="form-group">
<label>Item Discount</label>
<input type="number" name="item_discount" class="form-control" placeholder="Enter the amount of discount in dollars we are giving" >
</div>
<div class="form-group">
<label>Item Delivery</label>
<input type="number" name="item_delivery" class="form-control" placeholder="Enter the amount to charge for shipping">
</div>
<div class="form-group">
<input type="submit" name="item_submit" class="btn btn-primary btn-block" value="SUBMIT">
</div>
</form>
</div>
<div class="modal-footer">
<button class="btn btn_red btn-danger" data-dismiss="modal">CLOSE</button>
</div>
</div>
</div>
</div>
<div id="get_item_list_data">
<!---------------------Area for process item list data------------>
</div>
</div>
<?php include "includes/footer.php"; ?>
<script>
//CKEDITOR.replaceAll();
// CKEDITOR.instances.item_description.destroy();
//CKEDITOR.replace( 'item_description' );
//ckeditorOff();
//CKEDITOR.add
//CKEDITOR.replace( 'item_description1' );
</script>
</body>
</html>
Second file item_list_process.php
<?php
include "../includes/db.php";
if(isset($_REQUEST['del_item_id'])){
$del_sql = "DELETE FROM items WHERE item_id = '$_REQUEST[del_item_id]'";
$del_run = mysqli_query($conn, $del_sql);
}
?>
<table class="table table-bordered table-striped">
<thead>
<tr class="item-head">
<th>S. no.</th>
<th>Image</th>
<th>Item Title</th>
<th>Item Description</th>
<th>Item Category</th>
<th>Item Qty</th>
<th>Item Cost</th>
<th>Item Price</th>
<th>Item Discount</th>
<th>Item Delivery</th>
</tr>
</thead>
<tbody>
<?php
$c = 1;
$sel_sql = "SELECT * FROM items";
$sel_run = mysqli_query($conn, $sel_sql);
while($rows = mysqli_fetch_assoc($sel_run)){
$discountPrice = $rows['item_price'] - $rows['item_discount'];
echo "
<tr>
<td>$c</td>
<td><img src='../$rows[item_image]' style='width:30px'></td>
<td>$rows[item_title]</td>
<td>"; echo strip_tags($rows['item_description']); echo "</td>
<td>$rows[item_cat]</td>
<td>$rows[item_qty]</td>
<td>$rows[item_cost]</td>
<td>$rows[item_price]</td>
<td>$discountPrice($rows[item_discount])</td>
<td>
<div class='dropdown'>
<button class='btn btn_red btn-danger dropdown-toggle' data-toggle='dropdown'>Actions<span class='caret'></span></button>
<ul class='dropdown-menu dropdown-menu-right'>
<li>
<a href='#edit_modal$rows[item_id]' data-toggle='modal' >Edit</a>
</li>";
?>
<li>Delete</li>
<?php
echo "
</ul>
</div>
<div class='modal fade ' id='edit_modal$rows[item_id]' role='dialog'>
<div class='modal-dialog'>
<div class='modal-content'>
<div class='modal-header'>
<button class='close' data-dismiss='modal'>×</button>
<h4 class='modal-title'>Edit Item</h4>
</div>
<div class='modal-body'>
<form method='post' name='editForm'>
<input type='hidden' name='item_id' id='item_id' value='$rows[item_id]'>
<div class='form-group'>
<label>Item Title</label>
<input type='text' value='$rows[item_title]' id='item_title1' name='item_title1' class='form-control' required>
</div>
<div class='form-group' id='tracking_text'>
<label>Item Description</label>
//-------------------This is for the second ckeditor--------------- >
<textarea class='form-control ckeditor' name='item_description1' id='item_description11' required>$rows[item_description]</textarea>
</div>
<div class='form-group'>
<label>Item Category</label>
<select class='form-control' value='$rows[item_cat]' name='item_cat' id='item_cat' required>
";
$cat_sql = "SELECT * FROM item_cat";
$cat_run = mysqli_query($conn, $cat_sql);
while($cat_rows = mysqli_fetch_assoc($cat_run)){
$cat_name = ucwords($cat_rows['cat_name']);
if($cat_rows['cat_slug'] == ''){
$cat_slug = $cat_rows['cat_name'];
}else{
$cat_slug = $cat_rows['cat_slug'];
}
if($cat_slug == $rows['item_cat']){
echo "
<option selected value='$cat_slug'>$cat_name</option>";
}else{
echo "
<option value='$cat_slug'>$cat_name</option>";
}
}
echo "
</select>
</div>
<div class='form-group'>
<label>Item Quantity</label>
<input type='number' value='$rows[item_qty]' name='item_qty' id='item_qty' class='form-control' required>
</div>
<div class='form-group'>
<label>Item Cost</label>
<input type='number' value='$rows[item_cost]' name='item_cost' id='item_cost' class='form-control' required>
</div>
<div class='form-group'>
<label>Item Price</label>
<input type='number' value='$rows[item_price]' name='item_price' id='item_price' class='form-control' required>
</div>
<div class='form-group'>
<label>Item Discount</label>
<input type='number' value='$rows[item_discount]' name='item_discount' id='item_discount' class='form-control'>
</div>
<div class='form-group'>
<label>Item Delivery</label>
<input type='number' value='$rows[item_delivery]' name='item_delivery' id='item_delivery' class='form-control'>
</div>
<div class='form-group'>
";
?>
<button type="submit" name="edit_submit" id="edit_submit" class='btn btn-primary btn-block' >SUBMIT</button>
</div>
</form>
</div> <!---end of modal body--->
<div class='modal-footer'>
<button class='btn btn_red btn-danger' data-dismiss='modal'>CLOSE</button>
</div>
</div> <!---end of modal content--->
</div> <!---end of modal dialog--->
</div> <!---end of modal div fade--->
</td>
</tr>
<?php
$c++;
}
?>
</tbody>
</table>

Categories

Resources