Develop Reference

Trouble with datatables reload()

I want to populate a jQuery datatable based on the content of a textarea. Note: my datatables implementation is not serverside. That is: sorting/filtering happens on the client.
I know my php works as it returns expected results in my test scenario (see below). I have included a lot of code to provide context. I am new to datatables and php.
My html looks like this:
// DataTable Initialization
// (no ajax yet)
$('#selectedEmails').DataTable({
select: {
sytle: 'multiple',
items: 'row'
},
paging: false,
scrollY: '60vh',
scrollCollapse: true,
columns: [
{data: "CONICAL_NAME"},
{data: "EMAIL_ADDRESS"}
]
});
// javascript that defines the ajax (called by textarea 'onfocus' event)
function getEmails(componentID) {
deselectTabs();
assignedEmails = document.getElementById(componentID).value.toUpperCase().split(",");
alert(JSON.stringify(assignedEmails)); //returns expected json
document.getElementById('email').style.display = "block";
//emailTable = $('#selectedEmails').DataTable();
try {
$('#selectedEmails').DataTable().ajax =
{
url: "php/email.php",
contentType: "application/json",
type: "POST",
data: JSON.stringify(assignedEmails)
};
$('#selectedEmails').DataTable().ajax.reload();
} catch (err) {
alert(err.message); //I get CANNOT SET PROPERTY 'DATA' OF null
}
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!-- table skeleton -->
<table id="selectedEmails" class="display" style="width: 100%">
<thead>
<tr>
<th colspan='2'>SELECTED ADDRESSES</th>
</tr>
<tr>
<th>Conical Name</th>
<th>Email Address</th>
</tr>
</thead>
</table>
<!-- textarea definition -->
<textarea id='distribution' name='distribution' rows='3'
style='width: 100%' onblur="validateEmail('INFO_DISTRIBUTION', 'distribution');"
onfocus="getEmails('distribution');">
</textarea>
The following code returns the expected json:
var url = "php/email.php";
emailList = ["someone#mycompany.com","someoneelse#mycompany.com"];
fetch(url, {
method: 'post',
body: JSON.stringify(emailList),
headers: {
'Content-Type': 'application/json'
}
}).then(function (response) {
return response.text();
}).then(function (text) {
alert( JSON.stringify( JSON.parse(text))); //expencted json
}).catch(function (error) {
alert(error);
});
php code:
require "openDB.php";
if (!$ora) {
$rowsx = array();
$rowx = array("CONICAL_NAME" => "COULD NOT CONNECT", "EMAIL_ADDRESS" => "");
$rowsx[0] = $rowx;
echo json_encode($rowsx);
} else {
//basic query
$query = "SELECT CONICAL_NAME, EMAIL_ADDRESS "
. "FROM SCRPT_APP.BCBSM_PEOPLE "
. "WHERE KEY_EMAIL LIKE '%#MYCOMANY.COM' ";
//alter query to get specified entries if first entry is not 'everybody'
if ($emailList[0]!='everybody') {
$p = 0;
$parameters = array();
foreach ($emailList as $email) {
$parmName = ":email" . $p;
$parmValue = strtoupper(trim($email));
$parameters[$p] = array($parmName,$parmValue);
$p++;
}
$p0=0;
$query = $query . "AND KEY_EMAIL IN (";
foreach ($parameters as $parameter) {
if ($p0 >0) {
$query = $query.",";
}
$query = $query.$parameter[0];
$p0++;
}
$query = $query . ") ";
$query = $query . "ORDER BY CONICAL_NAME";
$getEmails = oci_parse($ora, $query);
foreach ($parameters as $parameter) {
oci_bind_by_name($getEmails, $parameter[0], $parameter[1]);
}
}
oci_execute($getEmails);
$row_num = 0;
try {
while (( $row = oci_fetch_array($getEmails, OCI_ASSOC + OCI_RETURN_NULLS)) != false) {
$rows[$row_num] = $row;
$row_num++;
}
$jsonEmails = json_encode($rows, JSON_INVALID_UTF8_IGNORE);
if (json_last_error() != 0) {
echo json_last_error();
}
} catch (Exception $ex) {
echo $ex;
}
echo $jsonEmails;
oci_free_statement($getEmails);
oci_close($ora);
}

Looking at a couple of examples on the DataTables site, I found I was making this more difficult than it needed to be: Here is my solution:
HTML: (unchanged)
<table id="selectedEmails" class="display" style="width: 100%">
<thead>
<tr>
<th colspan='2'>SELECTED ADDRESSES</th>
</tr>
<tr>
<th>Conical Name</th>
<th>Email Address</th>
</tr>
</thead>
</table>
<textarea id='distribution' name='distribution' rows='3'
style='width: 100%'
onblur="validateEmail('INFO_DISTRIBUTION', 'distribution');"
onfocus="getEmailsForTextBox('distribution');">
</textarea>
javascript:
Note: The key was the function for data: which returns json. (My php code expects json as input, and of course, outputs json).
[initialization]
var textbox = 'developer'; //global variable of id of textbox so datatables can use different textboxes to populate table
$(document).ready(function () {
$('#selectedEmails').DataTable({
select: {
sytle: 'multiple',
items: 'row'
},
ajax: {
url: "php/emailForList.php",
contentType: "application/json",
type: "post",
data: function (d) {
return JSON.stringify(document.getElementById(textbox).value.toUpperCase().split(","));
},
dataSrc: ""
},
paging: false,
scrollY: '60vh',
scrollCollapse: true,
columns: [
{data: "CONICAL_NAME"},
{data: "EMAIL_ADDRESS"}
]
});
});
[code that redraws table]
function getEmailsForTextBox(componentID) {
deselectTabs();
document.getElementById('email').style.display = "block";
textbox = componentID; //textbox is global variable that DataTable uses as source control
$('#selectedEmails').DataTable().ajax.reload();
}

how to delete multiple photos from the folder when deleting it from database?

When I check multiple checkboxes for deleting multiple rows it delete the records with image url form database but it does not delete the images from public folder. if anyone can help me with.
for deleting single record the below code worked perfectly it delete the record form database and also delete photo from folder too.
public function destroy($id)
{
//
// $this->authorize('isAdmin');
$Employee = Employee::findOrFail($id);
$currentPhoto = $Employee->photo;
$currentdatePhoto = $Employee->afghanidatephoto;
$EmployeePhoto = (public_path('img/emp/').$currentPhoto);
$EmployeedatePhoto = (public_path('img/date/').$currentdatePhoto);
if(file_exists($EmployeedatePhoto)){
#unlink($EmployeedatePhoto);
}
if(file_exists($EmployeePhoto))
{
#unlink($EmployeePhoto);
}
$Employee->delete();
return ['message'=>'Employee Deleted Successfully'];
}
function in my EmployeeController :
public function multipledelete(Request $request)
{
try
{
Employee::whereIn('id', $request->id)->delete();
return response()->json('data deleted');
}
catch (Exception $e) {
return response()->json($e->getMessage(), 500);
}
}
Code in API:
Route::delete('multipledelete','API\EmployeeController#multipledelete');
Cod in Employee.vue for delete action is :
delt() {
var chekboxs = document.getElementById("chekboxs");
if (chekboxs.checked) {
swal
.fire({
title: "Are you sure you want to delete the selected records?",
text: "You won't be able to revert this!",
type: "warning",
showCancelButton: true,
confirmButtonColor: "#3085d6",
cancelButtonColor: "#d33",
confirmButtonText: "Yes, delete it!"
})
.then(result => {
//Send request to the server
if (result.value) {
axios
.delete("api/multipledelete", {
params: { id: this.checkedRows }
})
.then(() => {
toast.fire({
type: "success",
title: "Your Selected Employees are successfully deleted!"
});
Fire.$emit("refreshPage");
})
.catch(e => {
console.log(e);
});
}
});
} else {
toast.fire({
type: "warning",
title: "You didn't check anything to be deleted please check it!"
});
}
}
Checkbox is :
<div class="custom-control custom-checkbox">
<input
class="form-check-input"
type="checkbox"
:value="employee.id"
v-model="checkedRows"
id="chekboxs"
/>
<label class="form-check-label"></label>
</div>
Button is :
<div class="col-md-2" style="margin-bottom:-29px;">
<button class="btn btn-danger" #click="delt">
<i class="fas fa-user-minus"></i>
Delete Multiple
<!-- <grid-loader v-show="seen" :loading="loading" :color="color" :size="size"></grid-loader> -->
</button>
</div>
I have tried this code but id does not worked.
public function multipledelete(Request $request)
{
try
{
$Employee = Employee::whereIn('id', $request->id)->delete();
$currentPhoto = $Employee->photo;
$currentdatePhoto = $Employee->afghanidatephoto;
$EmployeePhoto = (public_path('img/emp/').$currentPhoto);
$EmployeedatePhoto = (public_path('img/date/').$currentdatePhoto);
if(file_exists($EmployeedatePhoto)){
#unlink($EmployeedatePhoto);
}
if(file_exists($EmployeePhoto))
{
#unlink($EmployeePhoto);
}
$Employee->delete();
return response()->json('data deleted');
}
catch (Exception $e) {
return response()->json($e->getMessage(), 500);
}
}

The easiest approach with your current code in mind is to simply loop over the employees and delete as required:
$employees = Employee::whereIn('id', $request->id)->get();
foreach($employees AS $employee){
$currentPhoto = $employee->photo;
$currentdatePhoto = $employee->afghanidatephoto;
$employeePhoto = (public_path('img/emp/').$currentPhoto);
$employeedatePhoto = (public_path('img/date/').$currentdatePhoto);
if(file_exists($employeedatePhoto)){
#unlink($employeedatePhoto);
}
if(file_exists($employeePhoto)){
#unlink($employeePhoto);
}
$employee->delete();
}
You can wrap the foreach() in a try { ... } catch { ... } block.
The reason your code had issues starts with this line:
$Employee = Employee::whereIn('id', $request->id)->delete();
By finalizing that query with ->delete(), you're deleting the records that match ids. Next, trying to perform operations on $Employee won't work, as ->delete() doesn't return an object (I believe it returns a boolean, true), so $Employee->{ ... } is an error.
With all of that in mind, you should be able to query, loop and delete your Employees and their images.

Select2 multi-value select boxes can't load data in CI

I create a search box with select2 multi-value select boxes. the data on select2 must list of Title Name that are based on the Project I selected before. But Select2 cannot load the data. Also, there is an error
"Uncaught Error: Option 'ajax' is not allowed for Select2 when attached to a element" how to solve it?
This is Controller Page
function get_title_by_keyword()
{
$keyword = $_POST['keyword'];
$cos_id = implode(',', $_POST['cos_id']);
if (isset($keyword)&&isset($cos_id))
{
die(json_encode($this->menu_model->get_title_by_keyword($keyword,$cos_id)));
}
}
This is Model Page
function get_title_by_keyword($keyword,$cos_id){
$query="SELECT t.id as id , t.name text
FROM db_mstr.m_title t
JOIN db_mstr.m_os os ON t.os_id = os.id
JOIN db_mstr.m_os osC ON os.cos_id = osC.id
JOIN db_mstr.m_bp_title bpt ON t.id = bpt.title_id AND bpt.is_deleted=0
JOIN db_mstr.m_bp bp ON bpt.bp_id = bp.id
where t.id like '%$keyword%' and osC.id in ($cos_id)
GROUP BY t.name";
return $this->db->query($query)->result();
}
This is View Page and JS
<label class="control-label col-sm-1">Project</label>
<div class="col-sm-4">
<select required multiple="multiple" id="title_cos" name="title_cos" class="" style="width:100%" data-placeholder="">
<?php
foreach ($comboCompany as $key)
{
?><option value="'<?=$key->value?>'" > <?=$key->text?> <?php
}
?>
</select>
</div>
<label class="control-label col-sm-1" style="padding-left: 4px;padding-right: 3px;">Title Name</label>
<div class="col-sm-4">
<select required multiple="multiple" class="" id=title_list name="title_list" style="width:100%">
<?php
foreach ($comboTitle as $key)
{
?><option value="<?=$key->id?>" > <?=$key->text?> <?php
}
?>
</select>
</div>
<script>
$(document).ready(function(){
$("#title_list").select2({
ajax: {
url: '<?=base_url();?>index.php/menu/get_title_by_keyword',
dataType: 'json',
type: "POST",
quietMillis: 1000,
data: function (term) {
return {
keyword: term,
cos_id: $('#title_cos').val()
};
},
results: function (data) {
return {
results: data
};
}
},
placeholder: 'Search for Title',
escapeMarkup: function (markup) { return markup; }, // let our custom formatter work
minimumInputLength: 3,
});
});
</script>

Ajax with select box in codeigniter

i have a form with two select box. one is for the city and the other one for the area.
My requirement. When some one selects a city,The areas in the city must be captured from database and displayed in another select box.
i tried but, i have problem with my ajax. here is my code below.
view
<div class="location-group">
<label class="-label" for="city">
Location
</label>
<div class="">
<select id="city_select">
<option value="0"> select</option>
<?php foreach ($city as $cty) : ?>
<option value="<?php echo $cty->city_id; ?>"><?php echo $cty->name; ?></option>
<?php endforeach ?>
</select>
</div>
</div>
<div class="location control-group" id="area_section">
<label class="control-label" for="area">
Area
</label>
<div class="controls">
<select id="area_select">
<option value=""> Any</option>
<?php foreach ($area as $ara) : ?>
<option value="<?php echo $ara->ara_id; ?>"><?php echo $ara->name; ?></option>
<?php endforeach ?>
</select>
</div><!-- /.controls -->
</div><!-- /.control-group -->
controller
function __construct() {
parent::__construct();
//session, url, satabase is set in auto load in the config
$this->load->model('Home_model', 'home');
$this->load->library('pagination');
}
function index(){
$data['city'] = $this->home->get_city_list();
$data['type'] = $this->home->get_property_type_list();
$this->load->view('home', $data);
}
function get_area(){
$area_id = $this->uri->segment(3);
$areas = $this->home->get_area_list($area_id);
echo json_encode($areas);
}
Model
function get_area_list($id){
$array = array('city_id' => $id, 'status' => 1);
$this->db->select('area_id, city_id, name');
$this->db->where($array);
$this->db->order_by("name", "asc");
$this->db->from('area');
$query = $this->db->get();
$result = $query->result();
return $result;
}
Ajax
<script type="text/javascript">
$('#area_section').hide();
$('#city_select').on('change', function() {
// alert( this.value ); // or $(this).val()
if (this.value == 0) {
$('#area_section').hide(600);
}else{
//$("#area_select").html(data);
$.ajax({
type:"POST",
dataType: 'json',
url:"<?php echo base_url('index.php?/home/get_area/') ?>",
data: {area:data},
success: function(data) {
$('select#area_select').html('');
$.each(data, function(item) {
$("<option />").val(item.area_id)
.text(item.name)
.appendTo($('select#area_select'));
});
}
});
$('#area_section').show(600);
};
});
</script>
once i select a city, it must get all the areas in the city from database and display it in the area_select select box.
can any one please help me. Thanks.

Try to change this way.
Your ajax code
//keep rest of the code
$.ajax({
type:"POST",
dataType: 'json',
url:"<?php echo base_url('index.php?/home/get_area/') ?>",
data: {area:$(this).val()},//send the selected area value
Also show the area_section inside ajax success function
Your controller function
function get_area()
{
$area_id = $this->input->post('area');
$areas = $this->home->get_area_list($area_id);
echo json_encode($areas);
}
Hope it will solve your problem
Update
Try using your ajax update function like this
success: function(data) {
$('select#area_select').html('');
for(var i=0;i<data.length;i++)
{
$("<option />").val(data[i].area_id)
.text(data[i].name)
.appendTo($('select#area_select'));
}
}

Simple way to do that follow the instruction on this page
https://itsolutionstuff.com/post/codeigniter-dynamic-dependent-dropdown-using-jquery-ajax-exampleexample.html
demo_state table:
CREATE TABLE `demo_state` (
`id` int(11) NOT NULL,
`name` varchar(155) NOT NULL,
`created_at` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
`updated_at` timestamp NOT NULL DEFAULT '0000-00-00 00:00:00'
) ENGINE=InnoDB DEFAULT CHARSET=latin1;
demo_cities table:
CREATE TABLE `demo_cities` (
`id` int(11) NOT NULL,
`state_id` int(12) NOT NULL,
`name` varchar(155) NOT NULL,
`created_at` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
`updated_at` timestamp NOT NULL DEFAULT '0000-00-00 00:00:00'
) ENGINE=InnoDB DEFAULT CHARSET=latin1;
After create database and table successfully, we have to configuration of database in our Codeigniter 3 application, so open database.php file and add your database name, username and password.
application/config/database.php
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
$active_group = 'default';
$query_builder = TRUE;
$db['default'] = array(
'dsn' => '',
'hostname' => 'localhost',
'username' => 'root',
'password' => 'root',
'database' => 'test',
'dbdriver' => 'mysqli',
'dbprefix' => '',
'pconnect' => FALSE,
'db_debug' => (ENVIRONMENT !== 'production'),
'cache_on' => FALSE,
'cachedir' => '',
'char_set' => 'utf8',
'dbcollat' => 'utf8_general_ci',
'swap_pre' => '',
'encrypt' => FALSE,
'compress' => FALSE,
'stricton' => FALSE,
'failover' => array(),
'save_queries' => TRUE
);
Read Also: How to make simple dependent dropdown using jquery ajax in Laravel 5?
Step 3: Add Route
In this step you have to add two new routes in our route file. We will manage layout and another route for ajax, so let's put route as bellow code:
application/config/routes.php
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
$route['default_controller'] = 'welcome';
$route['404_override'] = '';
$route['translate_uri_dashes'] = FALSE;
$route['myform'] = 'HomeController';
$route['myform/ajax/(:any)'] = 'HomeController/myformAjax/$1';
Step 4: Create Controller
Ok, now first we have to create one new controller HomeController with index method. so create HomeController.php file in this path application/controllers/HomeController.php and put bellow code in this file:
application/controllers/HomeController.php
<?php
class HomeController extends CI_Controller {
/**
* Manage __construct
*
* #return Response
*/
public function __construct() {
parent::__construct();
$this->load->database();
}
/**
* Manage index
*
* #return Response
*/
public function index() {
$states = $this->db->get("demo_state")->result();
$this->load->view('myform', array('states' => $states ));
}
/**
* Manage uploadImage
*
* #return Response
*/
public function myformAjax($id) {
$result = $this->db->where("state_id",$id)->get("demo_cities")->result();
echo json_encode($result);
}
}
?>
Step 5: Create View Files
In this step, we will create myform.php view and here we will create form with two dropdown select box. We also write ajax code here:
application/views/myform.php
<!DOCTYPE html>
<html>
<head>
<title>Codeigniter Dependent Dropdown Example with demo</title>
<script src="http://demo.itsolutionstuff.com/plugin/jquery.js"></script>
<link rel="stylesheet" href="http://demo.itsolutionstuff.com/plugin/bootstrap-3.min.css">
</head>
<body>
<div class="container">
<div class="panel panel-default">
<div class="panel-heading">Select State and get bellow Related City</div>
<div class="panel-body">
<div class="form-group">
<label for="title">Select State:</label>
<select name="state" class="form-control" style="width:350px">
<option value="">--- Select State ---</option>
<?php
foreach ($states as $key => $value) {
echo "<option value='".$value->id."'>".$value->name."</option>";
}
?>
</select>
</div>
<div class="form-group">
<label for="title">Select City:</label>
<select name="city" class="form-control" style="width:350px">
</select>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(document).ready(function() {
$('select[name="state"]').on('change', function() {
var stateID = $(this).val();
if(stateID) {
$.ajax({
url:"<?php echo base_url('index.php/Diplome/myformAjax/') ?>"+ stateID,
//url: '/myform/ajax/'+stateID,
type: "GET",
dataType: "json",
success:function(data) {
$('select[name="city"]').empty();
$.each(data, function(key, value) {
$('select[name="city"]').append('<option value="'+ value.id +'">'+ value.name +'</option>');
});
}
});
}else{
$('select[name="city"]').empty();
}
});
});
</script>
</body>
</html>

Symfony2 and jquery checkbox

I want to use checkbox with symfony2. I want to update a field value in a table (0/1) dynamically using the checkbox value.
Here is my wrong code :
index.html.twig :
<div class="slider demo" id="slider-1">
{% if plate.share == true %}
<input type="checkbox" value="1" checked>
{% else %}
<input type="checkbox" value="1">
{% endif %}
</div>
<script type="text/javascript">
$("input[type='checkbox']").on('click', function(){
var checked = $(this).attr('checked');
if (checked) {
var value = $(this).val();
$.post("{{ path('plate_share', { 'id': plate.id }) }}", { value:value }, function(data){
if (data == 1) {
alert('the sharing state was changed!');
};
});
};
});
</script>
routing.yml
plate_share:
pattern: /{id}/share
defaults: { _controller: "WTLPlateBundle:Plate:share" }
PlateController.php:
public function shareAction($id)
{
if($_POST && isset($_POST['value'])) {
$link = mysql_connect('127.0.0.1', 'admin', 'wtlunchdbpass');
if (!$link) {
print(0);
}
mysql_select_db('wtlunch');
$value = mysql_real_escape_string($POST['value']);
$sql = "INSERT INTO table (value) VALUES ('$value')";
if (mysql_query($sql, $link)) {
print(1);
}
else {
print(0);
}
}
}
But this solution is wrong and not working.
Is it possible to create a form and submit it with only a checkbox?
Is there an idea? Thanks.
This for example the edit form action in the controller :
public function editAction($id)
{
$user = $this->container->get('security.context')->getToken()->getUser();
if (!is_object($user) || !$user instanceof UserInterface) {
throw new AccessDeniedException('This user does not have access to this section.');
}
$em = $this->getDoctrine()->getManager();
$entity = $em->getRepository('WTLPlateBundle:Plate')->find($id);
if (!$entity) {
throw $this->createNotFoundException('Unable to find Plate entity.');
}
$editForm = $this->createEditForm($entity);
$deleteForm = $this->createDeleteForm($id);
return $this->render('WTLPlateBundle:Plate:edit.html.twig', array(
'entity' => $entity,
'edit_form' => $editForm->createView(),
'delete_form' => $deleteForm->createView(),
));
}