---
sourceDocument: オーストラリア API リファレンス
sourceDocumentLink: https://servicenow-prod.fluidtopics.net/r/ja-JP/api-reference

 Release :

    - australia

ft:locale :

    - ja-JP

ft:publication_title :

    - オーストラリア API リファレンス

ft:clusterId :

    - crapiref

bundleId :

    - crapiref

workflow :

    - Creator


---

# クライアントサイドスクリプトのユースケース

# クライアントサイドスクリプトのユースケース {#ariaid-title1}

* リリースバージョン: Australia
* 
* 更新日 2026年03月12日
* 
* ![](https://www.servicenow.com/docs/portal-asset/ico-clock) 所要時間：18分

クライアントサイドスクリプトのユースケースには、フィールドメッセージの表示、フォームの色の変更、フィールドの追加、UI ルーティングアクションの作成などがあります。

## サービスカタログのチェックアウトへのフィールドの追加 {#ariaid-title2}

これは、カート以外のレイアウトマクロを使用して、\[要求元：\] フィールドの下のチェックアウトに \[会社 (Company)\] フィールドを追加する例です。つまり、glide.sc.use_cart_layouts は <kbd class="ph userinput">false</kbd>です。

### 始める前に

必要なロール：admin

### このタスクについて

このフィールドは、指定された値をサービスカタログ要求の \[会社 \] フィールドに渡します。  
この例では、以下を前提としています。

* 2 ステップチェックアウトを使用しているインスタンス。2 ステップチェックアウトが有効になっていない場合は、開始する前に有効にしてください。詳細については、「[Service Catalog checkout models](https://www.servicenow.com/docs/access?context=c_EnableATwoStepCheckout&version=australia&pubname=australia-servicenow-platform&ft:locale=en-US)」を参照してください。
* この例では、サービスカタログ要求フォームの \[会社\] フィールドに値を入力します。フィールドがフォームに表示されない場合は、開始する前にフォームを構成します。手順については、「[Personalize a form](https://www.servicenow.com/docs/access?context=t_PersonalizeAForm&version=australia&pubname=australia-platform-user-interface&ft:locale=en-US)」を参照してください。

### 手順

1. \[システム UI\] \> \[UI マクロ\] に移動し、\[servicecatalog_cart_template\] を選択します。
2. 非表示の変数が宣言されている箇所を見つけて、次の行を追加します。  

       <input type="HIDDEN" name="cart_id" id="cart_id" value="$[sc_cart.sys_id]" />

3. 要求元コードを生成する次のコードを探します。  

       <tr class="header">
       <td width = "30%">
         ${gs.getMessage('Requested for')}:
         </td>
         <td width="70%">
           <label for="requestor_location">${gs.getMessage('Deliver to')}:</label>
         </td>
       </tr>
       <tr><td>$[SP]</td> 
       </tr>
         <tr><td valign="top">
           <j2:if test="$[jvar_can_delta_rf == false]">
             $[sc_cart.requested_for.getDisplayValue()]
           </j2:if>
           <j2:if test="$[jvar_can_delta_rf != false]">
             <g2:catalog_requested_for />
           </j2:if>
         </td>
         <td>
           <textarea id="requestor_location" style="width:100%" rows="4"       name="requestor_location" wrap="soft" onChange="catDeliveryAddress('$[sc_cart.sys_id]', 'requestor_location');"> 
             $[sc_cart.delivery_address]
           </textarea>
         </td>
       </tr>
       <tr>
         <td>$[SP]</td>
       </tr>

4. その後、次のコードを追加します。  

       <tr class="header">
         <td colspan="2">Company</td>
       </tr>
       <tr>
         <td>$[SP]</td>
       </tr>
       <tr>
         <td colspan="2">
           <g2:ui_reference name="core_company" table="core_company" onchange="setCartValue()"/>
         </td>
       </tr>
       <tr>
         <td>$[SP]</td>
       </tr>

   注:  
   `ui_reference` マクロは参照フィールドを定義します。さまざまなフィールドタイプにいくつかのマクロがあります。これらのフィールドタイプの例は、\[システム UI\] -\> \[UI マクロ\]で確認できます。これらのマクロは先頭が「` ui_`」で始まります。この例では、作成される参照フィールドの名前は core_company です。詳細については、「[UI マクロ](https://servicenow-prod.fluidtopics.net/Mr675lXi8W2G5FeUekvQUQ#c_UIMacros "UI マクロは、アドミニストレーターがユーザーインターフェイスに追加できる個別のスクリプト化されたコンポーネントです。")」を参照してください。
5. \[システム UI\] \> \[UI ページ\] に移動し、\[servicecatalog_checkout_one\] UI ページを選択します。
6. 次のスクリプトを \[クライアントスクリプト\] フィールドに追加します。  

       function setCartValue() { 
         var newField = gel('core_company'); 
         var myCart = gel('cart_id'); 
         var cart_item = new GlideRecord('sc_cart_item');
         cart_item.addQuery('cart', myCart.value);
         cart_item.query(); 
         if(cart_item.next()) {
           cart_item.hints = "<hints><entry key='sysparm_processing_hint' value='setfield:request.company=" + newField.value + "'/></hints>";
           cart_item.update(); 
         } 
       }

   この例では、参照フィールドは core_company と呼ばれ、要求に応じて入力されるフィールドは company です。異なるフィールドを使用する場合：
   * 次の行を探します。`var company = gel('core_company');`。次に、core_company をチェックアウトのフィールドの名前に置き換えます。
   * 先頭が「`cart_item.hints`」で始まる行で、「`request.company`」を要求チケットに応じて入力されるフィールドの名前に置き換えます。ここで、「`request`」は生成される要求であり、「`company`」はフィールドの名前です。

   {#t_AddFldSrvcCatCkout__ul_llx_2ln_kyb}

   アイテムが注文されると、\[会社\] フィールドが \[カタログ \] フォームに表示されます。

## オートフィル機能の追加 {#ariaid-title3}

オートフィル機能の追加は、インシデントテンプレート、自動アサイン、クイックコール、コールスクリプト、または自動入力とも呼ばれます。  
選択したサブカテゴリに基づいて \[簡単な説明\] フィールドを自動入力するには:

1. ルックアップテーブルを作成します。
2. キーフィールドの \[サブカテゴリ\] に入力します。
3. オートフィルされたフィールドの \[簡単な説明\] に入力します。
{#c_AddAutofillFunctionality__ol_tfw_52y_q2c}  

    function onChange(control, oldValue, newValue, isLoading) { 
      if (isLoading) { return; } 
      var newrec = gel('sys_row');
      //Check if new record
      if (newrec.value == -1) { 
        var lookup = new GlideRecord('u_short_desc_lookup'); 
        lookup.addQuery('u_subcategory', g_form.getValue('subcategory'));
        lookup.query();
        var temp; //temp var - reusable
        if (lookup.next()) {
          temp = lookup.u_short_description;
            if (null != temp) { //Set the form value from lookup if there is a lookup value
              g_form.setValue('short_description', temp); } 
            else {
              g_form.setValue('short_description', "" ); } } 
       else { 
         //If a lookup record does not exist based on lookup.addQuery 
         //Then set to UNDEFINED or NULL depending on type
          g_form.setValue('short_description', ""); } } 
    }

多くのフィールドに値を入力したり、コールスクリプトの質問を \[コメント\] フィールドに取り込んだりして、コールセンターの担当者が適切な情報を収集して技術者に伝えることができます。

パスワードリセットするフィールドの設定
:
    ルックアップテーブルに、次のキーとオートフィル設定を持つレコードがあります:

    * サブカテゴリ = パスワード
    * 簡単な説明 = パスワードリセット
    {#c_AddAutofillFunctionality__ul_dv3_phy_q2c}
:
    クライアントスクリプト設定：

    * タイプ = 変更時
    * テーブル名 = インシデント
    * フィールド名 = サブカテゴリ
    {#c_AddAutofillFunctionality__ul_rwq_vfy_q2c}

:   ユーザーがインシデントフォームで パスワード のサブカテゴリを選択すると、クライアントスクリプトは一致するレコードを検索し、簡単な説明を パスワードリセットに設定します。

## ステータス変更時のフォームの色の変更 {#ariaid-title4}

ステータス変更時にフォームのフォームフィールドの色を変更します。スクリプトは、HTML DOM を介してアクセス可能なページ上のオブジェクトのプロパティを調整するために、簡単に変更できます。  
警告:  
ここに記載されているカスタマイズは、特定のインスタンスで使用するために開発されたものであり、Now Support ではサポートされていません。この方法は現状のまま提供され、実装の前に完全にテストする必要があります。このカスタマイズに関するすべての質問およびコメントは、コミュニティ[フォーラム](http://community.service-now.com/)に投稿してください。

名前：ステータス変更時のフォームの色の変更

タイプ:クライアントスクリプト

説明：ステータス変更時にフォームのフォームフィールドの色を変更します。スクリプトは、HTML DOM を介してアクセス可能なページ上のオブジェクトのプロパティを調整するために、簡単に変更できます。  
Script (スクリプト)：

    function onChange(control, oldValue, newValue, isLoading) { 
      var elementID = gel("incident.priority");
        switch(newValue) { 
          case "1": elementID.style.backgroundColor = "red"; break; 
          case "2": elementID.style.backgroundColor = "tomato"; break;
          case "3": elementID.style.backgroundColor = "orange"; break;
          case "4": elementID.style.backgroundColor = "yellow"; break;
          case "5": elementID.style.backgroundColor = "green"; break; 
          default: elementID.style.backgroundColor = "white"; break; } }

## UI ルーティングアクションの作成 {#ariaid-title5}

このソリューションを使用すると、インシデントまたは要求アイテムのどちらであるかを知らなくても、サービスデスクでレコードを作成できます。その後、サービスデスクはレコードを適切なテーブルにルーティングできます。

### 始める前に

必要なロール: admin

### 手順

1. `タスク`テーブルを拡張する新しいテーブルを作成します (「新規コール」など)。
2. 新しい新規コールレコードを作成するモジュールを作成します。
3. 新規コールテーブルに必要なフィールドを作成します。  
   新規コールをインシデントまたは要求アイテムのどちらにルーティングするかを決定するために必要なフィールドのみが必要とされます。フォームに、インシデントまたは要求アイテムに渡すフィールドが含まれていることを確認します。この例では、フォームに次のものが作成されます。
   * 要求元 (参照)
   * 場所 (参照)
   * コールタイプ (インシデントと要求の 2 つの値を持つ選択肢)
   * 要求アイテム (`sc_cat_item` アイテムテーブルへの参照)
4. いくつかの UI ポリシーを追加して、いくつかのフィールドを必須に設定し、\[コールタイプ\] の選択に基づいて \[要求アイテム\] フィールドを非表示にします。
5. 不要なボタンや機能をフォームから削除します。
6. 新しい UI アクションボタンを作成します。  
   このボタンにより、ユーザーはインシデントまたは要求にリダイレクトされます。また、インシデントレコードが作成され、インシデントと要求アイテムフォームに値がコピーされます。  

       var reqItem = current.u_item;
       var requestedFor = current.u_requested_for;
       var location = current.location;

       if(current.u_incident_request == 'Incident'){
         //Create a new incident record and redirect to the new incident
         var rec = new GlideRecord('incident');
         rec.initialize();
         rec.caller_id = requestedFor;
         rec.location = location;
         rec.insert();
         action.setRedirectURL(rec);
       }

       if(current.u_incident_request == 'Request'){
         //Build the url and route the user to the request item
         var url = '';
         if(current.u_item.sys_class_name == 'sc_cat_item_guide'){
           url = 'com.glideapp.servicecatalog_cat_item_guide_view.do?sysparm_initial=true&sysparm_guide=' + 
             reqItem + '&sysparm_user=' + requestedFor + '&sysparm_location=' + location;
         }
         else{
           url = 'com.glideapp.servicecatalog_cat_item_view.do?sysparm_id=' + reqItem + '&sysparm_user=' +  
             requestedFor + '&sysparm_location=' + location;
         }
         action.setRedirectURL(url);
       }

7. 前の例の \[ルーティング\] ボタンは、URL の \[要求元\] と \[場所\] の値を \[要求アイテム\] フォームに渡します。  
   次のクライアントスクリプトを使用して、これらの値をマッピングするアイテム、レコードプロデューサー、または注文ガイドに <var class="keyword varname">requested_for</var> および <var class="keyword varname">location</var> と呼ばれる変数があることを確認します。URL の長さには制限があるため、渡すことができる情報の量には制限があります。この方法を使用して長いテキストフィールドからの情報は送信しないでください。  

       function onLoad() {
         var url = document.location.toString();
         var userKey = 'sysparm_user=';
         var locKey = 'sysparm_location=';
         var userPosition = url.indexOf(userKey);
         var locPosition = url.indexOf(locKey)
         if (userPosition != -1) {
           var user = url.substr(userPosition+userKey.length, 32);
           g_form.setValue('requested_for', user);
         }
         if (locPosition != -1) {
           var loc = url.substr(locPosition+locKey.length, 32);
           g_form.setValue('location', loc);
         }
       }

## フィールドメッセージの表示 {#ariaid-title6}

JavaScript alert() を使用する代わりに、見た目をすっきりさせるために、フォーム自体にエラーを表示できます。メソッド showFieldMsg() および hideFieldMsg() を使用して、フィールド自体のすぐ下にメッセージを表示できます。
showFieldMsg と hideFieldMsg は、<var class="keyword varname">g_form</var> オブジェクトで使用できるメソッドです。

これらのメソッドは、レコード (インシデント、問題、および変更フォーム) のフォームビューを変更するために使用されます。これらのメソッドは他のクライアントスクリプトでも使用できますが、期待どおりに機能するかどうかを確認するためにテストする必要があります。

ロード時にフォームにフィールドメッセージが表示されると、フォームがスクロールしてフィールドメッセージが表示されます。フィールドメッセージが画面の外にあったためにユーザーが見落とすということがないようにします。

グローバルプロパティ <var class="keyword varname">glide.ui.scroll_to_message_field</var> は、フォームフィールドが画面外にある場合の自動メッセージのスクロール (フォームからコントロールまたはフィールドまでスクロール) を制御します。
{#r_DisplayFieldMessages__table_bgp_bwq_bp__entry__3}

| メソッドの詳細 | パラメーター | 例 |
|-|-|-|
| showFieldMsg(input, message, type, \[scrollform\]) | * 入力：フィールドまたはコントロールの名前 * メッセージ：表示するメッセージ * タイプ：「情報」、「エラー」、または「警告」。指定しない場合のデフォルトは「情報」 * スクロールフォーム：(オプション) フィールドメッセージが画面外にスクロールしないようにするには、scrollForm を false に設定します | エラーメッセージ g_form.showFieldMsg('impact','Low impact not allowed with High priority','error'); ![低影響度は、高優先度のメッセージでは許可されません。]() 情報メッセージ g_form.showFieldMsg('impact', 'Low impact response time can be one week','info'); //or this defaults to info type //g_form.showFieldMsg('impact', 'Low impact response time can be one week'); ![低影響度の応答時間は 1 週間のメッセージにすることができます。]() |
| hideFieldMsg(input) | * 入力：フィールドまたはコントロールの名前 * clearAll：(オプション) すべてのメッセージをクリアするかどうかを示すブールパラメーター。true の場合、フィールドのすべてのメッセージがクリアされます。false または空の場合、最初のメッセージのみが削除されます | メッセージの削除 //this will clear the first message printed to the field g_form.hideFieldMsg('impact'); |
[表 : 1. メソッドの詳細]

{#r_DisplayFieldMessages__table_bgp_bwq_bp}

### 従来のサポート

showErrorBox() メソッドと hideErrorBox() メソッドは推奨されません。

## UI アクションでのクライアントおよびサーバーコードの使用 {#ariaid-title7}

スクリプトを使用して、サーバー側でレコードを更新する前に、クライアント側で UI アクションがクリックされたときに入力を検証できます。ユーザーは、必須フィールドを検証してレコードを更新するのにボタンを 2 回クリックする必要はありません。
スクリプトはクライアント側の検証のためにクライアント関数を呼び出し、合格すると UI アクションがタスクを完了します。`onclick なしで実行されるコード`のステートメントは 、クライアント関数が実行されなくなるまでサーバー側の関数が実行されないようにします。成功すると、サーバー側の関数が実行され、レコードが更新されます。

    // Client-side onclick function
    function resolveIncident() {
      // Set the 'Incident state' and 'State' values to 'Resolved', and display mandatory fields
      g_form.setValue('incident_state', 6);
      g_form.setValue('state', 6);
      g_form.setValue('resolved_by', g_user.userID);

      // Call the UI action and skip the 'onclick' function
      gsftSubmit(null, g_form.getFormElement(), 'resolve_incident'); //MUST call the 'Action name' set in this UI Action
    }

    // Code that runs without 'onclick'
    // Ensure call to server-side function with no browser errors
    if (typeof window == 'undefined')
      serverResolve();

    // Server-side function
    function serverResolve() {
      current.incident_state = IncidentState.RESOLVED;
      current.state = IncidentState.RESOLVED;
      current.resolved_by = gs.getUserID();
      current.update();
    }

### gsftSubmit(文字列 control, オブジェクト form, 文字列 action_name) {#using-client-server-code-ui-action__section_rkc_v3f_lwb}

必須フィールドを確認し、onSubmit() クライアントスクリプトを実行した後、ユーザーが UI アクションをクリックした場合と同様にフォームを送信します。単一の UI アクションでクライアント側のコードとサーバー側のコードを呼び出すことができます。
{#using-client-server-code-ui-action__table_lmr_qwr_fz__entry__3}

| 名前 | タイプ | 説明 |
|-|-|-|
| コントロール | 文字列 | ユーザーのクリックをシミュレートするフォームボタンの名前。それ以外の場合は `null` を使用します。 |
| フォーム | オブジェクト | オプション。送信された入力を含むフォーム要素。この値を取得するには、g_form.getFormElement() メソッドを呼び出します。 |
| action_name | 文字列 | アクション名。この値は、UI アクション \[sys_ui_action\] テーブルにリストされているレコードで提供されます。 たとえば、`'resolve_incident'` は、インシデント \[incident\] テーブルの \[解決\] ボタンのアクション名です。 |
[表 : 2. パラメーター]

{#using-client-server-code-ui-action__table_lmr_qwr_fz}
**関連概念**   

* [GlideUser - クライアント](https://servicenow-prod.fluidtopics.net/Hi9g4UUat02YH9yYxRphhg#c_GlideUserAPI "GlideUser API は、現在のユーザーと現在のユーザーロールに関する情報にアクセスするメソッドを提供します。この API を使用すると、ユーザー情報を取得するために低速の GlideRecord クエリを使用する必要がなくなります。")  
**関連資料**   

* [GlideForm - getFormElement()](https://servicenow-prod.fluidtopics.net/TOJ5TIb2BhZv_76tquWNCA#r_GlideFormGetFormElement "フォームの HTML 要素を返します。")
* [スコープ付き GlideSystem - eventQueue(文字列名, オブジェクトインスタンス, 文字列パラメーター 1, 文字列パラメーター 2, 文字列キュー)](https://servicenow-prod.fluidtopics.net/vgbDjDuCHBi~EUX~Mm5rTQ#r_ScopedGlideSystemEventQueue_String_Object_String_String_String "イベントマネージャーのイベントをキューに入れます。")  
**関連情報**   

* [Defining UI actions](https://www.servicenow.com/docs/access?context=c_UIActions&version=australia&pubname=australia-platform-administration&ft:locale=en-US)