Skip to content

D
Documentation Dokos
Switch branch/tag
Find file
Normal viewHistoryPermalink
how-to-improve-a-standard-control.html 43.5 KB
Newer Older
Charles-Henri Decultot's avatar
feat: Initial commit
766b0a31
 
Charles-Henri Decultot committed
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 
<!DOCTYPE html>
<html lang="en-US">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>How To Improve A Standard Control | Dooks</title>
    <meta name="description" content="Dooks">
    <link rel="icon" href="/logo.png">
  <link rel="manifest" href="/manifest.json">
  <meta name="theme-color" content="#3eaf7c">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <link rel="apple-touch-icon" href="/icons/apple-touch-icon-152x152.png">
  <link rel="mask-icon" href="/icons/safari-pinned-tab.svg" color="#3eaf7c">
  <meta name="msapplication-TileImage" content="/icons/msapplication-icon-144x144.png">
  <meta name="msapplication-TileColor" content="#000000">
    
    <link rel="preload" href="/assets/css/0.styles.cc25976c.css" as="style"><link rel="preload" href="/assets/js/app.bd423434.js" as="script"><link rel="preload" href="/assets/js/517.b6977b47.js" as="script"><link rel="prefetch" href="/assets/js/10.9da330c2.js"><link rel="prefetch" href="/assets/js/100.d27e0eb4.js"><link rel="prefetch" href="/assets/js/101.2f99ca22.js"><link rel="prefetch" href="/assets/js/102.2ec37122.js"><link rel="prefetch" href="/assets/js/103.4f3eaa12.js"><link rel="prefetch" href="/assets/js/104.ae05ae83.js"><link rel="prefetch" href="/assets/js/105.96cd3daf.js"><link rel="prefetch" href="/assets/js/106.5d18b2d8.js"><link rel="prefetch" href="/assets/js/107.56029933.js"><link rel="prefetch" href="/assets/js/108.3a52144d.js"><link rel="prefetch" href="/assets/js/109.0926c35e.js"><link rel="prefetch" href="/assets/js/11.0e48bb61.js"><link rel="prefetch" href="/assets/js/110.a666ad50.js"><link rel="prefetch" href="/assets/js/111.cf9adc27.js"><link rel="prefetch" href="/assets/js/112.88e28f01.js"><link rel="prefetch" href="/assets/js/113.7d577c38.js"><link rel="prefetch" href="/assets/js/114.012106b7.js"><link rel="prefetch" href="/assets/js/115.740e853d.js"><link rel="prefetch" href="/assets/js/116.3c3bf759.js"><link rel="prefetch" href="/assets/js/117.32e61cb1.js"><link rel="prefetch" href="/assets/js/118.71246683.js"><link rel="prefetch" href="/assets/js/119.e5c6a294.js"><link rel="prefetch" href="/assets/js/12.de82d151.js"><link rel="prefetch" href="/assets/js/120.ef6f188a.js"><link rel="prefetch" href="/assets/js/121.937e3bcd.js"><link rel="prefetch" href="/assets/js/122.8db73ac4.js"><link rel="prefetch" href="/assets/js/123.4eac56a7.js"><link rel="prefetch" href="/assets/js/124.b5b094a1.js"><link rel="prefetch" href="/assets/js/125.a637c09e.js"><link rel="prefetch" href="/assets/js/126.881821ae.js"><link rel="prefetch" href="/assets/js/127.898e5a16.js"><link rel="prefetch" href="/assets/js/128.f2d89fba.js"><link rel="prefetch" href="/assets/js/129.00fc26f3.js"><link rel="prefetch" href="/assets/js/13.7319765d.js"><link rel="prefetch" href="/assets/js/130.d5470aeb.js"><link rel="prefetch" href="/assets/js/131.ed21212d.js"><link rel="prefetch" href="/assets/js/132.f53593bc.js"><link rel="prefetch" href="/assets/js/133.e76cfeb5.js"><link rel="prefetch" href="/assets/js/134.8cb07121.js"><link rel="prefetch" href="/assets/js/135.f7f215bb.js"><link rel="prefetch" href="/assets/js/136.4071a54a.js"><link rel="prefetch" href="/assets/js/137.06e2249c.js"><link rel="prefetch" href="/assets/js/138.27a3c699.js"><link rel="prefetch" href="/assets/js/139.a31d502d.js"><link rel="prefetch" href="/assets/js/14.6bb70885.js"><link rel="prefetch" href="/assets/js/140.6d4e34ca.js"><link rel="prefetch" href="/assets/js/141.6b195874.js"><link rel="prefetch" href="/assets/js/142.acc0d646.js"><link rel="prefetch" href="/assets/js/143.c3269f01.js"><link rel="prefetch" href="/assets/js/144.b1834787.js"><link rel="prefetch" href="/assets/js/145.60ba3967.js"><link rel="prefetch" href="/assets/js/146.645b00fe.js"><link rel="prefetch" href="/assets/js/147.a7ad8d65.js"><link rel="prefetch" href="/assets/js/148.c5dfb25a.js"><link rel="prefetch" href="/assets/js/149.37e9cfd6.js"><link rel="prefetch" href="/assets/js/15.d5532964.js"><link rel="prefetch" href="/assets/js/150.3c249598.js"><link rel="prefetch" href="/assets/js/151.9744e2e2.js"><link rel="prefetch" href="/assets/js/152.8d958d5f.js"><link rel="prefetch" href="/assets/js/153.f2575667.js"><link rel="prefetch" href="/assets/js/154.67df61df.js"><link rel="prefetch" href="/assets/js/155.af6028d6.js"><link rel="prefetch" href="/assets/js/156.924bb436.js"><link rel="prefetch" href="/assets/js/157.65322bf6.js"><link rel="prefetch" href="/assets/js/158.3f375315.js"><link rel="prefetch" href="/assets/js/159.f1e350e4.js"><link rel="prefetch" href="/assets/js/16.9443565e.js"><link rel="prefetch" href="/assets/js/160.c8db8466.js"><link rel="prefetch" href="/assets/js/161.048d0bf2.js"><link rel="prefetch" href="/assets/js/162.8725e30b.js"><link rel="prefetch" href="/assets/js/163.a0f43c7a.js"><link rel="prefetch" href="/assets/js/164.487dfb90.js"><link rel="prefetch" href="/assets/js/165.6609561a.js"><link rel="prefetch" href="/assets/js/166.52a17497.js"><link rel="prefetch" href="/assets/js/167.d93d1ac0.js"><link rel="prefetch" href="/assets/js/168.b47c316a.js"><link rel="prefetch" href="/assets/js/169.3a0cb950.js"><link rel="prefetch" href="/assets/js/17.bb09db3c.js"><link rel="prefetch" href="/assets/js/170.393f2c4e.js"><link rel="prefetch" href="/assets/js/171.bb984cdc.js"><link rel="prefetch" href="/assets/js/172.2611b6e9.js"><link rel="prefetch" href="/assets/js/173.101f1543.js"><link rel="prefetch" href="/assets/js/174.8b633bd5.js"><link rel="prefetch" href="/assets/js/175.9225a70b.js"><link rel="prefetch" href="/assets/js/176.a488f0b1.js"><link rel="prefetch" href="/assets/js/177.28e10598.js"><link rel="prefetch" href="/assets/js/178.1c65976c.js"><link rel="prefetch" href="/assets/js/179.2ed7640c.js"><link rel="prefetch" href="/assets/js/18.310b7ff2.js"><link rel="prefetch" href="/assets/js/180.1a0495a5.js"><link rel="prefetch" href="/assets/js/181.6bf636f1.js"><link rel="prefetch" href="/assets/js/182.37efc90e.js"><link rel="prefetch" href="/assets/js/183.b17855b1.js"><link rel="prefetch" href="/assets/js/184.c109a665.js"><link rel="prefetch" href="/assets/js/185.b306e95b.js"><link rel="prefetch" href="/assets/js/186.6d108852.js"><link rel="prefetch" href="/assets/js/187.ab0225d6.js"><link rel="prefetch" href="/assets/js/188.27b7c075.js"><link rel="prefetch" href="/assets/js/189.898caf7c.js"><link rel="prefetch" href="/assets/js/19.15fbad8b.js"><link rel="prefetch" href="/assets/js/190.49a99b58.js"><link rel="prefetch" href="/assets/js/191.42bbdcf8.js"><link rel="prefetch" href="/assets/js/192.1d743852.js"><link rel="prefetch" href="/assets/js/193.a726a680.js"><link rel="prefetch" href="/assets/js/194.ef463ff6.js"><link rel="prefetch" href="/assets/js/195.db1e22ce.js"><link rel="prefetch" href="/assets/js/196.9552c292.js"><link rel="prefetch" href="/assets/js/197.707f67da.js"><link rel="prefetch" href="/assets/js/198.2cbf5832.js"><link rel="prefetch" href="/assets/js/199.6c5bf69e.js"><link rel="prefetch" href="/assets/js/2.78c82aa8.js"><link rel="prefetch" href="/assets/js/20.9a669c93.js"><link rel="prefetch" href="/assets/js/200.410ccd0f.js"><link rel="prefetch" href="/assets/js/201.45dc70e7.js"><link rel="prefetch" href="/assets/js/202.543a9335.js"><link rel="prefetch" href="/assets/js/203.1007af89.js"><link rel="prefetch" href="/assets/js/204.20211528.js"><link rel="prefetch" href="/assets/js/205.e0734f58.js"><link rel="prefetch" href="/assets/js/206.d4059050.js"><link rel="prefetch" href="/assets/js/207.364b0ca8.js"><link rel="prefetch" href="/assets/js/208.7c40126e.js"><link rel="prefetch" href="/assets/js/209.5d2f80ef.js"><link rel="prefetch" href="/assets/js/21.ade12907.js"><link rel="prefetch" href="/assets/js/210.bc40a345.js"><link rel="prefetch" href="/assets/js/211.38128c62.js"><link rel="prefetch" href="/assets/js/212.a774e331.js"><link rel="prefetch" href="/assets/js/213.2e49aaed.js"><link rel="prefetch" href="/assets/js/214.ead4bcd0.js"><link rel="prefetch" href="/assets/js/215.abf9b610.js"><link rel="prefetch" href="/assets/js/216.2eaa4973.js"><link rel="prefetch" href="/assets/js/217.cccbc23c.js"><link rel="prefetch" href="/assets/js/218.bcae8955.js"><link rel="prefetch" href="/assets/js/219.83c3b5cb.js"><link rel="prefetch" href="/assets/js/22.94366fcf.js"><link rel="prefetch" href="/assets/js/220.ef06ecdb.js"><link rel="prefetch" href="/assets/js/221.189715b3.js"><link rel="prefetch" href="/assets/js/222.97fcbabe.js"><link rel="prefetch" href="/assets/js/223.94e7e93e.js"><link rel="prefetch" href="/assets/js/224.4ee49632.js"><link rel="prefetch" href="/assets/js/225.03e48bf0.js"><link rel="prefetch" href="/assets/js/226.c9c62b34.js"><link rel="prefetch" href="/assets/js/227.628d0d41.js"><link rel="prefetch" href="/assets/js/228.3aef9074.js"><link rel="prefetch" href="/assets/js/229.7f440aef.js"><link rel="prefetch" href="/assets/js/23.6dc36781.js"><link rel="prefetch" href="/assets/js/230.a84b23e3.js"><link rel="prefetch" href="/assets/js/231.79c1b1c2.js"><link rel="prefetch" href="/assets/js/232.6d92a734.js"><link rel="prefetch" href="/assets/js/233.e251c898.js"><link rel="prefetch" href="/assets/js/234.ca021020.js"><link rel="prefetch" href="/assets/js/235.0d4d9a8b.js"><link rel="prefetch" href="/assets/js/236.49fdd4dc.js"><link rel="prefetch" href="/assets/js/237.5f6efdb7.js"><link rel="prefetch" href="/assets/js/238.4c1211f1.js"><link rel="prefetch" href="/assets/js/239.79ee0efe.js"><link rel="prefetch" href="/assets/js/24.87b71ed7.js"><link rel="prefetch" href="/assets/js/240.57c40b18.js"><link rel="prefetch" href="/assets/js/241.9784a063.js"><link rel="prefetch" href="/assets/js/242.9aa933fe.js"><link rel="prefetch" href="/assets/js/243.f26d8746.js"><link rel="prefetch" href="/assets/js/244.a92b74cc.js"><link rel="prefetch" href="/assets/js/245.23c04246.js"><link rel="prefetch" href="/assets/js/246.2bdb3e72.js"><link rel="prefetch" href="/assets/js/247.dafb8b92.js"><link rel="prefetch" href="/assets/js/248.23706673.js"><link rel="prefetch" href="/assets/js/249.bf7c3854.js"><link rel="prefetch" href="/assets/js/25.c2d0eb9e.js"><link rel="prefetch" href="/assets/js/250.48e62d58.js"><link rel="prefetch" href="/assets/js/251.ac008b3d.js"><link rel="prefetch" href="/assets/js/252.ebdd5e71.js"><link rel="prefetch" href="/assets/js/253.965e6a57.js"><link rel="prefetch" href="/assets/js/254.3943f18d.js"><link rel="prefetch" href="/assets/js/255.4a8765de.js"><link rel="prefetch" href="/assets/js/256.fa88f429.js"><link rel="prefetch" href="/assets/js/257.471152b4.js"><link rel="prefetch" href="/assets/js/258.a6ef02c6.js"><link rel="prefetch" href="/assets/js/259.e5701060.js"><link rel="prefetch" href="/assets/js/26.c3d3858b.js"><link rel="prefetch" href="/assets/js/260.2b91e3dc.js"><link rel="prefetch" href="/assets/js/261.ac49b937.js"><link rel="prefetch" href="/assets/js/262.cc999e38.js"><link rel="prefetch" href="/assets/js/263.b57a2167.js"><link rel="prefetch" href="/assets/js/264.96545285.js"><link rel="prefetch" href="/assets/js/265.f0f742f2.js"><link rel="prefetch" href="/assets/js/266.9a683b7f.js"><link rel="prefetch" href="/assets/js/267.1a011eb5.js"><link rel="prefetch" href="/assets/js/268.99ec9ba7.js"><link rel="prefetch" href="/assets/js/269.e295776d.js"><link rel="prefetch" href="/assets/js/27.43ef183e.js"><link rel="prefetch" href="/assets/js/270.09f384b1.js"><link rel="prefetch" href="/assets/js/271.456c0602.js"><link rel="prefetch" href="/assets/js/272.f3a266d9.js"><link rel="prefetch" href="/assets/js/273.2ddc1bd8.js"><link rel="prefetch" href="/assets/js/274.f8164501.js"><link rel="prefetch" href="/assets/js/275.f74a642a.js"><link rel="prefetch" href="/assets/js/276.babd39af.js"><link rel="prefetch" href="/assets/js/277.a6cc4788.js"><link rel="prefetch" href="/assets/js/278.2a126b26.js"><link rel="prefetch" href="/assets/js/279.3b7ab924.js"><link rel="prefetch" href="/assets/js/28.1f4dca15.js"><link rel="prefetch" href="/assets/js/280.655351c0.js"><link rel="prefetch" href="/assets/js/281.c16161a7.js"><link rel="prefetch" href="/assets/js/282.5b9e04d2.js"><link rel="prefetch" href="/assets/js/283.ebd8d2df.js"><link rel="prefetch" href="/assets/js/284.d2324d4c.js"><link rel="prefetch" href="/assets/js/285.9dd4b6ea.js"><link rel="prefetch" href="/assets/js/286.3ac7afbb.js"><link rel="prefetch" href="/assets/js/287.119aaa1f.js"><link rel="prefetch" href="/assets/js/288.922fc7e1.js"><link rel="prefetch" href="/assets/js/289.73b200e2.js"><link rel="prefetch" href="/assets/js/29.2b485d8b.js"><link rel="prefetch" href="/assets/js/290.57a494dd.js"><link rel="prefetch" href="/assets/js/291.773f41a0.js"><link rel="prefetch" href="/assets/js/292.d36f7245.js"><link rel="prefetch" href="/assets/js/293.b30146d5.js"><link rel="prefetch" href="/assets/js/294.5ff6f139.js"><link rel="prefetch" href="/assets/js/295.7e238406.js"><link rel="prefetch" href="/assets/js/296.3042f8b0.js"><link rel="prefetch" href="/assets/js/297.efc22398.js"><link rel="prefetch" href="/assets/js/298.e6224ce8.js"><link rel="prefetch" href="/assets/js/299.705f8a2b.js"><link rel="prefetch" href="/assets/js/3.9a388d25.js"><link rel="prefetch" href="/assets/js/30.b0ccb95a.js"><link rel="prefetch" href="/assets/js/300.0fb4b12a.js"><link rel="prefetch" href="/assets/js/301.30093b5a.js"><link rel="prefetch" href="/assets/js/302.3ea85912.js"><link rel="prefetch" href="/assets/js/303.cda379b0.js"><link rel="prefetch" href="/assets/js/304.66fb5033.js"><link rel="prefetch" href="/assets/js/305.4555a51d.js"><link rel="prefetch" href="/assets/js/306.ea9dfaf5.js"><link rel="prefetch" href="/assets/js/307.e28898fc.js"><link rel="prefetch" href="/assets/js/308.5cb25a30.js"><link rel="prefetch" href="/assets/js/309.5aa67364.js"><link rel="prefetch" href="/assets/js/31.e8824984.js"><link rel="prefetch" href="/assets/js/310.d021f908.js"><link rel="prefetch" href="/assets/js/311.bbdc7568.js"><link rel="prefetch" href="/assets/js/312.009153cf.js"><link rel="prefetch" href="/assets/js/313.69b57c2e.js"><link rel="prefetch" href="/assets/js/314.aff0eadc.js"><link rel="prefetch" href="/assets/js/315.c71c86be.js"><link rel="prefetch" href="/assets/js/316.c46a9292.js"><link rel="prefetch" href="/assets/js/317.3fbb7349.js"><link rel="prefetch" href="/assets/js/318.b8b0b3a7.js"><link rel="prefetch" href="/assets/js/319.48d09d70.js"><link rel="prefetch" href="/assets/js/32.b2e7863a.js"><link rel="prefetch" href="/assets/js/320.71c644ef.js"><link rel="prefetch" href="/assets/js/321.9e740806.js"><link rel="prefetch" href="/assets/js/322.b4e59349.js"><link rel="prefetch" href="/assets/js/323.903dadb3.js"><link rel="prefetch" href="/assets/js/324.fbd7912e.js"><link rel="prefetch" href="/assets/js/325.3cfeded7.js"><link rel="prefetch" href="/assets/js/326.527335e1.js"><link rel="prefetch" href="/assets/js/327.c5644283.js"><link rel="prefetch" href="/assets/js/328.a17a039f.js"><link rel="prefetch" href="/assets/js/329.08b938c5.js"><link rel="prefetch" href="/assets/js/33.ba0f3869.js"><link rel="prefetch" href="/assets/js/330.3667cd04.js"><link rel="prefetch" href="/assets/js/331.841e82b3.js"><link rel="prefetch" href="/assets/js/332.458d0e79.js"><link rel="prefetch" href="/assets/js/333.65b05deb.js"><link rel="prefetch" href="/assets/js/334.683f3794.js"><link rel="prefetch" href="/assets/js/335.dae977bf.js"><link rel="prefetch" href="/assets/js/336.b624da22.js"><link rel="prefetch" href="/assets/js/337.ee890ba5.js"><link rel="prefetch" href="/assets/js/338.099b25b3.js"><link rel="prefetch" href="/assets/js/339.9fe5cbbe.js"><link rel="prefetch" href="/assets/js/34.aa1b5b6b.js"><link rel="prefetch" href="/assets/js/340.047b095d.js"><link rel="prefetch" href="/assets/js/341.fbd7ad90.js"><link rel="prefetch" href="/assets/js/342.0532eda4.js"><link rel="prefetch" href="/assets/js/343.08943db8.js"><link rel="prefetch" href="/assets/js/344.1e40e7bd.js"><link rel="prefetch" href="/assets/js/345.ecf6b403.js"><link rel="prefetch" href="/assets/js/346.90a55938.js"><link rel="prefetch" href="/assets/js/347.f24ab2f3.js"><link rel="prefetch" href="/assets/js/348.c9b161eb.js"><link rel="prefetch" href="/assets/js/349.1a1028e7.js"><link rel="prefetch" href="/assets/js/35.b4572c21.js"><link rel="prefetch" href="/assets/js/350.d7e31e50.js"><link rel="prefetch" href="/assets/js/351.08431dbb.js"><link rel="prefetch" href="/assets/js/352.dcc7f52f.js"><link rel="prefetch" href="/assets/js/353.c9596010.js"><link rel="prefetch" href="/assets/js/354.3514e57e.js"><link rel="prefetch" href="/assets/js/355.b94388e5.js"><link rel="prefetch" href="/assets/js/356.cbc0df2c.js"><link rel="prefetch" href="/assets/js/357.b68387f0.js"><link rel="prefetch" href="/assets/js/358.47105e3a.js"><link rel="prefetch" href="/assets/js/359.68c84dcd.js"><link rel="prefetch" href="/assets/js/36.fe4995d8.js"><link rel="prefetch" href="/assets/js/360.f38fbe25.js"><link rel="prefetch" href="/assets/js/361.35d340d5.js"><link rel="prefetch" href="/assets/js/362.f6d256f3.js"><link rel="prefetch" href="/assets/js/363.1f3a3292.js"><link rel="prefetch" href="/assets/js/364.abba14a7.js"><link rel="prefetch" href="/assets/js/365.cf93b650.js"><link rel="prefetch" href="/assets/js/366.124d97a2.js"><link rel="prefetch" href="/assets/js/367.a8b8bf30.js"><link rel="prefetch" href="/assets/js/368.265790e9.js"><link rel="prefetch" href="/assets/js/369.51d4f2bf.js"><link rel="prefetch" href="/assets/js/37.9c31946c.js"><link rel="prefetch" href="/assets/js/370.08f88b9c.js"><link rel="prefetch" href="/assets/js/371.0faf021b.js"><link rel="prefetch" href="/assets/js/372.20757cb3.js"><link rel="prefetch" href="/assets/js/373.9d61f65d.js"><link rel="prefetch" href="/assets/js/374.e81b7362.js"><link rel="prefetch" href="/assets/js/375.fe4130af.js"><link rel="prefetch" href="/assets/js/376.25062356.js"><link rel="prefetch" href="/assets/js/377.24fc28b3.js"><link rel="prefetch" href="/assets/js/378.0795e91c.js"><link rel="prefetch" href="/assets/js/379.d9d6a7af.js"><link rel="prefetch" href="/assets/js/38.8b0ad989.js"><link rel="prefetch" href="/assets/js/380.4711336e.js"><link rel="prefetch" href="/assets/js/381.0fce834a.js"><link rel="prefetch" href="/assets/js/382.66650f20.js"><link rel="prefetch" href="/assets/js/383.75e60086.js"><link rel="prefetch" href="/assets/js/384.002c7c07.js"><link rel="prefetch" href="/assets/js/385.9105a75c.js"><link rel="prefetch" href="/assets/js/386.237c317d.js"><link rel="prefetch" href="/assets/js/387.8d22e513.js"><link rel="prefetch" href="/assets/js/388.9b2998c8.js"><link rel="prefetch" href="/assets/js/389.f8d07f66.js"><link rel="prefetch" href="/assets/js/39.07af9271.js"><link rel="prefetch" href="/assets/js/390.4c717311.js"><link rel="prefetch" href="/assets/js/391.00b705dc.js"><link rel="prefetch" href="/assets/js/392.aec3e2b7.js"><link rel="prefetch" href="/assets/js/393.4970a3a8.js"><link rel="prefetch" href="/assets/js/394.f5f2b88c.js"><link rel="prefetch" href="/assets/js/395.d06eaa9a.js"><link rel="prefetch" href="/assets/js/396.727a6ffc.js"><link rel="prefetch" href="/assets/js/397.21809c06.js"><link rel="prefetch" href="/assets/js/398.0dbed4f4.js"><link rel="prefetch" href="/assets/js/399.82508e5e.js"><link rel="prefetch" href="/assets/js/4.95aed454.js"><link rel="prefetch" href="/assets/js/40.0bc5f00e.js"><link rel="prefetch" href="/assets/js/400.111a4190.js"><link rel="prefetch" href="/assets/js/401.ca7797fc.js"><link rel="prefetch" href="/assets/js/402.11e2be62.js"><link rel="prefetch" href="/assets/js/403.f403fa5e.js"><link rel="prefetch" href="/assets/js/404.c6a6aa60.js"><link rel="prefetch" href="/assets/js/405.86f69522.js"><link rel="prefetch" href="/assets/js/406.4f777c33.js"><link rel="prefetch" href="/assets/js/407.9294a541.js"><link rel="prefetch" href="/assets/js/408.27b5f899.js"><link rel="prefetch" href="/assets/js/409.c22d60ea.js"><link rel="prefetch" href="/assets/js/41.ef044bd9.js"><link rel="prefetch" href="/assets/js/410.30e330e6.js"><link rel="prefetch" href="/assets/js/411.9c4916c1.js"><link rel="prefetch" href="/assets/js/412.025eaa8d.js"><link rel="prefetch" href="/assets/js/413.40325d31.js"><link rel="prefetch" href="/assets/js/414.261cdd74.js"><link rel="prefetch" href="/assets/js/415.a736268c.js"><link rel="prefetch" href="/assets/js/416.028ea4c4.js"><link rel="prefetch" href="/assets/js/417.f33f215f.js"><link rel="prefetch" href="/assets/js/418.d6bfdba8.js"><link rel="prefetch" href="/assets/js/419.444e984c.js"><link rel="prefetch" href="/assets/js/42.4b090312.js"><link rel="prefetch" href="/assets/js/420.1fb32eee.js"><link rel="prefetch" href="/assets/js/421.8514af4e.js"><link rel="prefetch" href="/assets/js/422.bb29caba.js"><link rel="prefetch" href="/assets/js/423.1975570c.js"><link rel="prefetch" href="/assets/js/424.a5b5a170.js"><link rel="prefetch" href="/assets/js/425.757d5732.js"><link rel="prefetch" href="/assets/js/426.7010be66.js"><link rel="prefetch" href="/assets/js/427.1e31616a.js"><link rel="prefetch" href="/assets/js/428.e3423911.js"><link rel="prefetch" href="/assets/js/429.2072b8ea.js"><link rel="prefetch" href="/assets/js/43.af7a0d97.js"><link rel="prefetch" href="/assets/js/430.5def6307.js"><link rel="prefetch" href="/assets/js/431.1d794156.js"><link rel="prefetch" href="/assets/js/432.cfa7c087.js"><link rel="prefetch" href="/assets/js/433.ddf15e25.js"><link rel="prefetch" href="/assets/js/434.236ed829.js"><link rel="prefetch" href="/assets/js/435.5de1c51c.js"><link rel="prefetch" href="/assets/js/436.2692b7a7.js"><link rel="prefetch" href="/assets/js/437.d155f4a8.js"><link rel="prefetch" href="/assets/js/438.7fe194d7.js"><link rel="prefetch" href="/assets/js/439.dc2784cd.js"><link rel="prefetch" href="/assets/js/44.bd97a1a0.js"><link rel="prefetch" href="/assets/js/440.28016863.js"><link rel="prefetch" href="/assets/js/441.6dc0a7af.js"><link rel="prefetch" href="/assets/js/442.c8ed6dd1.js"><link rel="prefetch" href="/assets/js/443.481bc627.js"><link rel="prefetch" href="/assets/js/444.452622b2.js"><link rel="prefetch" href="/assets/js/445.8557e0b4.js"><link rel="prefetch" href="/assets/js/446.c5473eda.js"><link rel="prefetch" href="/assets/js/447.21d247a1.js"><link rel="prefetch" href="/assets/js/448.0403daf6.js"><link rel="prefetch" href="/assets/js/449.013f7dc2.js"><link rel="prefetch" href="/assets/js/45.241d3eca.js"><link rel="prefetch" href="/assets/js/450.1c93f0b3.js"><link rel="prefetch" href="/assets/js/451.76d0cb7c.js"><link rel="prefetch" href="/assets/js/452.a547eb36.js"><link rel="prefetch" href="/assets/js/453.2f2e8dd6.js"><link rel="prefetch" href="/assets/js/454.013354c5.js"><link rel="prefetch" href="/assets/js/455.9568f0fe.js"><link rel="prefetch" href="/assets/js/456.d6d9f8a4.js"><link rel="prefetch" href="/assets/js/457.7bc42e44.js"><link rel="prefetch" href="/assets/js/458.234c2dbd.js"><link rel="prefetch" href="/assets/js/459.04e78026.js"><link rel="prefetch" href="/assets/js/46.a4678c27.js"><link rel="prefetch" href="/assets/js/460.f5b5debd.js"><link rel="prefetch" href="/assets/js/461.a70ee112.js"><link rel="prefetch" href="/assets/js/462.e4734c67.js"><link rel="prefetch" href="/assets/js/463.fd27222f.js"><link rel="prefetch" href="/assets/js/464.3b4de1cc.js"><link rel="prefetch" href="/assets/js/465.f371f9ba.js"><link rel="prefetch" href="/assets/js/466.9c96f782.js"><link rel="prefetch" href="/assets/js/467.1742c3b2.js"><link rel="prefetch" href="/assets/js/468.240c189c.js"><link rel="prefetch" href="/assets/js/469.5a246282.js"><link rel="prefetch" href="/assets/js/47.fb273717.js"><link rel="prefetch" href="/assets/js/470.71b321cb.js"><link rel="prefetch" href="/assets/js/471.538230e3.js"><link rel="prefetch" href="/assets/js/472.da51e719.js"><link rel="prefetch" href="/assets/js/473.efa04814.js"><link rel="prefetch" href="/assets/js/474.e298d396.js"><link rel="prefetch" href="/assets/js/475.16707234.js"><link rel="prefetch" href="/assets/js/476.217e5af9.js"><link rel="prefetch" href="/assets/js/477.56b627af.js"><link rel="prefetch" href="/assets/js/478.4f1dd671.js"><link rel="prefetch" href="/assets/js/479.24f450f9.js"><link rel="prefetch" href="/assets/js/48.b30ddbd5.js"><link rel="prefetch" href="/assets/js/480.a31839f4.js"><link rel="prefetch" href="/assets/js/481.d63479d8.js"><link rel="prefetch" href="/assets/js/482.4ad51c89.js"><link rel="prefetch" href="/assets/js/483.2e41dcce.js"><link rel="prefetch" href="/assets/js/484.1408820e.js"><link rel="prefetch" href="/assets/js/485.407718d6.js"><link rel="prefetch" href="/assets/js/486.f16c0b95.js"><link rel="prefetch" href="/assets/js/487.e38ed346.js"><link rel="prefetch" href="/assets/js/488.5d1df12c.js"><link rel="prefetch" href="/assets/js/489.2c35f595.js"><link rel="prefetch" href="/assets/js/49.012ab2b5.js"><link rel="prefetch" href="/assets/js/490.1ba5d079.js"><link rel="prefetch" href="/assets/js/491.7335e5af.js"><link rel="prefetch" href="/assets/js/492.7aff8d15.js"><link rel="prefetch" href="/assets/js/493.26a532f3.js"><link rel="prefetch" href="/assets/js/494.1746116e.js"><link rel="prefetch" href="/assets/js/495.5b715463.js"><link rel="prefetch" href="/assets/js/496.058db4c4.js"><link rel="prefetch" href="/assets/js/497.70b69323.js"><link rel="prefetch" href="/assets/js/498.8eb78ac6.js"><link rel="prefetch" href="/assets/js/499.213e2432.js"><link rel="prefetch" href="/assets/js/5.23c01ef0.js"><link rel="prefetch" href="/assets/js/50.cc9e154c.js"><link rel="prefetch" href="/assets/js/500.ed55935d.js"><link rel="prefetch" href="/assets/js/501.aa65942c.js"><link rel="prefetch" href="/assets/js/502.22b33b2f.js"><link rel="prefetch" href="/assets/js/503.77f57631.js"><link rel="prefetch" href="/assets/js/504.48dfe673.js"><link rel="prefetch" href="/assets/js/505.52e9fd16.js"><link rel="prefetch" href="/assets/js/506.7ba96971.js"><link rel="prefetch" href="/assets/js/507.1c5e0a05.js"><link rel="prefetch" href="/assets/js/508.76972a9f.js"><link rel="prefetch" href="/assets/js/509.9d849093.js"><link rel="prefetch" href="/assets/js/51.c4a3a9c3.js"><link rel="prefetch" href="/assets/js/510.4a183cb3.js"><link rel="prefetch" href="/assets/js/511.6f168287.js"><link rel="prefetch" href="/assets/js/512.ff926005.js"><link rel="prefetch" href="/assets/js/513.e2ce740e.js"><link rel="prefetch" href="/assets/js/514.d61eeb4d.js"><link rel="prefetch" href="/assets/js/515.d2fd4767.js"><link rel="prefetch" href="/assets/js/516.0b776097.js"><link rel="prefetch" href="/assets/js/518.d975943a.js"><link rel="prefetch" href="/assets/js/519.bfc0fae0.js"><link rel="prefetch" href="/assets/js/52.bfdc8d72.js"><link rel="prefetch" href="/assets/js/520.a7a545e6.js"><link rel="prefetch" href="/assets/js/521.2e6a6297.js"><link rel="prefetch" href="/assets/js/522.8eed6b02.js"><link rel="prefetch" href="/assets/js/523.99e380d9.js"><link rel="prefetch" href="/assets/js/524.ea1d9568.js"><link rel="prefetch" href="/assets/js/525.059724bb.js"><link rel="prefetch" href="/assets/js/526.61fc54cc.js"><link rel="prefetch" href="/assets/js/527.8eb0f88b.js"><link rel="prefetch" href="/assets/js/528.7b5b6ce4.js"><link rel="prefetch" href="/assets/js/529.7f8d6fa3.js"><link rel="prefetch" href="/assets/js/53.1472f3ef.js"><link rel="prefetch" href="/assets/js/530.e758f547.js"><link rel="prefetch" href="/assets/js/531.3fecbd85.js"><link rel="prefetch" href="/assets/js/532.bffba344.js"><link rel="prefetch" href="/assets/js/533.abbcfa8b.js"><link rel="prefetch" href="/assets/js/534.1d4b732b.js"><link rel="prefetch" href="/assets/js/535.f06e34a6.js"><link rel="prefetch" href="/assets/js/536.7ff4bf08.js"><link rel="prefetch" href="/assets/js/537.40881ba9.js"><link rel="prefetch" href="/assets/js/538.02147a4b.js"><link rel="prefetch" href="/assets/js/539.8bc65b4f.js"><link rel="prefetch" href="/assets/js/54.c99e3f2b.js"><link rel="prefetch" href="/assets/js/540.6930cd5c.js"><link rel="prefetch" href="/assets/js/541.c7704bf6.js"><link rel="prefetch" href="/assets/js/542.780b05f0.js"><link rel="prefetch" href="/assets/js/543.87fc1a20.js"><link rel="prefetch" href="/assets/js/544.1463b4da.js"><link rel="prefetch" href="/assets/js/545.7d8b5909.js"><link rel="prefetch" href="/assets/js/546.9eada749.js"><link rel="prefetch" href="/assets/js/547.59b0e148.js"><link rel="prefetch" href="/assets/js/548.fcacb438.js"><link rel="prefetch" href="/assets/js/549.fecc1cb4.js"><link rel="prefetch" href="/assets/js/55.bd7c7097.js"><link rel="prefetch" href="/assets/js/550.306c50b7.js"><link rel="prefetch" href="/assets/js/551.3e02eb9c.js"><link rel="prefetch" href="/assets/js/552.f42689a7.js"><link rel="prefetch" href="/assets/js/553.f1741388.js"><link rel="prefetch" href="/assets/js/554.9c7bb7de.js"><link rel="prefetch" href="/assets/js/555.94783ed7.js"><link rel="prefetch" href="/assets/js/556.928327f2.js"><link rel="prefetch" href="/assets/js/557.5313221c.js"><link rel="prefetch" href="/assets/js/558.e3419bf6.js"><link rel="prefetch" href="/assets/js/559.760b377a.js"><link rel="prefetch" href="/assets/js/56.a4d0c1b9.js"><link rel="prefetch" href="/assets/js/560.9e83028c.js"><link rel="prefetch" href="/assets/js/561.88a11c3e.js"><link rel="prefetch" href="/assets/js/562.9571784b.js"><link rel="prefetch" href="/assets/js/563.47a40ee0.js"><link rel="prefetch" href="/assets/js/564.2907b31f.js"><link rel="prefetch" href="/assets/js/565.7d3f4d12.js"><link rel="prefetch" href="/assets/js/566.bb2fa126.js"><link rel="prefetch" href="/assets/js/567.6ec070d8.js"><link rel="prefetch" href="/assets/js/568.17a85a96.js"><link rel="prefetch" href="/assets/js/569.b92ffad2.js"><link rel="prefetch" href="/assets/js/57.d1ecefc7.js"><link rel="prefetch" href="/assets/js/570.0e1b5fea.js"><link rel="prefetch" href="/assets/js/571.80faeebd.js"><link rel="prefetch" href="/assets/js/572.33154b61.js"><link rel="prefetch" href="/assets/js/573.a3637de5.js"><link rel="prefetch" href="/assets/js/574.203b3a07.js"><link rel="prefetch" href="/assets/js/575.a5c3a640.js"><link rel="prefetch" href="/assets/js/576.5f8a8380.js"><link rel="prefetch" href="/assets/js/577.61c9a762.js"><link rel="prefetch" href="/assets/js/58.0b4d9329.js"><link rel="prefetch" href="/assets/js/59.1894f60b.js"><link rel="prefetch" href="/assets/js/6.470b1653.js"><link rel="prefetch" href="/assets/js/60.276bf1df.js"><link rel="prefetch" href="/assets/js/61.5212fce9.js"><link rel="prefetch" href="/assets/js/62.fe7dcb17.js"><link rel="prefetch" href="/assets/js/63.e3b1bcbc.js"><link rel="prefetch" href="/assets/js/64.3eb19122.js"><link rel="prefetch" href="/assets/js/65.92303e48.js"><link rel="prefetch" href="/assets/js/66.74da8462.js"><link rel="prefetch" href="/assets/js/67.7d592d80.js"><link rel="prefetch" href="/assets/js/68.c8c7d0fc.js"><link rel="prefetch" href="/assets/js/69.a9f39355.js"><link rel="prefetch" href="/assets/js/7.3d112cdd.js"><link rel="prefetch" href="/assets/js/70.59c3c7fe.js"><link rel="prefetch" href="/assets/js/71.da3015fd.js"><link rel="prefetch" href="/assets/js/72.910177c5.js"><link rel="prefetch" href="/assets/js/73.5b600f80.js"><link rel="prefetch" href="/assets/js/74.974bd424.js"><link rel="prefetch" href="/assets/js/75.7615b9f3.js"><link rel="prefetch" href="/assets/js/76.754b744f.js"><link rel="prefetch" href="/assets/js/77.f03b866c.js"><link rel="prefetch" href="/assets/js/78.9c87963a.js"><link rel="prefetch" href="/assets/js/79.63ef643f.js"><link rel="prefetch" href="/assets/js/8.fbb56eb8.js"><link rel="prefetch" href="/assets/js/80.b6e20315.js"><link rel="prefetch" href="/assets/js/81.c4e59f39.js"><link rel="prefetch" href="/assets/js/82.07df7ff6.js"><link rel="prefetch" href="/assets/js/83.64887498.js"><link rel="prefetch" href="/assets/js/84.28a0c848.js"><link rel="prefetch" href="/assets/js/85.8d80a7e3.js"><link rel="prefetch" href="/assets/js/86.c645461b.js"><link rel="prefetch" href="/assets/js/87.bbcf234c.js"><link rel="prefetch" href="/assets/js/88.6c45d3ea.js"><link rel="prefetch" href="/assets/js/89.80b243be.js"><link rel="prefetch" href="/assets/js/9.3d32ed68.js"><link rel="prefetch" href="/assets/js/90.a30d269f.js"><link rel="prefetch" href="/assets/js/91.d7ac739a.js"><link rel="prefetch" href="/assets/js/92.9cc8fb64.js"><link rel="prefetch" href="/assets/js/93.b67814e3.js"><link rel="prefetch" href="/assets/js/94.4fc79fd5.js"><link rel="prefetch" href="/assets/js/95.aeb61f16.js"><link rel="prefetch" href="/assets/js/96.a4cb4afa.js"><link rel="prefetch" href="/assets/js/97.c34cf2b1.js"><link rel="prefetch" href="/assets/js/98.bf843bab.js"><link rel="prefetch" href="/assets/js/99.0e666e60.js">
    <link rel="stylesheet" href="/assets/css/0.styles.cc25976c.css">
  </head>
  <body>
    <div id="app" data-server-rendered="true"><div class="theme-container no-sidebar"><header class="navbar"><div class="sidebar-button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" viewBox="0 0 448 512" class="icon"><path fill="currentColor" d="M436 124H12c-6.627 0-12-5.373-12-12V80c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12z"></path></svg></div> <a href="/" class="home-link router-link-active"><!----> <span class="site-name">Dooks</span></a> <div class="links" style="max-width:nullpx;"><div class="search-box"><input aria-label="Search" autocomplete="off" spellcheck="false" value=""> <!----></div> <nav class="nav-links can-hide"><div class="nav-item"><div class="dropdown-wrapper"><a class="dropdown-title"><span class="title">Dooks</span> <span class="arrow right"></span></a> <ul class="nav-dropdown" style="display:none;"><li class="dropdown-item"><h4>Quick Start</h4> <ul class="dropdown-subitem-wrapper"><li class="dropdown-subitem"><a href="/dooks/introduction.html" class="nav-link">introduction</a></li><li class="dropdown-subitem"><a href="/dooks/setting-up.html" class="nav-link">setting-up</a></li></ul></li><li class="dropdown-item"><h4>Modules</h4> <ul class="dropdown-subitem-wrapper"><li class="dropdown-subitem"><a href="/dooks/crm/" class="nav-link">Customer Relationship Management</a></li><li class="dropdown-subitem"><a href="/dooks/selling.html" class="nav-link">Selling</a></li></ul></li></ul></div></div><div class="nav-item"><div class="dropdown-wrapper"><a class="dropdown-title"><span class="title">Languages</span> <span class="arrow right"></span></a> <ul class="nav-dropdown" style="display:none;"><li class="dropdown-item"><!----> <a href="/framework/app-development/how-to-improve-a-standard-control.html" class="nav-link router-link-exact-active router-link-active">English</a></li><li class="dropdown-item"><!----> <a href="/fr/" class="nav-link">Français</a></li></ul></div></div> <a href="https://gitlab.com/dooks/dooks" target="_blank" rel="noopener noreferrer" class="repo-link">
    GitLab
    <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></nav></div></header> <div class="sidebar-mask"></div> <div class="sidebar"><nav class="nav-links"><div class="nav-item"><div class="dropdown-wrapper"><a class="dropdown-title"><span class="title">Dooks</span> <span class="arrow right"></span></a> <ul class="nav-dropdown" style="display:none;"><li class="dropdown-item"><h4>Quick Start</h4> <ul class="dropdown-subitem-wrapper"><li class="dropdown-subitem"><a href="/dooks/introduction.html" class="nav-link">introduction</a></li><li class="dropdown-subitem"><a href="/dooks/setting-up.html" class="nav-link">setting-up</a></li></ul></li><li class="dropdown-item"><h4>Modules</h4> <ul class="dropdown-subitem-wrapper"><li class="dropdown-subitem"><a href="/dooks/crm/" class="nav-link">Customer Relationship Management</a></li><li class="dropdown-subitem"><a href="/dooks/selling.html" class="nav-link">Selling</a></li></ul></li></ul></div></div><div class="nav-item"><div class="dropdown-wrapper"><a class="dropdown-title"><span class="title">Languages</span> <span class="arrow right"></span></a> <ul class="nav-dropdown" style="display:none;"><li class="dropdown-item"><!----> <a href="/framework/app-development/how-to-improve-a-standard-control.html" class="nav-link router-link-exact-active router-link-active">English</a></li><li class="dropdown-item"><!----> <a href="/fr/" class="nav-link">Français</a></li></ul></div></div> <a href="https://gitlab.com/dooks/dooks" target="_blank" rel="noopener noreferrer" class="repo-link">
    GitLab
    <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></nav>  <!----> </div> <div class="page"> <div class="content"><h1 id="how-to-improve-a-standard-control"><a href="#how-to-improve-a-standard-control" aria-hidden="true" class="header-anchor">#</a> How To Improve A Standard Control</h1> <p>Frappe has a couple of elegant and useful widgets, but some times we need to edit them to add small improvements. This small article will describe how to add new resources to the standard widgets.</p> <p>Let me explain first our goal:</p> <p>&gt; Add <code>many</code> alternative translations in <code>numerous records</code> and in a <code>lot of doctypes</code></p> <p>Look the highlighted sections in the <strong>goal</strong>, we have <em>many translations</em> to add in <em>many records</em> and in <em>many doctypes</em>, so, we heave a <strong>many of work</strong>, so we have a lot to do right?</p> <p>The answer for this question is: <em>-Of course not! Because we know that if one element exists in many records and in many doctypes, this element is the <code>Control</code> or <code>Widget</code></em></p> <p>So, what we need do, is improve your goal based on the <code>Control</code>, to reduce our quantity of work.</p> <p>But, where will we find this magic element, the control? <em>-For now, we can look it in the JavaScript sources - let's look now at <a href="https://github.com/frappe/frappe/blob/develop/frappe/public/js/frappe/form/control.js#L13" target="_blank" rel="noopener noreferrer">Github<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></em></p> <p>&gt; Don't worry if you don't understand the code for now, our goal there is simplify our work.</p> <p>Let's go ahead with the thought!</p> <p>We know where we need to make the changes, but how will we dismember which are the controls that are affected by our feature and which aren't ?</p> <p>We need to keep in mind, that <code>Control</code> are instance of <code>DocFields</code> and the <code>DocFields</code> have a field that is very important for us in this case, the field that will help us to dismember which are affected by our feature and which aren't is the field <code>options</code> in the <code>DocField</code>.</p> <p><em>-Wait!, we understood that the field <code>options</code> can help us, but, how will it help us?</em></p> <p>Good question, we will define a word to put in the <code>options</code> of the <code>DocFields</code> that we need to include the feature, this world will be <strong><code>Translatable</code>.</strong></p> <p>&gt; If you forget how to customize the options of a field look <a href="https://kb.erpnext.com/kb/customize/creating-custom-link-field" target="_blank" rel="noopener noreferrer">this article<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a>, it can refresh your knowledge.</p> <p>Well, with the defined word in <code>options</code> of our selected <code>DocFields</code>, now is time to code:</p> <p><em>-At last, we think we would never stop talking!</em></p> <pre><code>frappe.ui.form.ControlData = frappe.ui.form.ControlData.$extend({
	make_input: function(){
		var options = this.df.options;
		if (!options || options!==&quot;Translatable&quot;){
			this._super();
			return;
		}
		var me = this;
		$('&lt;div class=&quot;link-field&quot; style=&quot;position: relative;&quot;&gt;\
			&lt;input type=&quot;text&quot; class=&quot;input-with-feedback form-control&quot;&gt;\
			&lt;span class=&quot;dialog-btn&quot;&gt;\
				&lt;a class=&quot;btn-open no-decoration&quot; title=&quot;' + __(&quot; open=&quot;&quot; translation&quot;)=&quot;&quot; +=&quot;&quot; '&quot;=&quot;&quot;&gt;\
				&lt;i class=&quot;fa fa-globe&quot;&gt;&lt;/i&gt;&lt;/a&gt;\
			&lt;/span&gt;\
		&lt;/div&gt;').prependTo(this.input_area);
		this.$input_area = $(this.input_area);
		this.$input = this.$input_area.find('input');
		this.$btn = this.$input_area.find('.dialog-btn');
		this.set_input_attributes();
		this.$input.on(&quot;focus&quot;, function(){
			me.$btn.toggle(true);
		});
		this.$input.on(&quot;blur&quot;, function(){
			setTimeout(function(){ me.$btn.toggle(false) }, 500);
		});
		this.input = $this.input.get(0);
		this.has_input = true;
		var me = this;
		this.setup_button();
	},
	setup_button: function(){
		var me = this;
		if (this.only_input){
			this.$btn.remove();
			return;
		}
		this.$btn.on(&quot;click&quot;, function(){
			var value = me.get_value();
			var options = me.df.options;
			if (value &amp;amp;&amp;amp; options &amp;amp;&amp;amp; options===&quot;Translatable&quot;){
				this.open_dialog();
			}
		});
	},
	open_dialog: function(){
		var doc = this.doc;
		if (!doc.__unsaved){
			new frappe.ui.form.TranslationSelector({
				doc: doc,
				df: this.doc,
				text: this.value
			});
		}
	}
});
</code></pre> <p><em>-Other letter soup, for my gosh!</em></p> <p>In fact, it IS a soup of letters, for a newbie, but we are not a beginner.</p> <p>Let me explain what this code does;</p> <ul><li>At line 1 the code overrides the <code>ControlData</code> by one extended <code>Class</code> of itself.</li> <li>The method <code>make_input</code> checks if the docfield is <strong><code>Translatable</code></strong> to make the new <code>Control</code> if not, it calls the <em>original</em> <code>make_input</code> using <code>_super()</code></li> <li>The method <code>setup_button</code> checks if the docfield is <strong><code>Translatable</code></strong> to enable it show a <code>dialog</code></li> <li>The method <code>open_dialog</code> invokes a new instance of the <code>TranslationSelector</code> that we will create in the code below.</li></ul></div> <div class="page-edit"><div class="edit-link"><a href="https://gitlab.com/dooks/dooks/edit/master/framework/app-development/how-to-improve-a-standard-control.md" target="_blank" rel="noopener noreferrer">Edit this page on Gitlab</a> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></div> <!----></div> <!----> </div> <!----></div></div>
    <script src="/assets/js/app.bd423434.js" defer></script><script src="/assets/js/517.b6977b47.js" defer></script>
  </body>
</html>