JavaScriptを活用したノーコードアプリのカスタマイズに挑戦!経験から得た学びと成長 No.10

今回は、日付間の月数計算機能の実装について共有します。

javascript
const record = event.record;
const startDateField = 'fc_DATE'; // 開始日フィールドコードを指定
const endDateField = 'fc_DATE_0'; // 終了日フィールドコードを指定
const resultFields = ['fc_SINGLE_LINE_TEXT', 'fc_NUMBER', 'fc_MULTI_LINE_TEXT', 'fc_RICH_TEXT']; // 結果をセットするフィールドコードを指定
const optionField = 'fc_DROPDOWN'; // 月内の日の取り扱いオプションフィールドコードを指定

// 開始日と終了日から月数を計算する関数
const calculateMonths = (startDate, endDate, considerDays) => {
  let months;
  months = (endDate.getFullYear() - startDate.getFullYear()) * 12;
  months -= startDate.getMonth();
  months += endDate.getMonth();
  // 「月内の日も考慮」の場合、開始日の日が終了日の日より大きい場合、1ヶ月減らす
  if (considerDays && startDate.getDate() > endDate.getDate()) {months -= 1;}
  return months;
};


// 開始日と終了日の値を取得
const startDateValue = record[startDateField].value ? new Date(record[startDateField].value) : null;
const endDateValue = record[endDateField].value ? new Date(record[endDateField].value) : null;
const optionValue = record[optionField].value; // オプションの値を取得


// オプションの値に基づいて月内の日を考慮するかどうかを決定
const considerDays = optionValue === '月内の日も考慮';


// 月数を計算
const months = calculateMonths(startDateValue, endDateValue, considerDays);


// 結果をセット先フィールドにセット
resultFields.forEach(fieldCode => {
  if (record[fieldCode]) {
    record[fieldCode].value = months.toString();
  }
});

このコードは、指定された開始日と終了日フィールドから月数を計算し、結果を複数のフィールドにセットします。
ドロップダウンフィールドを使用してオプションを選択できる柔軟性も追加しました。
プログラミングと筋トレには多くの共通点があり、継続的な努力と自己管理が成功の鍵となります。
この機能の実装を通じて、論理的思考力と問題解決能力を鍛えることができます。
今後も、日々の小さな進歩を大切にしながら、スキルアップを目指していきます。

JavaScriptを活用したノーコードアプリのカスタマイズに挑戦!経験から得た学びと成長 No.9

前回はテキストフィールドの文字数バリデーション機能について紹介しましたが、今回は日付フィールドを和暦に変換する機能の実装についてお話しします。

和暦変換の実装

以下のコードは、日付フィールドの値を和暦に変換し、指定されたフィールドにセットするものです。

javascript
const record = event.record;
const dateFieldCode = 'fc_DATE'; // 変更元の日付
const combinedEraYearFieldCode = 'fc_SINGLE_LINE_TEXT'; // 和暦(元号と年数)のセット先
const eraFieldCode = 'fc_SINGLE_LINE_TEXT_2'; // 元号のセット先
const yearFieldCode = 'fc_NUMBER'; // 和暦年数のセット先

// 日付フィールドの値を和暦に変換して、指定されたフィールドにセット
if (record[dateFieldCode] && record[dateFieldCode].value) {
  const date = new Date(record[dateFieldCode].value);
  const eraYear = convertToJapaneseEra(date);

  // 和暦を「平成30年」のような形式で指定のフィールドにセット
  if (record[combinedEraYearFieldCode]) {
    record[combinedEraYearFieldCode].value = `${eraYear.era}${eraYear.year}年`;
  }

  // 和暦の元号と年数を個別のフィールドにセット
  if (record[eraFieldCode]) {
    record[eraFieldCode].value = eraYear.era;
  }
  if (record[yearFieldCode]) {
    record[yearFieldCode].value = eraYear.year;
  }
}

このコードは、日付フィールドの値を和暦に変換し、元号と年数を個別のフィールドにセットします。convertToJapaneseEra関数を使用して、日付を和暦に変換しています。

プログラミングと筋トレには多くの共通点があります。両者とも、継続的な努力と自己管理が成功の鍵となります。
筋トレでは正しいフォームや適切な負荷を考える必要があります。同様に、プログラミングでも効率的なコードを書くためには論理的な思考が求められます。
今後も、日々の小さな進歩を大切にしながら、スキルアップを目指していきます。

 

JavaScriptを活用したノーコードアプリのカスタマイズに挑戦!経験から得た学びと成長 No.8

今回は、テキストフィールドの文字数バリデーション機能の実装について共有します。

javascript
const record = event.record;
const fieldCodes = ['fc_SINGLE_LINE_TEXT', 'fc_MULTI_LINE_TEXT', 'fc_RICH_TEXT', 'fc_LINK'];
const minLength = 1;
const maxLength = 10;
const errorMessage = '文字数は1から10の範囲で入力してください。';

