1
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

【Microsoft Lists】ビューからリストアイテム更新をする

Last updated at Posted at 2021-11-25

ビューからリストアイテム更新をする

2021/12/08 日付とユーザーの列を空白指定することでクリア出来るようになったので修正。

[グリッドビューでの編集] を使用せずに、ビューから直接リストアイテムの値を更新します。

customRowActionSetValue.gif

CheckedDate 列 (日付と時刻)

チェックボックスをクリックした際に、日付とユーザーを設定します。

  • customRowActionsetValue を使用します。
  • CheckedDate 列に @now (現在日付) を設定します。
  • Checker 列に @me (サインインしているユーザー) を設定します。
  • inlineEditField を指定して、直接編集できるようにします。
CheckedDate
{
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
  "elmType": "div",
  "style": {
    "box-sizing": "border-box",
    "padding": "0 4px",
    "margin": "0"
  },
  "children": [
    {
      "elmType": "div",
      "style": {
        "display": "=if(@currentField, 'inherit', 'none')",
        "font-size": "16px",
        "padding": "0 2px",
        "font-weight": "bold"
      },
      "attributes": {
        "iconName": "CheckboxComposite",
        "class": "sp-css-color-MintGreenFont"
      },
      "customRowAction": {
        "action": "setValue",
        "actionInput": {
          "CheckedDate": "",
          "Checker": ""
        }
      }
    },
    {
      "elmType": "div",
      "style": {
        "cursor": "pointer",
        "display": "=if(@currentField, 'none', 'inherit')",
        "font-size": "16px",
        "padding": "0 2px",
        "font-weight": "bold"
      },
      "attributes": {
        "iconName": "Checkbox",
        "class": "sp-css-color-CoralFont"
      },
      "customRowAction": {
        "action": "setValue",
        "actionInput": {
          "CheckedDate": "@now",
          "Checker": "@me"
        }
      }
    },
    {
      "elmType": "div",
      "style": {
        "flex-wrap": "wrap"
      },
      "children": [
        {
          "elmType": "span",
          "style": {
            "padding": "0 4px",
            "font-weight": "bold"
          },
          "txtContent": "=if(@currentField, '確認済', '未確認')",
          "attributes": {
            "class": "=if(@currentField, 'sp-css-color-MintGreenFont', 'sp-css-color-CoralFont')"
          }
        },
        {
          "elmType": "span",
          "txtContent": "@currentField",
          "inlineEditField": "@currentField",
          "style": {
            "cursor": "pointer",
            "white-space": "nowrap",
            "padding": "0 2px",
            "--inline-editor-border-color": "green",
            "--inline-editor-border-width": "1px",
            "--inline-editor-border-style": "dotted",
            "--inline-editor-border-radius": "4px"
          },
          "attributes": {
            "class": "=if(@currentField, 'sp-css-color-MintGreenFont', 'sp-css-color-CoralFont')"
          }
        }
      ]
    }
  ]
}

Checker 列 (ユーザーまたはグループ)

CheckedDate 列 のチェックボックスをクリックした際に、サインインしているユーザーが設定されます。

  • inlineEditField を指定して、直接編集できるようにします。
Checker
{
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
  "elmType": "div",
  "txtContent": "@currentField.title",
  "inlineEditField": "@currentField",
  "style": {
    "cursor": "pointer",
    "border": "#ddd 1px solid",
    "--inline-editor-border-color": "green",
    "--inline-editor-border-width": "1px",
    "--inline-editor-border-style": "dotted",
    "--inline-editor-border-radius": "4px"
  }
}

参考サイト

1
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?