請求書作成の為にカスタマイズ

計算フィールのエラー回避、また未入力時に合計値が計算されない事を考慮し請求書のフォームをJavascriptで作成しています。

※テーブルと計算値を使用すれば良いのですが使い勝手の問題でフォームを固定し、この形で構成しなければなりません…。

ですが、合計値が未定義(defined)が並んでしまい(undefinedundefinedundefined)、全てのフォームに入力しなければ正常に計算されません。

未定義のdefinedを回避し、正常に計算させる為にはどのようにすれば良いでしょうか。

調べてみたもののなかなか解決に至らずご質問させていただく流れとなりました。

 

当方、javascript初心者の為、他のスクリプト等を参考に作成したもののお粗末なソースで申し訳ございません。

下記がそのソースになります。

ご教授頂けますと幸いです。

 

 

 

(function () {
“use strict”;
kintone.events.on([
‘app.record.create.change.単価’,
‘app.record.create.change.単価1’,
‘app.record.create.change.単価2’,
‘app.record.create.change.単価3’,
‘app.record.create.change.単価4’,
‘app.record.create.change.単価5’,
‘app.record.create.change.単価6’,
‘app.record.create.change.単価7’,
‘app.record.create.change.単価8’,
‘app.record.create.change.単価9’,
‘app.record.create.change.単価10’,
‘app.record.create.change.単位数量’,
‘app.record.create.change.単位数量1’,
‘app.record.create.change.単位数量2’,
‘app.record.create.change.単位数量3’,
‘app.record.create.change.単位数量4’,
‘app.record.create.change.単位数量5’,
‘app.record.create.change.単位数量6’,
‘app.record.create.change.単位数量7’,
‘app.record.create.change.単位数量8’,
‘app.record.create.change.単位数量9’,
‘app.record.create.change.単位数量10’,
‘app.record.edit.change.単価’,
‘app.record.edit.change.単価1’,
‘app.record.edit.change.単価2’,
‘app.record.edit.change.単価3’,
‘app.record.edit.change.単価4’,
‘app.record.edit.change.単価5’,
‘app.record.edit.change.単価6’,
‘app.record.edit.change.単価7’,
‘app.record.edit.change.単価8’,
‘app.record.edit.change.単価9’,
‘app.record.edit.change.単価10’,
‘app.record.edit.change.単位数量’,
‘app.record.edit.change.単位数量1’,
‘app.record.edit.change.単位数量2’,
‘app.record.edit.change.単位数量3’,
‘app.record.edit.change.単位数量4’,
‘app.record.edit.change.単位数量5’,
‘app.record.edit.change.単位数量6’,
‘app.record.edit.change.単位数量7’,
‘app.record.edit.change.単位数量8’,
‘app.record.edit.change.単位数量9’,
‘app.record.edit.change.単位数量10’
], function (event){

var record = event.record
var price1 = record[‘単価1’].value;
var price2 = record[‘単価2’].value;
var price3 = record[‘単価3’].value;
var price4 = record[‘単価4’].value;
var price5 = record[‘単価5’].value;
var price6 = record[‘単価6’].value;
var price7 = record[‘単価7’].value;
var price8 = record[‘単価8’].value;
var price9 = record[‘単価9’].value;
var price10 = record[‘単価10’].value;
var number1 = record[‘単位数量1’].value;
var number2 = record[‘単位数量2’].value;
var number3 = record[‘単位数量3’].value;
var number4 = record[‘単位数量4’].value;
var number5 = record[‘単位数量5’].value;
var number6 = record[‘単位数量6’].value;
var number7 = record[‘単位数量7’].value;
var number8 = record[‘単位数量8’].value;
var number9 = record[‘単位数量9’].value;
var number10 = record[‘単位数量10’].value;

// 合計金額の算出
var subTotal1 = price1;
var subTotal2 = price2;
var subTotal3 = price3;
var subTotal4 = price4;
var subTotal5 = price5;
var subTotal6 = price6;
var subTotal7 = price7;
var subTotal8 = price8;
var subTotal9 = price9;
var subTotal10 = price10;

// 単位数量が存在する場合 単価 * 金額
// 単位数量が存在しない場合、単価=金額

if(number1 >= “0”){
subTotal1 = price1 * number1;

} else if(number1 = “”){
subTotal1 = price1;
}

if(number2 >= “0”){
subTotal2 = price2 * number2;

} else if(number2 = “”){
subTotal2 = price2;

}

if(number3 >= “0”){
subTotal3 = price3 * number3;
} else if(number3 = “”){
subTotal3 = price3;
}

if(number4 >= “0”){
subTotal4 = price4 * number4;
} else if(number4 = “”){
subTotal4 = price4;
}

if(number5 >= “0”){
subTotal5 = price5 * number5;
} else if(number5 = “”){
subTotal5 = price5;
}

if(number6 >= “0”){
subTotal6 = price6 * number6;
} else if(number6 = “”){
subTotal6 = price6;
}

if(number7 >= “0”){
subTotal7 = price7 * number7;
} else if(number7 = “”){
subTotal7 = price7;
}

if(number8 >= “0”){
subTotal8 = price8 * number8;
} else if(number8 = “”){
subTotal8 = price8;
}

if(number9 >= “0”){
subTotal9 = price9 * number9;
} else if(number9 = “”){
subTotal9 = price9;
}

if(number10 >= “0”){
subTotal10 = price10 * number10;
} else if(number10 = “”){
subTotal10 = price10;
}

//金額

record[‘金額1’].value = subTotal1;
record[‘金額2’].value = subTotal2;
record[‘金額3’].value = subTotal3;
record[‘金額4’].value = subTotal4;
record[‘金額5’].value = subTotal5;
record[‘金額6’].value = subTotal6;
record[‘金額7’].value = subTotal7;
record[‘金額8’].value = subTotal8;
record[‘金額9’].value = subTotal9;
record[‘金額10’].value = subTotal10;

//合計・消費税・お支払金額の算出

var total = subTotal1 + subTotal2 + subTotal3 + subTotal4 + subTotal5 + subTotal6 + subTotal7 + subTotal8 + subTotal9 + subTotal10;
var tax = total * 0.08;
var pay = total + tax;

//合計・消費税・お支払金額の反映

record[‘合計’].value = total;
record[‘消費税’].value = tax;
record[‘お支払金額’].value = pay;

return event;

});

// レコード追加画面が表示された時, レコード編集画面が表示された時のイベント
kintone.events.on([‘app.record.edit.show’, ‘app.record.create.show’], function (event) {
// 「合計」フィールドの入力を制限
event.record[‘合計’].disabled = true;
event.record[‘消費税’].disabled = true;
event.record[‘お支払金額’].disabled = true;

return event;
});
})();

