We Keep Coding

Trying to download uploaded image from datatable column cell using jquery anchor tag

I am new to javascript and jquery and want to download image from datatable column where i have saved my image in public/images folder of laravel framework but when i click on download link some random files downloads which failed to download.
here is my code and screenshot of what i am actually trying to do
columns: [
// render:function(data,type,full,meta){
// return '<a href="'+data.filepath+'/'+data.fileName + '" download>Download</a>'
// },
// "targets": 0
// { data: 'rownum', orderable: false, searchable: false },
{ data: 'doc_type', name: 'doc_type' },
{ data: 'doc_number', name: 'doc_number' },
{ data: 'doc_date', name: 'doc_date'},
{ data: 'amount', name: 'amount' },
{ data: 'currency', name: 'currency' },
{ data: 'partener', name: '{{ TBL_PARTENER }}.id'},
{ data: 'image', name: 'image',render:function(data,type,full,meta){
// return 'Download'
return 'Download'
} },
//'image' => ['name' => 'image', 'data' => 'image'],
{ data: 'comments', name: 'comments' },
{ data: 'action', orderable: false, searchable: false}
],
Please view this screenshot of output
Much appreaciated your help

I cann't comment so i write here!
What happens if you remove "data:"?

how to check status in if condition

I want to check the status which is come from a model in the form 0 and 1 but I have to show 0 as a enable and 1 as a disable but don't know how to use if below code
#push('scripts')
<script type="text/javascript">
$(document).ready(function() {
$('#role-table').DataTable({
serverSide: true,
processing: true,
responsive: true,
ajax: '{{ route("admin.role.getRoleList") }}',
columns: [
{ data: 'id', name: 'id',className:'text-center' },
{ data: 'name', name: 'name' },
{ data: 'status', name: 'status' },
{ data: 'action', name: 'action', classrole: 'text-center', orderable: false }
],
stateSave: true
});
});
</script>
#endpush

For formatting your status column, use this:
{
data: 'status',
name: 'status',
render: function ( data, type, row ) {
return data?$'<span> disable </span>':'<span> enable </span>';
}
}
Note that you have the power to use HTML tags for formatting your data columns.
For more information visit DataTable Renders

Write your yajra datatables query like this:
return datatables()->of($model)
->editColumn('status', function ($query) {
if($query->status == 0)
{
return 'enable';
}
else
{
return 'disable';
}
})
->escapeColumns([])
->make(true);

JSON post request to slack returns invalid_auth