for (let field in record) {
  if (record.hasOwnProperty(field)) {
    let fieldValue = record[field].value;
    let fieldType = record[field].type;

    if (fieldType === 'RICH_TEXT') {
      fieldValue = fieldValue.replace(/<[^>]*>/g, '');
    }

    if (fieldCodes.includes(fieldType)) {
      const textLength = fieldValue ? fieldValue.length : 0;
      if (textLength < minLength || textLength > maxLength || !fieldValue.trim()) {
        record[field].error = errorMessage;
      }
    }
  }
}

この関数は、特定のフィールドタイプに対して文字数制限を適用し、条件を満たさない場合にエラーメッセージを表示します。リッチテキストフィールドではHTMLタグを除外するなど、細かな工夫も施しています。
プログラミングは趣味の筋トレと似ていますが、両者とも日々の積み重ねが重要で、小さな進歩が大きな成果につながります。
この関数の実装を通じて、論理的思考力とコーディングスキルを鍛えることができました。
これからも、筋トレのように毎日少しずつ進歩を重ね、プログラミングスキルを磨いていきます。

JavaScriptを活用したノーコードアプリのカスタマイズに挑戦!経験から得た学びと成長 No.7

今回は年齢計算関数の実装について共有します。

年齢を計算する関数

以下のコードは、生年月日から年齢を計算する関数です。

javascript
const record = event.record;
const birthdateString = record['fc_BIRTHDATE'].value; // 生年月日フィールドの値を取得
if (birthdateString) {
  const today = new Date();
  const birthdateObject = new Date(birthdateString);
  let age = today.getFullYear() - birthdateObject.getFullYear();
  const monthDiff = today.getMonth() - birthdateObject.getMonth();
  if (monthDiff < 0 || (monthDiff === 0 && today.getDate() < birthdateObject.getDate())) {
    age--;
  }
  record['fc_AGE'].value = age; // 年齢フィールドに計算結果をセット
}

この関数は、生年月日フィールドの値を取得し、現在の日付と比較して年齢を計算します。月や日の差を考慮して正確な年齢を求め、結果を年齢フィールドにセットします。

筋トレもプログラミングも、日々の積み重ねが大切です。毎日の小さな努力が、大きな成果に繋がります。
これからも、筋トレと同様にプログラミングのスキルを日々積み上げていきます。継続することで、必ず成長を実感できるはずです。

JavaScriptを活用したノーコードアプリのカスタマイズに挑戦!経験から得た学びと成長 No.6

今回は日数計算関数の実装についてコードの一部を共有します。

 

const record = event.record;
const startDate = new Date(record['fc_DATE'].value);
const endDate = new Date(record['fc_DATE_0'].value);
const diffTime = Math.abs(endDate - startDate);
const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24));

record['fc_NUMBER'].value = diffDays;

 

この関数は、二つの日付フィールドから日数差を計算し、結果をNumberフィールドに格納します。Math.abs()を使用することで、日付の入力順序に関わらず正確な日数を得られます。
プログラミングの学習過程は、まるで筋トレのようです。
両者とも、継続的な努力と自己管理が重要です。
日々の筋トレで体を鍛えるように、プログラミングでは論理的思考力と問題解決能力を鍛えていきます。
これからも、日々の小さな進歩を積み重ね、着実にスキルアップを図っていきます。

JavaScriptを活用したノーコードアプリのカスタマイズに挑戦!経験から得た学びと成長 No.5

前回の投稿では、ノーコードアプリのカスタマイズに挑戦し、フィールド値が全角でなければエラーにする実装を行う関数を実装しました。
今回はその続編として、大文字を小文字に変換する実装について見ていきます。
コードの一部をシェアします。

// singleLineTextFieldの値を小文字に変換
if (record[singleLineTextField] && record[singleLineTextField].value) {
record[singleLineTextField].value = record[singleLineTextField].value.toLowerCase();
}


ユーザーが正しい情報を入力するためには、入力されたデータの正確性を確認することが不可欠です。
この関数を利用することで、ユーザーが大文字で入力した場合でも、常に小文字で処理されるため、データの一貫性を保つことができます。

筋トレと同様に、今後も一つ一つの課題と向き合いながら、積み上げていきます。




JavaScriptを活用したノーコードアプリのカスタマイズに挑戦!経験から得た学びと成長 No.4

前回の投稿では、ノーコードアプリのカスタマイズに挑戦し、メールアドレス形式のチェックを行うJavaScript関数を実装しました。
今回はその続編として、フィールド値が全角でなければエラーにする実装について見ていきます。コードの一部をシェアします。

 

// フィールド値が全角文字のみかチェックする関数
const containsHalfWidth = (value) => {
  // 半角文字の正規表現(制御文字を除く半角文字)
  const halfWidthRegex = /[\u0020-\u007E\uFF61-\uFF9F]/;
  return halfWidthRegex.test(value);
};

 

ユーザーが正しい情報を入力するためには、入力されたデータの正確性を確認することが不可欠です。この関数を利用することで、ユーザーが全角文字を入力しているかどうかを確認できます。


筋トレと同様に、今後も一つ一つの課題と向き合いながら、積み上げていきます。