Toshi さん
cstapの瀧ヶ平です

kintoneのJavaScriptで取得できるフィールドの値は数値ではなく文字列になっているため、これをまず数値に変換しなければいけません。そのため、各金額など数値を変数に代入するところでは、

var price1 = Number(record['単価1'].value);

のようにして、取得した値を数値に変換すれば解決するのではないかと思います。

cstap

瀧ヶ平様

 

回答有難う御座います。

早速、アドバイスいただいた通り修正するとundefinedの表示は消え

数値としてたされるようになりました。

 

画像の「単価」欄に1箇所数字を入力すると

全ての「金額」欄、「合計」「消費税」「お支払金額」に「NaN」が入ってしまい

全ての単価欄に数字を入れないと処理されませんでした。

たぶん下部の「var total = subTotal1 + subTotal2 + subTotal3 + subTotal4 + subTotal5 + subTotal6 + subTotal7 + subTotal8 + subTotal9 + subTotal10;」で定まっていない値を足し算しようちしている事が原因だと思うのですが、

入力されている欄のみを足し、合計を割り出すとしたらどのようにすればよろしいでしょうか。

 

わかりにくく説明が不足しておりましたら申し訳ございません。

ご教示いただけますと幸いです。

 

Toshi さん

おそらく各if文の中で

else if(number1 = "")

のようにしていることが直接の原因かと思います。

JavaScriptなどのプログラミング言語では比較を行う式は=ではなく==です(JavaScriptではこれも厳密な比較ではないのでJavaScriptでは一般的に===を用います)
また、すべての数値をNumberによって変換しているため、基本的にNaNまたは数値以外の値は変数に入らないはずなので

if(!Number.isNaN(number1) && !Number.isNaN(price1) && number1 >= 0){
subTotal1 = price1 * number1;

} else if(!Number.isNaN(price1)){
subTotal1 = price1;
} else {
subTotal1 = 0;
}

のようにif文部分を変更しても良いかもしれません。

0を金額フィールドに表示したくなければsubTotalの値が0かどうかで判断して “” を代入すればよいかと思います。

 

瀧ヶ平様

 

的確かつ迅速なご回答いただき有難う御座います。

アドバイスいただきました通り修正したところ構想していた通りの動作を致しました。

この件で数日間頭を抱えていたので…非常に助かりました。

 

「isNaN」を調べてみましたがご指摘通り「number1 = “”」でしては駄目ですね…。

いただいたサンプルを元にjavascriptへの知識を深めてまいりたいと思います。

 

有り難う御座いました。

 

瀧ヶ平様

 

「subTotalの値が0かどうかで判断して"" を代入すればよいかと思います」こちらがうまく実装する事が出来ず

いただきましたサンプル内の「subTotal1 = 0;」を「subTotal1 = null;」にする事で一応表示されず構想通りに表面上は動きました。

ですが、nullの使い方、文法からして常識から外れている事はわかります…。

 

単純に下記のようなifを作って試したもののうまくいきませんでした。

if(subTotal1 === 0){

 subTotal1 = “”;

}

 

こういった場合、どういう記述がベストなのでしょうか。

 

度重なる質問で申し訳ございません。

宜しくお願い致します。

Toshiさん

subTotal1という変数はレコードの値ではなくかつ計算に利用するので、record[“金額1”].value にsubTotal1を代入する際にsubTotalの値が0かどうか判定し、0ならばrecord[“金額1”].value = “”; そうでなければ record["金額1”].value = subTotal1;という風に実装すればよいと思います。