Javascript Sum Distinct Rows into a input jqueryDatatables - javascript

I have a tables filled with data using Jquery Datatables, what i want is to be able to sum all data from the distinc values of a column but when a dropdownlist value is changed and save the sum value into a new Html Input with Javascript Example:
I got my table filled with data like this:
|Platillo | PDV | Precio | Can | Date |
------------------------------------------------------------------
| Poz | REST | 40 | 2 | 01/02/2016|
------------------------------------------------------------------
| Tor | REST | 50 | 2 | 02/02/2016|
------------------------------------------------------------------
| Zes | REST | 100 | 2 | 01/02/2016|
------------------------------------------------------------------
| Poz | FUEM | 60 | 2 | 01/02/2016|
------------------------------------------------------------------
| Tor | FUEM | 70 | 2 | 01/02/2016|
------------------------------------------------------------------
| Zes | FUEM | 120 | 2 | 01/02/2016|
------------------------------------------------------------------
| Poz | VTSI | 45 | 2 | 02/02/2016|
------------------------------------------------------------------
| Tor | VTSI | 57 | 2 | 01/02/2016|
------------------------------------------------------------------
| Zes | VTSI | 10 | 2 | 02/02/2016|
------------------------------------------------------------------
i want is to be able to sum all the values from the column 'Precio' into a 'Html Input Field' but i want to sum the totals of each distinct value from column 'PDV', and triggered by the value of a dropdown list,
Ex: if user select's Date '01/02/2016' i shoul fil my html Inputs with the sum of the data of all distinct value of column 'PDV' but only when they match the Date selected by the user '01/02/2016' looking for this output:
<option value="">Todos</option>
<option value="01/02/2016">#item</option> // USER SELECTS THIS VALUE
<option value="02/02/2016">#item</option>
My input field are like follow:
<input value="//TOTAL SUM FROM REST WHERE DATE IS EQUAL AS UsER SELECT '01/02/2016'" />
<input value="//TOTAL SUM FROM REST WHERE DATE IS EQUAL AS UsER SELECT '01/02/2016'" />
<input value="//TOTAL SUM FROM REST WHERE DATE IS EQUAL AS UsER SELECT '01/02/2016'" />
Im new to javascript and right now i have only be able to filter my Datatable based on the selected date but i need to sum all distincs values of my 'PDV' column each time user selects a date value how can i do it?
UPDATED:
i have the code of my dropdown filter y just need to know how to sum columns based on unique column items on my search javascript
This is my search code:
$('#sel0').on('change', function () {
dataTable.columns('.fechas').search(this.value).draw();
var datafecha = $(this).val();
});

You need to write a custom filter. Or take a look at this below to get an idea :
var val = $.fn.dataTable.util.escapeRegex($('dropdown').val());
column.search( val ? '^'+val+'$' : '', true, false ).draw();
var sum = column.data().unique().sum();
alert(sum);

Related

how to use a where clause to see if an id exists in a postgres array type column

What I'm trying to do is, join an "events" table on two other tables: "users" and "locations".
Every "event" happens at a specific time and on a specific "location" which needs joining in order for the user to know where the event will take place. And is also created by a specific "user". this user happens to have an array of user ids called close_friends. The three tables are the following:
Events table
===================================================
Column | Type |
-----------------------+--------------------------+
id | integer |
location_id | integer |
guests | integer |
hide_from | integer[] |
only_close_friends | boolean |
is_public | boolean |
min_viable_population | integer |
max_viable_population | integer |
created_by | integer |
sport_type | text |
whats_needed | text[] |
happens_at | timestamp with time zone |
created_at | timestamp with time zone |
updated_at | timestamp with time zone |
updated_by | integer |
___________________________________________________
Users table
===========================================
Column | Type |
---------------+--------------------------+
id | integer |
username | text |
password_hash | text |
first_name | text |
last_name | text |
gender | text |
photo | text |
city | text |
bio | text |
height | integer |
sports | text[] |
photos | text[] |
friends | integer[] |
close_friends | integer[] |
scopes | text[] |
verified | boolean |
created_at | timestamp with time zone |
updated_at | timestamp with time zone |
updated_by | integer |
___________________________________________
Locations table
==========================================
Column | Type |
---------------+--------------------------+
id | integer |
name | text |
maps_url | text |
city | text |
region | text |
cost | text |
photo | text |
meta | text |
sport_types | text[] |
girls_allowed | boolean |
verified | boolean |
created_at | timestamp with time zone |
created_by | integer |
updated_at | timestamp with time zone |
updated_by | integer |
Now The user should be able to create an event which is visible only to his/her close friends.
what I wanna do is fetch only the events that are to be seen by creator's close friends. To give you an overall idea of what I'm trying to achieve, I'd provide you with the code block that looks good but returns an "Operator doesn't exist" error.
const query = db('events')
.join('users', 'users.id', '=', 'events.created_by')
.join('locations', 'locations.id', '=', 'events.location_id')
.select(
'events.id',
'events.location_id',
'locations.name',
'events.guests',
'locations.city',
'events.min_viable_population',
'events.max_viable_population',
'events.created_by',
'events.sport_type',
'events.whats_needed',
'events.happens_at',
'events.created_at',
'users.username',
'users.first_name',
'users.last_name',
'users.photo',
'users.verified'
)
.where({'only_close_friends': true})
.whereIn('close_friends', function () { /////////////////////////
this.select('id') /////////////////////////
.from('users') // The problem is here //
.where({ id: user_id }) /////////////////////////
}) /////////////////////////
Note
"user_id" is the id of the correctly logged in user.
I was able to find a simple solution with the help of a friend:
.whereRaw('? = ANY(users.close_friends)',[user_id])

