【質問】ラジオボタンの選択肢を数値として処理したい

ラジオボタンの選択肢を、例えば「5、3、1」とした場合、
デフォルト仕様では入力結果は文字列として認識されますが、これを数字として認識し、自動計算の対象にしたく思っています。
良い方法があれば、ぜひご教示ください。
よろしくお願いいたします。

kamewoさん
cstapの落合です。

自動計算をkintoneの計算フィールドを利用する形ではなく、数値フィールドに対してJavaScriptで計算する形にしてはどうでしょう?

そうすることで、ラジオボタンの選択肢を数値として計算できるかと思います。

以上、参考になりますでしょうか?

落合様
ご回答ありがとうございます。

「数値フィールドに対してJavaScriptで計算する」方法がわからないのですが、なにか参考になるトピックなどあれば、教えていただないでしょうか。
よろしくお願いいたします。

kamewoさん

このTips などが参考になるかと思います。

JavaScriptがよくわからない場合は、はじめよう kintone JavaScript API でkintoneでのカスタマイズ方法を押さえるといいかと思います。

落合様
参考Tipsありがとうございます。
チャレンジしてみます。

kamewoさん
頑張ってください!

また何かありましたらご質問下さい!

下記のようなスクリプトを記述して、計算はできるのですが、以下を解決したく困っております。
どなたかご教示いただけると助かります。

・保存しないと集計結果が表示されない。
(ラジオボタンで選択したら、すぐに反映させたい)

・一覧画面に集計結果を表示させたい。

・モバイルでも利用したい。

========================
(function () {
kintone.events.on(‘app.record.detail.show’, function (event) {
var updatedAt = ‘’;
if (event) {
updatedAt = eval(event[“record”][“ラジオボタン1”][“value”]) + eval(event[“record”][“ラジオボタン2”][“value”]);
}

var mySpaceField = kintone.app.record.getSpaceElement('my_space_field');
    mySpaceField.parentNode.style.width = '200px';
    mySpaceField.innerHTML = updatedAt;
});

})();

kamewoさん

ラジオボタンの計算結果を入れておく数値フィールドを用意し、JavaScriptで計算結果を入力し、その数値フィールドを一覧画面に表示するフィールドに加えると良いと思います。
具体的には次のようなコードで実装できます。

// 集計結果を入れておく数値フィールドのフィールドコードを'集計'とする

(function () {
  var events = ["app.record.create.submit",
              "app.record.edit.submit",
              "app.record.create.change.ラジオボタン1",
              "app.record.edit.change.ラジオボタン1",
              "app.record.create.change.ラジオボタン2",
              "app.record.edit.change.ラジオボタン2"
              ];

  kintone.events.on(events, function(event){
    var record = event.record;
    var updatedAt = eval(event.record["ラジオボタン1"]["value"] + "+" + event.record["ラジオボタン2"]["value"]);
    record["集計"]["value"] = updatedAt;
    return event;
  });
})();

また、現在モバイルではレコード編集画面、追加画面の保存実行前イベントとフィールド値変更時イベントが利用できないため、編集/追加画面の表示時イベントで一時的に値を保存しておき、ラジオボタンが変わっているかを監視するなどの方法が考えられますが、非常に大変なものになるかと思います。

また何かあればご質問ください。

瀧ヶ平様
早速のご回答ありがとうございます。
いただいたスクリプトで、PC版は希望通りの動きになりました!

ただ、主にモバイルで利用するアプリなのです。
リアルタイムの変更でなく、保存後に集計結果が表示させるようにすることも難しいでしょうか?

kamewoさん

リアルタイムでなければ、モバイルではレコードの詳細画面の表示時のイベントでラジオボタンの値を取得、計算してREST APIにてレコードを登録すれば可能です。
こちらのページが参考になると思います。

また困ったことがあればご質問ください

瀧ヶ平様
ご返答ありがとうございます。
ただ、教えていただいたページを見ても、正直ちんぷんかんぷんでして・・・。
もう少し噛み砕いていただけるとうれしいです。
すいません。

kamewoさん

こちらこそ説明が不足して申し訳ありません。
流れとしては、モバイル版のレコード詳細画面の表示イベントでレコードのラジオボタンの内容から集計を計算し、それをkintoneのREST APIのPUTメソッドを使ってレコードを更新する、という流れになります。
以下のコードが参考になると思います。

