# How to build a customization for a end-user to create a new record based on a Lookup field?

**URL:** <https://forum.kintone.dev/t/how-to-build-a-customization-for-a-end-user-to-create-a-new-record-based-on-a-lookup-field/486>\
**Category:** General\
**Created:** [May 26, 2022, 3:40pm UTC](https://forum.kintone.dev/t/how-to-build-a-customization-for-a-end-user-to-create-a-new-record-based-on-a-lookup-field/486 "2022-05-26T15:40:53Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![Mpumuro](https://yyz1.discourse-cdn.com/flex035/user_avatar/forum.kintone.dev/mpumuro/32/702_2.png) [@Mpumuro](https://forum.kintone.dev/u/Mpumuro)\
**Post date:** [May 26, 2022, 3:40pm UTC](https://forum.kintone.dev/t/how-to-build-a-customization-for-a-end-user-to-create-a-new-record-based-on-a-lookup-field/486/1 "2022-05-26T15:40:53Z")

</div>

I have the challenge about lookup , how could i create new record in lookup field when the record is not existed in referenced field???

---

<div class="post-metadata">

**Author:** ![Genji](https://yyz1.discourse-cdn.com/flex035/user_avatar/forum.kintone.dev/genji/32/646_2.png) [@Genji](https://forum.kintone.dev/u/Genji)\
**Post date:** [May 27, 2022, 6:16am UTC](https://forum.kintone.dev/t/how-to-build-a-customization-for-a-end-user-to-create-a-new-record-based-on-a-lookup-field/486/2 "2022-05-27T06:16:28Z")

</div>

Hello @Mpumuro ,

Thank you for posting your question on our Kintone Developer Forum.

To better help you out, please provide more information regarding your current situation, question, and desired outcome.

If you want to learn more about the Kintone’s lookup field, check out these articles:

- [Using Lookup](https://get.kintone.help/k/en/user/app_settings/form/lookup/use_lookup.html)
- [Configuring a “Lookup” Field](https://get.kintone.help/k/en/user/app_settings/form/lookup/set_lookup.html)

---

<div class="post-metadata">

**Author:** ![Mpumuro](https://yyz1.discourse-cdn.com/flex035/user_avatar/forum.kintone.dev/mpumuro/32/702_2.png) [@Mpumuro](https://forum.kintone.dev/u/Mpumuro)\
**Post date:** [May 27, 2022, 6:30am UTC](https://forum.kintone.dev/t/how-to-build-a-customization-for-a-end-user-to-create-a-new-record-based-on-a-lookup-field/486/3 "2022-05-27T06:30:20Z")

</div>

Hello there  
I do want to customize lookup field to end user can create new record without setting from referanced record

---

<div class="post-metadata">

**Author:** ![Sean\_Tcbn](https://yyz1.discourse-cdn.com/flex035/user_avatar/forum.kintone.dev/sean_tcbn/32/68_2.png) [@Sean\_Tcbn](https://forum.kintone.dev/u/Sean_Tcbn)\
**Post date:** [May 27, 2022, 8:15pm UTC](https://forum.kintone.dev/t/how-to-build-a-customization-for-a-end-user-to-create-a-new-record-based-on-a-lookup-field/486/4 "2022-05-27T20:15:09Z")

</div>

Hi @Mpumuro,

I am not sure if this fits your needs, but I have found a similar sample on a Japanese page.

The environment is “TypeScript.”

The following code describes the process of unmasking a field in the change event handler of a Check box field.

When the record edit screen is displayed, the mask is returned by determining the check status of the check box, but it might be better to return it in the event before the record is saved.  
The information on changed fields can be retrieved via event.changes.field.

The sample app has a Check box field, a Lookup field, and a Text field(address) as the “Field Mappings” of the Lookup field.

```javascript
'use strict';
interface KintneEvent {
  record: kintone.types.SavedFields;
  changes: any;
}
kintone.events.on(['app.record.edit.change.checkbox'], (event: KintneEvent) => {
  const checkbox = event.changes.field;
  if(checkbox.value.length !== 0) {
    event.record.address.disabled = false;
  } else {
    event.record.address.disabled = true;
  }
  return event;
});
kintone.events.on(['app.record.edit.show'], (event: KintneEvent) => {
  const checkbox = event.record.checkbox;
  if(checkbox.value.length !== 0) {
    event.record.address.disabled = false;
  }
  return event;
});

```

Here are some reference articles for this process;

Record Edit Event:

> **[Record Edit Event](https://kintone.dev/en/docs/kintone/js-api/events/record-edit-event/)**
>
> Events triggered in the record edit page.

Fields That Can Be Specified for “Field Mappings”:  
[https://get.kintone.help/k/en/id/040546.html](https://get.kintone.help/k/en/id/040546.html)

I hope this helps you in some way.

---

<div class="post-metadata">

**Author:** ![Mpumuro](https://yyz1.discourse-cdn.com/flex035/user_avatar/forum.kintone.dev/mpumuro/32/702_2.png) [@Mpumuro](https://forum.kintone.dev/u/Mpumuro)\
**Post date:** [May 28, 2022, 7:05am UTC](https://forum.kintone.dev/t/how-to-build-a-customization-for-a-end-user-to-create-a-new-record-based-on-a-lookup-field/486/5 "2022-05-28T07:05:14Z")

</div>

Thanks let me check if it will help me

---

<div class="post-metadata">

**Author:** ![Mpumuro](https://yyz1.discourse-cdn.com/flex035/user_avatar/forum.kintone.dev/mpumuro/32/702_2.png) [@Mpumuro](https://forum.kintone.dev/u/Mpumuro)\
**Post date:** [May 28, 2022, 7:35am UTC](https://forum.kintone.dev/t/how-to-build-a-customization-for-a-end-user-to-create-a-new-record-based-on-a-lookup-field/486/6 "2022-05-28T07:35:04Z")

</div>

Hello there,  
Does kintone keyword supported in Typescript?

---

<div class="post-metadata">

**Author:** ![Genji](https://yyz1.discourse-cdn.com/flex035/user_avatar/forum.kintone.dev/genji/32/646_2.png) [@Genji](https://forum.kintone.dev/u/Genji)\
**Post date:** [May 28, 2022, 10:41pm UTC](https://forum.kintone.dev/t/how-to-build-a-customization-for-a-end-user-to-create-a-new-record-based-on-a-lookup-field/486/7 "2022-05-28T22:41:52Z")

</div>

Kintone does not directly support customizations written in TypeScript.

Instead, you would need to use a module bundler such as [Webpack](https://webpack.js.org/) or [VITE](https://vitejs.dev/) to convert your TypeScript into a browser-supported JavaScript build. Then you can upload that into Kintone, just like regular JavaScript customization.

If it is your first time with TypeScript and module bundles, a simple alternative would be using an online TypeScript to Vanilla JS (plain JS) converter such as [this one](https://extendsclass.com/typescript-to-javascript.html).

Or you can check out our latest workshop, where we used VITE and TypeScript to build a simple Kintone Customization.

Kintone x Medium Workshop

[![](https://canada1.discourse-cdn.com/flex035/uploads/kintone/original/1X/092c235a4bfec84537f35564440a95bcf3a6aa31.jpeg "Kintone x Medium Publishing Workflow Workshop") ](https://www.youtube.com/watch?v=Qlx411j3gag)