Automatically increment value by search /compare and match two columns in Google Sheets Script

I currently have to manually enter Sheet1 column B, but I'd like to auto increment it every time the script runs.
I am using a Google Sheets script.
This part is working.
How it works:
Sheet2 column A is a drop down list imported from Sheet1 column A
if Sheet2 column B is anniversary of todays date Sheet 2 column F is automated to be 'reset'
the working script then deletes the rows in Sheet 2 where F is 'reset' and adds new rows for each to the bottom
Currently using this script
function writeupReset() {
var ss = SpreadsheetApp.getActiveSpreadsheet();
var s = ss.getSheetByName('Sheet2');
var r = s.getRange('C:C');
var v = r.getValues();
for(var i=v.length-1;i>=0;i--){
if(v[0,i]=='reset'){
s.insertRowsAfter(251,1);
s.deleteRow(i+1);
}
}
}
Example of the working bits using todays date - 6/2/20
Sheet1 Sheet2 (before script) Sheet2 (after script)
A B A B C A B C
|---------------| |-------------------------| |-------------------------|
1 | name | resets | 1 | name | date | delet | 1 | name | date | delet |
|---------------| |-------------------------| |-------------------------|
2 | bill | 1 | 2 | bill | 6/2/19 | reset | 2 | alex | 9/5/19 | |
|---------------| |-------------------------| |-------------------------|
3 | mark | 5 | 3 | alex | 9/5/19 | | 3 | adam | 11/6/19 | |
|---------------| |-------------------------| |-------------------------|
4 | holy | 2 | 4 | adam | 11/6/19 | | 4 | tony | 12/1/19 | |
|---------------| |-------------------------| |-------------------------|
5 | tony | 0 | 5 | mark | 6/2/19 | reset | 5 | | | |
|---------------| |-------------------------| |-------------------------|
6 | alex | 2 | 6 | tony | 12/1/19 | | 6 | | | |
|---------------| |-------------------------| |-------------------------|
7 | june | 1 | 7 | | | | 7 | | | |
|---------------| |-------------------------| |-------------------------|
8 | jack | 0 | to 252 rows (last two hidden) to 252 rows (last two hidden)
|---------------|
9 | adam | 2 |
|---------------|
So how can I edit the script to automatically increment Sheet1 column B when the script deletes those 'reset' rows in Sheet1?
I believe your goal as follows.
You want to increase the values of the column "B", that the name is the same , in "Sheet1" when the rows with reset in "Sheet2" are deleted by the script.
In your case, the same names are included in the column "A" in "Sheet2".
You want to achieve this by modifying your script in your question.
For this, how about this answer?
Modification points:
In this case, it is required to know the values of "Sheet1" and compare them with the values of "Sheet2". The flow is as follows.
Delete rows in "Sheet2".
At that time, an object including the information of the deleted rows is created.
Increase values of the column "B" in "Sheet1".
The values of the column "B" are updated using the object, and the updated values are put to the sheet.
When above points are reflected to your script, it becomes as follows.
Modified script:
function writeupReset() {
var ss = SpreadsheetApp.getActiveSpreadsheet();
// 1. Delete rows in Sheet2.
var s = ss.getSheetByName('Sheet2');
var r = s.getRange('A1:C' + s.getLastRow()); // Modified
var v = r.getValues();
var obj = {}; // Added
for(var i=v.length-1;i>=0;i--){
if(v[i][2] == 'reset') { // Modified
s.insertRowsAfter(251,1);
s.deleteRow(i+1);
var name = v[i][0] // Added
obj[name] = obj[name] ? obj[name] + 1 : 1; // Added
}
}
// I added below script.
// 2. Increase values of the column "B" in Sheet1.
var sheet = ss.getSheetByName("Sheet1");
var range = sheet.getRange("A2:B" + sheet.getLastRow());
var values = range.getValues().map(([a, b]) => ([obj[a] ? b += obj[a] : b]));
range.offset(0, 1, values.length, 1).setValues(values);
}
Note:
In this modified script, it supposes that each value of the column "A" in "Sheet1" is the unique value in all values. From your question, I could understand like this.
If the sheet names of "Sheet1" and "Sheet2" are different from your actual situation, please modify them.
If your actual situation is different from the structure of your sample values in your question, this modified script might not work. So please be careful this.
References:
map()
setValues(values)

