はじめて投稿します。
フィールド（数値）の値が未記入の場合、自動計算えお行うとNAとエラー表示となります。
フィールドの初期値で"0"を設定した場合、印刷する際に0だらけになってしまうので、
エクセルの様に0値を表示しない。
という設定は可能なのでしょうか？
例）
数値A×数値B＝計算A
数値C*数値D＝計算B
という２つの計算がある場合のやり方があるのでしょうか？
ｻﾝﾌﾟﾙ等がありましたらご教授頂きたいく思います。
ﾃﾝﾌﾟのｻﾝﾌﾟﾙをいじるくらいのレベルでできますでしょうか？
よろしくお願いいたします。
青山昌司さん
cstapの瀧ヶ平です。
テーブル外のフィールドでも同様に計算が可能です。
テーブルの場合はリンク先ではループによって処理していますが、これを目的のフィールドに置き換えて実装すれば良いかと思います。
瀧ヶ平さま
ご連絡ありがとうございます。
現在御社のプリントクリエイターを利用しており、業務で活用せていただいております。
今回活用方法の一つとして見積書アプリを新たに作りたいと考えています。
現状試作アプリでは、数値フィールドで初期値0で構成しているため、印刷時0だらけの見積書となっています。
アプリ内にはテーブルで構成された商品の入力欄があり、先日URLをお付けした方法で成功しております。
今回はテーブル以外での計算項目が複数あり、ご回答いただいた、通常のフィールドに置き換える方法がわかりません。
テーブルのサンプルをみて何とか自分のアプリに置き換えることくらいはできそうなのですが、
サンプル等が掲示されているページをご存知でしたらご教願いたいです。
ﾌｨｰﾙﾄﾞのイメージは下記のような感じで考えています。
文字フィールド（ﾌｨｰﾙﾄﾞｺｰﾄﾞ：単価A） × 数値フィールド（ﾌｨｰﾙﾄﾞｺｰﾄﾞ：数量A） = 文字フィールド（ﾌｨｰﾙﾄﾞｺｰﾄﾞ：合価A）
文字フィールド（ﾌｨｰﾙﾄﾞｺｰﾄﾞ：単価B） × 数値フィールド（ﾌｨｰﾙﾄﾞｺｰﾄﾞ：数量B） = 文字フィールド（ﾌｨｰﾙﾄﾞｺｰﾄﾞ：合価B）
テーブルで使用しているJSは、下記のものを使用しています。
/**
* テーブル：Table
* 単価：price(文字列フィールド)
* 個数：num(数値フィールド)
* 小計：sales(文字列フィールド)
*
* 総計：total(数値フィールド)
*/
(function () {
“use strict”;
function loadJS(src) {
document.write(‘<script type=“text/javascript” src="’ + src + ‘"></script>’);
}
// jQuery の JavaScript ファイル
loadJS(“https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js”);
// 数値→桁区切り
var numberFormat = function (num) {
if (typeof num === ‘number’) {
return num.toString().replace(/^\d+[^.]/, function (t) {
return t.replace(/([\d]+?)(?=(?:\d{3})+$)/g, function (t) {
return t + ‘,’;
});
});
} else {
return num;
}
}
// 桁区切り→数値
var number = function (numberFormatStr) {
if (typeof numberFormatStr === ‘string’) {
return parseInt(numberFormatStr.replace(‘,’, ‘’), 10);
} else {
return numberFormatStr;
}
}
/**
* 計算処理
*/
var myCalculate = function (record) {
var table = record.Table.value;
var total = 0;
for (var i = 0, l = table.length; i < l; i++) {
var row = table[i].value; // テーブルの1行
// 小計を計算
var price = number(row.price.value);
var num = row.num.value;
if (price && num) {
var sales = price * num;
row.sales.value = numberFormat(sales);
total += sales;
} else {
// priceかnumが空の場合はnull
row.sales.value = null;
}
row.price.value = numberFormat(price);
}
record.total.value = total;
};
// イベント
kintone.events.on([“app.record.edit.show”, “app.record.create.show”], function (event) {
// 編集時に計算するイベント
$(document.body).on(‘change’, “input[type=‘text’]”, function () {
var record = kintone.app.record.get();
myCalculate(record.record);
kintone.app.record.set(record);
});
// 無理やりDOM操作で編集不可に
$(document).on(‘click’, ‘.add-row-image-gaia’, function () {
var ele = $(‘.value-139700’).children(); // 小計のclass
ele.addClass(‘disabled-cybozu’);
ele.children(‘input’).attr(‘disabled’, ‘disabled’);
});
// 無理やりDOM操作で行削除イベント
$(document).on(‘click’, ‘.remove-row-image-gaia’, function () {
var record = kintone.app.record.get();
myCalculate(record.record);
kintone.app.record.set(record);
});
return event;
});
// 計算する数値フィールドを編集不可にする
kintone.events.on([“app.record.edit.show”, “app.record.create.show”], function (event) {
var table = event.record.Table.value;
for (var i = 0, l = table.length; i < l; i++) {
table[i].value.sales.disabled = true;
}
event.record.total.disabled = true;
return event;
});
// 登録、編集時の処理
kintone.events.on([“app.record.edit.submit”, “app.record.create.submit”], function (event) {
myCalculate(event.record);
return event;
});
})();
以上、よろしくお願いいたします。
青山さん
そちらのコードに追記する形でそのような実装を書いてみたので参考にしてください。
また、フィールドの更新処理に関してはこちらのTipsなどが参考になると思います。お時間がありましたらはじめよう kintone JavaScript API のTipsを一通り試してみると理解が早まると思いますのでぜひお試しください。
/**
* テーブル：Table
* 単価：price(文字列フィールド)
* 個数：num(数値フィールド)
* 小計：sales(文字列フィールド)
*
* 総計：total(数値フィールド)
*/
(function () {
"use strict";
function loadJS(src) {
document.write('<script type="text/javascript" src="' + src + '"></script>');
}
// jQuery の JavaScript ファイル
loadJS("https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js");
// 数値→桁区切り
var numberFormat = function (num) {
if (typeof num === 'number') {
return num.toString().replace(/^\d+[^\.]/, function (t) {
return t.replace(/([\d]+?)(?=(?:\d{3})+$)/g, function (t) {
return t + ',';
});
});
} else {
return num;
}
}
// 桁区切り→数値
var number = function (numberFormatStr) {
if (typeof numberFormatStr === 'string') {
return parseInt(numberFormatStr.replace(',', ''), 10);
} else {
return numberFormatStr;
}
}
/**
* 計算処理
*/
var myCalculate = function (record) {
var table = record.Table.value;
var total = 0;
for (var i = 0, l = table.length; i < l; i++) {
var row = table[i].value; // テーブルの1行
// 小計を計算
var price = number(row.price.value);
var num = row.num.value;
if (price && num) {
var sales = price * num;
row.sales.value = numberFormat(sales);
total += sales;
} else {
// priceかnumが空の場合はnull
row.sales.value = null;
}
row.price.value = numberFormat(price);
}
record.total.value = total;
// テーブル以外の計算
var priceA = record["単価A"].value;
var priceB = record["単価B"].value;
var numA = record["数量A"].value;
var numB = record["数量B"].value;
if(priceA && numA){
var selesA = priceA * numA;
record["合価A"].value = numberFormat(salesA);
} else {
record["合価A"].value = null;
}
if(priceB && numB){
var selesB = priceB * numB;
record["合価B"].value = numberFormat(salesB);
} else {
record["合価B"].value = null;
}
};
// イベント
kintone.events.on(["app.record.edit.show", "app.record.create.show"], function (event) {
// 編集時に計算するイベント
$(document.body).on('change', "input[type='text']", function () {
var record = kintone.app.record.get();
myCalculate(record.record);
kintone.app.record.set(record);
});
// 無理やりDOM操作で編集不可に
$(document).on('click', '.add-row-image-gaia', function () {
var ele = $('.value-139700').children(); // 小計のclass
ele.addClass('disabled-cybozu');
ele.children('input').attr('disabled', 'disabled');
});
// 無理やりDOM操作で行削除イベント
$(document).on('click', '.remove-row-image-gaia', function () {
var record = kintone.app.record.get();
myCalculate(record.record);
kintone.app.record.set(record);
});
return event;
});
// 計算する数値フィールドを編集不可にする
kintone.events.on(["app.record.edit.show", "app.record.create.show"], function (event) {
var table = event.record.Table.value;
for (var i = 0, l = table.length; i < l; i++) {
table[i].value.sales.disabled = true;
}
event.record.total.disabled = true;
// テーブル以外の計算する数値フィールドを編集不可にする
event.record["合価A"].disabled = true;
event.record["合価B"].disabled = true;
return event;
});
// 登録、編集時の処理
kintone.events.on(["app.record.edit.submit", "app.record.create.submit"], function (event) {
myCalculate(event.record);
return event;
});
})();
瀧ヶ平さま
ご連絡ありがとうございます。
早速下記２点の追記を行い実行してみました。
// テーブル以外の計算
// テーブル以外の計算する数値フィールドを編集不可にする
実施後の変化として合価AおよびBは編集不可は反映しているようですが、
計算を実行していない様子です。
また、単価と数量を入力すると保存ができない状態です。
片方のみの入力の場合は保存ができます。
＞フィールドの更新処理に関しては・・・
のページを参考にしたところ、すべてのフィールドが数値フィールドで作られているようでしたので
数値フィールドに変えてみましたが症状は変らない状況です。
頂いたサンプルのコピーをそのままUPしてみましたが、やはり同じようです。
何かしら追加、変更等が必要でしょうか？
よろしくお願いいたします。
文字フィールド（ﾌｨｰﾙﾄﾞｺｰﾄﾞ：単価A） × 数値フィールド（ﾌｨｰﾙﾄﾞｺｰﾄﾞ：数量A） = 文字フィールド（ﾌｨｰﾙﾄﾞｺｰﾄﾞ：合価A）
文字フィールド（ﾌｨｰﾙﾄﾞｺｰﾄﾞ：単価B） × 数値フィールド（ﾌｨｰﾙﾄﾞｺｰﾄﾞ：数量B） = 文字フィールド（ﾌｨｰﾙﾄﾞｺｰﾄﾞ：合価B）
青山さん
var priceA = record["単価A"].value;
var priceB = record["単価B"].value;
var numA = record["数量A"].value;
var numB = record["数量B"].value;
の部分を
var priceA = number(record["単価A"].value);
var priceB = number(record["単価B"].value);
var numA = record["数量A"].value;
var numB = record["数量B"].value;
と変更してみたらどうでしょうか？
基本的にはテーブルでの計算と同じことをしているので問題ないと思いますが…