I'm trying to open a dialog in slack through a google app script after the user presses a button but i'm getting the following error message:
{"ok":false,"error":"invalid_auth","warning":"missing_charset","response_metadata":{"warnings":["missing_charset"]}}
This is my code:
function openDialog (range, triggerId, token) {
var url = 'https://slack.com/api/dialog.open';
var dialog = {
trigger_id: triggerId,
title: 'Submit a helpdesk ticket',
callback_id: 'submit-ticket',
submit_label: 'Submit',
elements: [
{
label: 'Title',
type: 'text',
name: 'title',
value: 'teste',
hint: '30 second summary of the problem',
},
{
label: 'Description',
type: 'textarea',
name: 'description',
optional: true,
},
{
label: 'Urgency',
type: 'select',
name: 'urgency',
options: [
{ label: 'Low', value: 'Low' },
{ label: 'Medium', value: 'Medium' },
{ label: 'High', value: 'High' },
],
},
],
};
var options = {
'method' : 'post',
'contentType': 'application/json',
'headers': {
'Authorization': 'Bearer ' + token,
},
'payload' : JSON.stringify(dialog),
};
var urlFetch = UrlFetchApp.fetch(url, options);
var message = ContentService.createTextOutput(urlFetch).setMimeType(ContentService.MimeType.JSON);
return message;
}
Can anyone spot what I'm missing?
Thanks
Here's the doPost() function triggering the openDialog() function it reads a payload from a button in slack with callback_id = "gasolina" and value = "update" :
if (payload.callback_id == "gasolina") {
var selectedOption = actions.value;
var operation = payload.callback_id;
var triggerId = payload.trigger_id;
var token = payload.token;
var inputRow = actions.name;
if (selectedOption == 'update') {
var keyword = 'no+money';
var gastoExtra = '';
var operation = payload.callback_id;
var gastoExtraRange = actions.name;
return openDialog (gasRange, triggerId, token);

I think that although your script is almost correct, a little modification is required. How about this modification for your script? From your question, I'm not sure about your current settings for using dialog.open of Slack. So this modified script supposes that the settings is correct.
Modification points :
Reason of missing_charset is due to using JSON.stringify() to the payload.
From the document of dialog.open, the payload is token, dialog and trigger_id.
token doesn't use for the header.
application/json doesn't use for contentType.
When these points are reflected to your script, the modified script is as follows.
Modified script :
function openDialog (range, triggerId, token) {
var url = 'https://slack.com/api/dialog.open';
var dialog = {
title: 'Submit a helpdesk ticket',
callback_id: 'submit-ticket',
submit_label: 'Submit',
elements: [
{
label: 'Title',
type: 'text',
name: 'title',
value: 'teste',
hint: '30 second summary of the problem',
},
{
label: 'Description',
type: 'textarea',
name: 'description',
optional: true,
},
{
label: 'Urgency',
type: 'select',
name: 'urgency',
options: [
{ label: 'Low', value: 'Low' },
{ label: 'Medium', value: 'Medium' },
{ label: 'High', value: 'High' },
],
},
],
};
var options = {
method: 'post',
payload: {
token: token,
dialog: JSON.stringify(dialog),
"trigger_id": triggerId,
},
};
var urlFetch = UrlFetchApp.fetch(url, options);
var message = ContentService.createTextOutput(urlFetch).setMimeType(ContentService.MimeType.JSON);
return message;
}
Note :
In my environment, I'm using dialog.open with the request like above script. But if this didn't work, please check the error messages and modify your settings.

if you request by application/json.
You use to header.authorization.
https://github.com/slackapi/python-slack-sdk/issues/302#issuecomment-825321015
API
https://api.slack.com/methods/chat.postMessage
https://slack.com/api/chat.postMessage
Authorization in Headers
Content-Type: application/json
Authorization: 'Bearer ' + token
{
"text": "hello",
"as_user": true,
"channel": "U##########"
}

Piechart not displaying store data

I have a pie chart in sencha-touch that is not retrieving data from my store, it is gender data coming from a mysql database, the data is being retrieved using an ajax request here is the request and the store
Ext.define('Qvidi.controller.MyController', {
extend: 'Ext.app.Controller',
config: {
},
getGender: function() {
Ext.Ajax.request({
method: 'POST',
params: {
class: 'Qvidi',
method: 'getDataM'
},
url: 'server/index.php',
success: function( response ){
var r = Ext.decode( response.responseText );
Ext.getStore('GenderStore').setData( r.results );
}
});
}
});
and here is the store
Ext.define('Qvidi.store.GenderStore', {
extend: 'Ext.data.Store',
requires: [
'Qvidi.model.GenderModel',
'Ext.data.proxy.Ajax'
],
config: {
model: 'Qvidi.model.GenderModel',
storeId: 'GenderStore',
proxy: {
type: 'ajax',
extraParams: {
class: 'Qvidi',
method: 'getDataM'
},
url: 'server/index.php'
}
}
});
and lastly here is my model
Ext.define('Qvidi.model.GenderModel', {
extend: 'Ext.data.Model',
requires: [
'Ext.data.Field'
],
config: {
fields: [
{
name: 'types'
},
{
name: 'counter'
}
]
}
});
here is a log data from inspect in google chrome
Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.
sencha-touch.js:13032 The key "minimum-ui" is not recognized and ignored.
app.js:39 loaded
Console.js?_dc=1456999436953:35 [DEPRECATE][Anonymous] loadData is deprecated, please use either add or setData
The last log was after I changed setData to loadData
and here is the retrieved sql in my method decoded to json
{
success: true,
total: 2,
results: [
{
types: "Male",
counter: 2182
},
{
types: "Females",
counter: 1134
}
]
}
here is my chart code
{
xtype: 'polar',
height: 377,
id: 'genderPieChart',
colors: [
'#115fa6',
'#94ae0a',
'#a61120',
'#ff8809',
'#ffd13e',
'#a61187',
'#24ad9a',
'#7c7474',
'#a66111'
],
store: 'GenderStore',
series: [
{
type: 'pie',
colors: [
'#115fa6',
'#94ae0a',
'#a61120',
'#ff8809',
'#ffd13e',
'#a61187',
'#24ad9a',
'#7c7474',
'#a66111'
],
labelField: 'types',
xField: 'counter',
yField: 'types'
}
],
interactions: [
{
type: 'rotate'
}
]
}
here is my php code
class Qvidi extends Connect {
function __construct(){
parent::__construct();
}
public function getDataM( $vars ){
$sql = "Select 'Male' as 'types', count(gender) AS 'counter' from quividi.vidireports where gender='1'
union
Select 'Females' as 'types', count(gender) AS 'counter' from quividi.vidireports where gender='2'";
$data = array();
$total = 0;
if( $result = $vars->db->query( $sql ) ) {
while( $row = $result->fetch_assoc() ){
$data[] = array( "types"=>$row["types"], "counter" => intval ($row["counter"] ) );
$total++;
}
$result->free();
}
echo json_encode( array( "success" => true, "total" => $total, "results" => $data ) );
}

ok so:
my php code
<?php
$callback=false;
if(isset($_REQUEST['callback']))
$callback = $_REQUEST['callback'];
$dati=array(
(object) array( 'types'=> 'Male', 'counter'=> 2182),
(object) array( 'types'=> 'Female', 'counter'=> 1134)
);
$resultObj= new stdClass();
$resultObj->results=$dati;
$resultObj->success=true;
if ($callback) {
header('Content-Type: text/javascript');
echo $callback . '(' . json_encode($resultObj) . ');';
}else {
echo json_encode($resultObj);
}
?>
my json response:
{"results":[{"types":"Male","counter":2182},{"types":"Female","counter":1134}],"success":true}
my model:
Ext.define('MyApp.model.GenderModel', {
extend: 'Ext.data.Model',
requires: [
'Ext.data.field.Field'
],
fields: [
{
name: 'types'
},
{
name: 'counter'
}
]
});
my store:
you will need these requires for the store:
requires: [
'Ext.data.Store',
'Ext.data.proxy.JsonP',
'Ext.data.reader.Json'
]
myStore: {
autoLoad: true,
model: 'MyApp.model.GenderModel',
proxy: {
type: 'jsonp',
url: 'myphpurl',
reader: {
type: 'json',
rootProperty: 'results'
}
}
}
my chart:
{
xtype: 'polar',
colors: [
'#115fa6',
'#94ae0a',
'#a61120',
'#ff8809',
'#ffd13e',
'#a61187',
'#24ad9a',
'#7c7474',
'#a66111'
],
bind: {
store: '{myStore}'
},
series: [
{
type: 'pie',
angleField: 'counter',
label: {
field: 'types',
display: 'rotate',
contrast: true,
font: '12px Arial'
},
xField: 'counter',
yField: 'types'
}
],
interactions: [
{
type: 'rotate'
}
]
}
my final view:

Insert dynamic listbox options in Tinymce popup editor

I am trying to create dynamic listbox values but getting this error in console:
Uncaught TypeError: Cannot assign to read only property 'active' of [
Here's my code( pasting only the code for listbox ):
body: [
{
type: 'listbox',
name: 'type',
label: 'Panel Type',
value: type,
'values': get_author_list(),
tooltip: 'Select the type of panel you want'
},
]
.....
And I am calling this function to get dynamic list...
function get_author_list() {
var d = "[{text: 'Default', value: 'default'}]";
return d;
}
I am guessing that the values in listbox only takes static var and not dynamic. But I need to insert dynamic values in this list. Please can anyone help me find a workaround. Is there any possibility to insert via ajax?
Thanks, in advance!!

I needed something similar for .NET site. Even though is not great code I hope it can help someone.
tinymce.PluginManager.add('DocumentSelector', function (editor, url) {
// Add a button that opens a window
editor.addButton('DocumentSelector', {
text: 'Document',
icon: false,
title: "Document Selector",
onclick: function () {
var _documentList;
//load all documents
var _data = JSON.stringify({/* Some data */});
$.ajax({
type: "POST",
url: "/api/TinyMCE/GetDocuments",
data: _data,
contentType: "application/json; charset=utf-8",
dataType: "json",
processData: true,
success: function (data) {
_documentList = eval('(' + data + ')');
// Open window
editor.windowManager.open({
title: 'Document Selector',
body: [
{
type: 'listbox',
name: 'DocURL',
label: 'Documents',
values: _documentList
},
{
type: 'textbox'
, name: 'TextToDisplay'
, value: _text
, label: 'Text To Display'
},
{
type: 'textbox'
, name: 'TitleToDisplay'
, value: _title
, label: 'Title'
},
{
type: 'listbox',
name: 'TheTarget',
label: 'Target',
values: [{ text: 'None', value: "_self" }, { text: 'New Window', value: "_blank" }],
value: _target
}
],
onsubmit: function (e) {
// Insert content when the window form is submitted
}
});
},
error: function (xhr, status, error) {
alert("Error! " + xhr.status + "\n" + error);
}
});
}
});
});
And here it is some of the Behind code
public class TinyMCEController : ApiController
{
public class DocumentsInfo
{
// Some data
}
public class DocumentList
{
public string text { get; set; }
public string value { get; set; }
}
[HttpPost]
[ActionName("GetDocuments")]
public object GetDocuments(DocumentsInfo docInfo)
{
//Test data
List<DocumentList> _DocumentList = new List<DocumentList>();
_DocumentList.Add(new DocumentList {
text = "Document1.pdf",
value = "value1"
});
_DocumentList.Add(new DocumentList
{
text = "Document2.pdf",
value = "value2"
});
var jsonSerialiser = new JavaScriptSerializer();
var json = jsonSerialiser.Serialize(_DocumentList);
return json;
}
}