Disable sorting for a few cells in datatables jQuery

Simply I'm trying to make it ignore sorting if the cell has ?
this is my table:
ID | name | supply
1 | John | 12
2 | Kayle | ?
3 | Tim | 24
when you sort supply by asc
ID | name | supply
1 | John | 12
3 | Tim | 24
2 | Kayle | ?
when you sort supply by desc
ID | name | supply
3 | Tim | 24
1 | John | 12
2 | Kayle | ?
IS there a way to do it?
You need to use Absolute position sorting plug-in.
For example:
var nameType = $.fn.dataTable.absoluteOrder({
value: '?', position: 'bottom'
});
var table = $('#example').DataTable({
columnDefs: [
{ targets: 0, type: nameType }
]
});
You need to include absolute.js file in addition to DataTables CSS/JS files.
See this example for code and demonstration.

Add autocalculate summation row and column in asp.net Listview

I'm trying to create ListView which contains ASPxTextBox that the user can enter only numeric value. There are many rows and columns of data. I want to add new row and column that calculate total value from each row and column
For example, if I have data like this:
Student Name | Subject1 | Subject2 | Subject3
----------------------------------------------------------
John ----------- | ------- 23 | --------45 | --------37
Smith ---------- | ------- 41 | --------22 | --------11
Linda ---------- | ------- 35 | --------38 | --------23
I want to be like this
Student Name | Subject1 | Subject2 | Subject3 | Total
------------------------------------------------------------------
John ----------- | ------- 23 | --------45 | --------37 | 105
Smith ---------- | ------- 41 | --------22 | --------11 | --74
Linda ---------- | ------- 35 | --------38 | --------23 | --96
------------------------------------------------------------------
Total----------- | --------99 | -------105 | --------71 | 275
The number of columns (Subject) is fixed but the number of rows depends on data in database.
There are 2 main problems here:
1. I want the summation row and column to execute calculation in client side using javascript. So when one of textboxes is lost focus, it will recalculate the summation value in each row and column.
2. I can't access the value from ASPxTextBox using javascript. I tried using:
var test = document.getElementById('<%# Container.FindControl("txt_Subject1").ClientID %>')
var data = test.value;
but it doesn't seem to work.
The following code also cause error:
var test = document.getElementById('<%# Container.FindControl("txt_Subject1").ClientID %>')
var data = test.GetValue();
And when I tried ClientInstanceName, it always return the value of the last row only:
var data = txt_Subject1.GetValue(); //doesn't work?
Also, I don't want to change ASPxTextBox to asp TextBox because I want to use some of its feature.
You could dinamically assign ClientInstanceName values based on row number:
txt_Subject1_1
txt_Subject1_2
...
txt_Subject1_n
Then use javascript to calculate sum:
var sum = 0;
for (var i = 1; i <= rowCount; i++)
{
sum += parseInt(window['txt_Subject1_' + i].GetValue());
}

Submitting Rows of Input Fields to Server

I have an HTML table of Input elements. How do I submit just the rows with edited fields to the server?
| 1 | A | B | C | D | E |
| 2 | A | B | C | D | E |
| 3 | A | B | C | D | E |
If 2B is changed, I want to send row 2.
create dynamically the inputs, add a event listener to each one (onchange) to add the input to an array, on other event get the data of the inputs in the array, send it and clean the array

Categories

Resources