question Re: Automatically populate the Hiragana reading based on the Japanese Kanji input in the form/table in Service Operations Workspace forum

Automatically populate the Hiragana reading based on the Japanese Kanji input in the form/table

system — Wed, 18 Jun 2025 04:44:01 GMT

workspace "When a user enters Japanese Kanji in a field (e.g., 'u_jp'), automatically convert and display the corresponding Hiragana in another field (e.g., 'u_jp1')."

Re: Automatically populate the Hiragana reading based on the Japanese Kanji input in the form/table

YaswanthKurre — Wed, 18 Jun 2025 04:35:48 GMT

Hi @system ,

Create a onChange Client Script on u_jp and call a script include for api call to kanji to hiragana library and populate it in u_jp1.

Mark this as helpful and correct if this answers your question.

Thanks,

Yaswanth

Re: Automatically populate the Hiragana reading based on the Japanese Kanji input in the form/table

system — Wed, 18 Jun 2025 04:42:43 GMT

The method using Client Script + UI Script works on the U16 classic UI screen, but not in Workspace. So I want to know if there's a way to implement it in Workspace.

Re: Automatically populate the Hiragana reading based on the Japanese Kanji input in the form/table

Ankur Bawiskar — Wed, 18 Jun 2025 04:44:09 GMT

@system

sorry your requirement is not clear.

please share the screenshots.

If my response helped please mark it correct and close the thread so that it benefits future readers.

Re: Automatically populate the Hiragana reading based on the Japanese Kanji input in the form/table

system — Wed, 18 Jun 2025 04:52:39 GMT

Hi Ankur,

Thank you for your response.

Let me clarify my requirement and current situation:

Requirement:
In a Workspace table form, when I input Japanese kanji into the Name field, I want the corresponding Hiragana Name field to automatically show the Hiragana reading of the kanji input.

Current situation:
I have successfully implemented this functionality on the U16 Classic UI using Client Script + UI Script with AutoKana.js.

UI Script: I included AutoKana.js from https://arts-factory.net/autokana/
Client Script: I set up the onLoad script to enable the kana generation

However, this approach does not work in Workspace, since UI Scripts and traditional Client Scripts are not supported in Configurable Workspace.

I would like to know if there is any recommended way to implement this feature in Workspace.

Thank you in advance.

Best regards,

Re: Automatically populate the Hiragana reading based on the Japanese Kanji input in the form/table

YaswanthKurre — Wed, 18 Jun 2025 04:56:23 GMT

Hi @system ,

You should use client script + script include ( GlideAjax call) this should work in both ui16 and workspace.

Thanks,

Yaswanth

Re: Automatically populate the Hiragana reading based on the Japanese Kanji input in the form/table

system — Wed, 18 Jun 2025 05:24:33 GMT

Hi,

I understand the example using a dictionary like:

javascript

コピーする編集する

var dict = { "山田": "やまだ", "太郎": "たろう" };

However, I can't possibly include all Japanese kanji manually.
Is there any other way to convert kanji to hiragana dynamically on the server side (e.g. via Script Include)?
Maybe using an external API?

Thanks!Is it possible without an external API?

Re: Automatically populate the Hiragana reading based on the Japanese Kanji input in the form/table

Ankur Bawiskar — Wed, 18 Jun 2025 05:31:31 GMT

@system

can you share how it's handled currently for native?

with that in mind may be we can propose something for workspace.

If my response helped please mark it correct and close the thread so that it benefits future readers.

Re: Automatically populate the Hiragana reading based on the Japanese Kanji input in the form/table

system — Wed, 18 Jun 2025 05:40:16 GMT

This is my setting‘
UI Script

UI Type'desktop

// Based on the AutoRuby library created by:

// Permission is hereby granted, free of charge, to any person obtaining

// a copy of this software and associated documentation files (the

// "Software"), to deal in the Software without restriction, including

// without limitation the rights to use, copy, modify, merge, publish,

// distribute, sublicense, and/or sell copies of the Software, and to

// permit persons to whom the Software is furnished to do so, subject to

// the following conditions:

// The above copyright notice and this permission notice shall be

// included in all copies or substantial portions of the Software.

// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,

// EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF

// MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND

// NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE

// LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION

// OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION

// WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

(function ($) {

$.fn.autoKana = function (element1, element2, passedOptions) {

var options = $.extend(

{

'katakana': false

}, passedOptions);

var kana_extraction_pattern = new RegExp('[^ 　ぁあ-んー]', 'g');

var kana_compacting_pattern = new RegExp('[ぁぃぅぇぉっゃゅょ]', 'g');

var elName,

elKana,

active = false,

timer = null,

flagConvert = true,

input,

values,

ignoreString,

baseKana;

elName = $(element1);

elKana = $(element2);

active = true;

_stateClear();

elName.blur(_eventBlur);

elName.focus(_eventFocus);

elName.keydown(_eventKeyDown);

function start() {

active = true;

};

function stop() {

active = false;

};

function toggle(event) {

var ev = event || window.event;

if (event) {

var el = Event.element(event);

if (el.checked) {

active = true;

} else {

active = false;

}

} else {

active = !active;

}

};

function _checkConvert(new_values) {

if (!flagConvert) {

if (Math.abs(values.length - new_values.length) > 1) {

var tmp_values = new_values.join('').replace(kana_compacting_pattern, '').split('');

if (Math.abs(values.length - tmp_values.length) > 1) {

_stateConvert();

}

} else {

if (values.length == input.length && values.join('') != input) {

if (input.match(kana_extraction_pattern)) {

_stateConvert();

}

};

function _checkValue() {

var new_input, new_values;

new_input = elName.val()

if (new_input == '' && elKana.val() != '') {

_stateClear();

_setKana();

} else {

new_input = _removeString(new_input);

if (input == new_input) {

return;

} else {

input = new_input;

if (!flagConvert) {

new_values = new_input.replace(kana_extraction_pattern, '').split('');

_checkConvert(new_values);

_setKana(new_values);

}

};

function _clearInterval() {

clearInterval(timer);

};

function _eventBlur(event) {

_clearInterval();

};

function _eventFocus(event) {

_stateInput();

_setInterval();

};

function _eventKeyDown(event) {

if (flagConvert) {

_stateInput();

}

};

function _isHiragana(chara) {

return ((chara >= 12353 && chara <= 12435) || chara == 12445 || chara == 12446);

};

function _removeString(new_input) {

if (new_input.indexOf(ignoreString) !== -1) {

return new_input.replace(ignoreString, '');

} else {

var i, ignoreArray, inputArray;

ignoreArray = ignoreString.split('');

inputArray = new_input.split('');

for (i = 0; i < ignoreArray.length; i++) {

if (ignoreArray[i] == inputArray[i]) {

inputArray[i] = '';

}

return inputArray.join('');

}

};

function _setInterval() {

var self = this;

timer = setInterval(_checkValue, 30);

};

function _setKana(new_values) {

if (!flagConvert) {

if (new_values) {

values = new_values;

}

if (active) {

var _val = _toKatakana(baseKana + values.join(''));

elKana.val(_val).change();

}

};

function _stateClear() {

baseKana = '';

flagConvert = false;

ignoreString = '';

input = '';

values = [];

};

function _stateInput() {

baseKana = elKana.val();

flagConvert = false;

ignoreString = elName.val();

};

function _stateConvert() {

baseKana = baseKana + values.join('');

flagConvert = true;

values = [];

};

function _toKatakana(src) {

if (options.katakana) {

var c, i, str;

str = new String;

for (i = 0; i < src.length; i++) {

c = src.charCodeAt(i);

if (_isHiragana(c)) {

str += String.fromCharCode(c + 96);

} else {

str += src.charAt(i);

}

return str;

} else {

return src;

}

};

})(jQuery);

console.log(" autoKana UI Script loaded");

Client Script' Type onload ui Type all

function onLoad() {

setTimeout(function () {

if (typeof jQuery === 'undefined') {

return;

}

if (typeof jQuery.fn.autoKana === 'undefined') {

return;

}

const kanji = g_form.getControl('u_jp');

const kana = g_form.getControl('u_jp1');

if (!kanji || !kana) {

return;

}

jQuery.fn.autoKana(kanji, kana, {

katakana: false

});

}, 300);

}