(fucntion(){
  "use strict";
  kintone.events.on('mobile.app.record.detail.show',function(event){
    var record = event.record;
    var id = event.recordId;
    var app = event.appId;
    if(!record["集計"]["value"]){
      // 集計の中身がなかった場合計算する
      var updatedAt = eval(record["ラジオボタン1"]["value"] + "+" + record["ラジオボタン2"]["value"]);
      // 計算した結果をkintone REST API で更新する
      kintone.api(
        kintone.api.url("/k/v1/record"),
        "PUT",
        {
          app: app,
          id: id,
          record: {
            "集計": {
              value: updatedAt
            }
          }
        },
        function(res){
            // レコードの更新が成功した場合は画面を再読み込みする
            location.reload();
        }
      );
    }
  }
}
)();

瀧ヶ平様
丁寧な説明ありがとうございます。
早速試してみましたが、うまく動作しません。

・アプリのアプリIDを記述する必要はありますか?
「var updateAppId = 668;」みたいな。

・kintone.api.url(“/k/v1/record”)
「v1」は、アプリIDに差し替える必要がありますか?

よろしくお願いいたします。

kamewoさん

記載したコードにミスがありました、申し訳ありません。
正しくは以下になります。

(function(){
  "use strict";
  kintone.events.on('mobile.app.record.detail.show',function(event){
    var record = event.record;
    var id = event.recordId;
    var app = event.appId;
    var updatedAt = eval(record["ラジオボタン1"]["value"] + "+" + record["ラジオボタン2"]["value"]);
    if(record["集計"]["value"] != updatedAt){
      // 集計の中身が正しくない場合に計算した結果をkintone REST API で更新する
      kintone.api(
        kintone.api.url("/k/v1/record"),
        "PUT",
        {
          app: app,
          id: id,
          record: {
            "集計": {
              value: updatedAt
            }
          }
        },
        function(res){
            // レコードの更新が成功した場合は画面を再読み込みする
            location.reload();
        }
      );
    }
});}
)();

また何かお困りのことがあれば気軽にご質問ください。

瀧ヶ平様、いただいたコードでモバイルでも希望通りの動きになりました。
ありがとうございます。
実際には、ラジオボタンが20個ぐらいあるので、修正しながら構築してみます。
本当に助かりました。
重ねてお礼申し上げます。

瀧ヶ平様
もう少々お力を頂戴できないでしょうか。

モバイル版で、
・Q1とQ2の合計を「集計01」フィールド
・Q3とQ4の合計を「集計02」フィールド
・Q5とQ6の合計を「集計03」フィールドに表示したい場合です。
下記のコードで試したのですが、うまく動作しませんでした。

(function(){
“use strict”;
kintone.events.on(‘mobile.app.record.detail.show’,function(event){
var record = event.record;
var id = event.recordId;
var app = event.appId;
var updatedAt01 = eval(event.record[“Q1”][“value”] + “+” + event.record[“Q2”][“value”]);
if(record[“集計01”][“value”] != updatedAt01){
// 集計の中身が正しくない場合に計算した結果をkintone REST API で更新する
kintone.api(
kintone.api.url(“/k/v1/record”),
“PUT”,
{
app: app,
id: id,
record: {
“集計01”: {
value: updatedAt01
}
}
},
var updatedAt02 = eval(event.record[“Q3”][“value”] + “+” + event.record[“Q4”][“value”]);
if(record[“集計02”][“value”] != updatedAt02){
// 集計の中身が正しくない場合に計算した結果をkintone REST API で更新する
kintone.api(
kintone.api.url(“/k/v1/record”),
“PUT”,
{
app: app,
id: id,
record: {
“集計02”: {
value: updatedAt02
}
}
},
var updatedAt03 = eval(event.record[“Q5”][“value”] + “+” + event.record[“Q6”][“value”]);
if(record[“集計03”][“value”] != updatedAt03){
// 集計の中身が正しくない場合に計算した結果をkintone REST API で更新する
kintone.api(
kintone.api.url(“/k/v1/record”),
“PUT”,
{
app: app,
id: id,
record: {
“集計03”: {
value: updatedAt03
}
}
},
function(res){
// レコードの更新が成功した場合は画面を再読み込みする
location.reload();
}
);
}
});}
)();

kamewoさん

コードを見る限りおそらく文法エラーでJavaScriptが実行されていないようですね。
この場合は集計01,02,03のいずれかの値が正しくない場合にレコードを更新すると良いと思います。また、レコードの更新は複数の値を一度に更新できるためそのように利用すると良いでしょう。
先ほどの私のコードをそのように編集してみました。

(function(){
  "use strict";
  kintone.events.on('mobile.app.record.detail.show',function(event){
    var record = event.record;
    var id = event.recordId;
    var app = event.appId;
    var updatedAt01 = eval(record["Q1"]["value"] + "+" + record["Q2"]["value"]);
    var updatedAt02 = eval(record["Q3"]["value"] + "+" + record["Q4"]["value"]);
    var updatedAt03 = eval(record["Q5"]["value"] + "+" + record["Q6"]["value"]);
    if(record["集計01"]["value"] != updatedAt01 || record["集計02"]["value"] != updatedAt02 || record["集計03"]["value"] != updatedAt03){
      // 集計の中身が正しくない場合に計算した結果をkintone REST API で更新する
      kintone.api(
        kintone.api.url("/k/v1/record"),
        "PUT",
        {
          app: app,
          id: id,
          record: {
            "集計01": {
              value: updatedAt01
            },
            "集計02": {
              value: updatedAt02
            },
            "集計03": {
              value: updatedAt03
            }
          }
        },
        function(res){
            // レコードの更新が成功した場合は画面を再読み込みする
            location.reload();
        }
      );
    }
});}
)();

JavaScriptのif文では条件式を || ではさむことで「又は」の条件を表現できるので、他にも条件を増やす場合は同じように増やすと良いでしょう。また、レコードの複数のフィールドを変更する場合は record:{} の{}の中に , で区切って

"<フィールドコード>" : {
  "value": <変更後の値>
}

を追加すれば複数の値を一度に変更できるので、複数のフィールドを更新する場合もそのようにすることで対応できます。

以上参考にしていただければ幸いです。

瀧ヶ平様
丁寧なご回答ありがとうございます。

アプリに実装したところ、ほぼ問題なく動作しているのですが、時々リロードを延々と繰り返してしまうことがあります。

実際のコードは下記なのですが、添削いただいてもよいでしょうか。

(function(){
“use strict”;
kintone.events.on(‘mobile.app.record.detail.show’,function(event){
var record = event.record;
var id = event.recordId;
var app = event.appId;
var updatedAt01 = eval(event.record[“Q1”][“value”] + “+” + event.record[“Q2”][“value”] + “+” + event.record[“Q3”][“value”] + “+” + event.record[“Q4”][“value”] + “+” + event.record[“Q5”][“value”] + “+” + event.record[“Q6”][“value”] + “+” + event.record[“Q7”][“value”]);
var updatedAt02 = eval(event.record[“Q8”][“value”] + “+” + event.record[“Q9”][“value”] + “+” + event.record[“Q10”][“value”] + “+” + event.record[“Q11”][“value”] + “+” + event.record[“Q12”][“value”]);
var updatedAt03 = eval(event.record[“Q13”][“value”] + “+” + event.record[“Q14”][“value”] + “+” + event.record[“Q15”][“value”]);
if(record[“集計01”][“value”] != updatedAt01 || record[“集計02”][“value”] != updatedAt02 || record[“集計03”][“value”] != updatedAt03){
// 集計の中身が正しくない場合に計算した結果をkintone REST API で更新する
kintone.api(
kintone.api.url(“/k/v1/record”),
“PUT”,
{
app: app,
id: id,
record: {
“集計01”: {
value: updatedAt01
},
“集計02”: {
value: updatedAt02
},
“集計03”: {
value: updatedAt03
}
}
},
function(res){
// レコードの更新が成功した場合は画面を再読み込みする
location.reload();
}
);
}
});}
)();

kamewoさん

回答が遅くなり申し訳ありません。
見たところコードにはおかしな点は見当たらず、時々ということで理由としては怪しいのですが、更新を繰り返す原因はおそらくフィールドコードが間違っているなどでレコードが正常に更新されていないことなのではないかと思います。

あいまいな回答しかできずすいません。
参考になれば幸いです。

瀧ヶ平様
ご回答ありがとうございます。

フィールドコードも見なおしてみたのですが、特に問題はないようでした。
レコードを保存時に、下記エラーが出ることがあるのですが、ループしてしまうのと関係あるでしょうか?

テンプレートのエラーです。
Code:CB_TE01
ID:1505999166-1982556900