{"id":122793,"date":"2022-06-06T13:07:00","date_gmt":"2022-06-06T04:07:00","guid":{"rendered":"https:\/\/support.questetra.com\/?p=122793"},"modified":"2026-07-29T14:34:14","modified_gmt":"2026-07-29T05:34:14","slug":"tutorial-questetra-form-javascript-api","status":"publish","type":"post","link":"https:\/\/support.questetra.com\/en\/developer-blog\/tutorial-questetra-form-javascript-api\/","title":{"rendered":"Using [Questetra Form JavaScript API] on the Form Screen"},"content":{"rendered":"<div class=\"su-note\"  style=\"border-color:#e5dab2;border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;\"><div class=\"su-note-inner su-u-clearfix su-u-trim\" style=\"background-color:#FFF4CC;border-color:#ffffff;color:#333333;border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;\">\n<h3><i class=\"fal fa-exclamation-circle\"><\/i> PAGE UPDATED<\/h3>\n<p>The contents of this article have been divided and re-edited into the following three articles. See the new articles.<\/p>\n<ul>\n<li><strong><a href=\"https:\/\/support.questetra.com\/en\/developer-blog\/tutorial-questetra-form-javascript-api-1\/\">Get\/Set Data Item Values on the Form Screen<\/a><\/strong><\/li>\n<li><strong><a href=\"https:\/\/support.questetra.com\/en\/developer-blog\/tutorial-questetra-form-javascript-api-2\/\">Perform Processing When an Event Occurs on the Form Screen<\/a><\/strong><\/li>\n<li><strong><a href=\"https:\/\/support.questetra.com\/en\/developer-blog\/tutorial-questetra-form-javascript-api-3\/\">Perform Your Own Input Checks on Form Screens<\/a><\/strong><\/li>\n<\/ul>\n<\/div><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Questetra Form JavaScript API enables you to get\/assign values of input fields and register\/delete event handlers on the processing form screen.<\/p>\n","protected":false},"author":3,"featured_media":122572,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_coblocks_attr":"","_coblocks_dimensions":"","_coblocks_responsive_height":"","_coblocks_accordion_ie_support":"","_uag_custom_page_level_css":"","advanced_seo_description":"","jetpack_seo_html_title":"","jetpack_seo_noindex":false,"jetpack_seo_schema_type":"","_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_wpcom_ai_launchpad_first_post":false,"_jetpack_feature_clip_id":0,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"{title}\n\n{excerpt}\n\n{url}","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2},"_wpas_customize_per_network":false,"jetpack_post_was_ever_published":false},"categories":[296],"tags":[3280],"faq_section":[],"class_list":["post-122793","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-developer-blog","tag-questetra-form-javascript-api"],"jetpack_publicize_connections":[],"uagb_featured_image_src":{"full":["https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?fit=1200%2C675&ssl=1",1200,675,false],"thumbnail":["https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?resize=440%2C440&ssl=1",440,440,true],"medium":["https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?fit=560%2C315&ssl=1",560,315,true],"medium_large":["https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?fit=768%2C432&ssl=1",768,432,true],"large":["https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?fit=1024%2C576&ssl=1",1024,576,true],"1536x1536":["https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?fit=1200%2C675&ssl=1",1200,675,true],"2048x2048":["https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?fit=1200%2C675&ssl=1",1200,675,true],"newspack-article-block-landscape-large":["https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?resize=1200%2C675&ssl=1",1200,675,true],"newspack-article-block-portrait-large":["https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?resize=900%2C675&ssl=1",900,675,true],"newspack-article-block-square-large":["https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?resize=1200%2C675&ssl=1",1200,675,true],"newspack-article-block-landscape-medium":["https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?resize=800%2C600&ssl=1",800,600,true],"newspack-article-block-portrait-medium":["https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?resize=600%2C675&ssl=1",600,675,true],"newspack-article-block-square-medium":["https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?resize=800%2C675&ssl=1",800,675,true],"newspack-article-block-landscape-intermediate":["https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?resize=600%2C450&ssl=1",600,450,true],"newspack-article-block-portrait-intermediate":["https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?resize=450%2C600&ssl=1",450,600,true],"newspack-article-block-square-intermediate":["https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?resize=600%2C600&ssl=1",600,600,true],"newspack-article-block-landscape-small":["https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?resize=400%2C300&ssl=1",400,300,true],"newspack-article-block-portrait-small":["https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?resize=300%2C400&ssl=1",300,400,true],"newspack-article-block-square-small":["https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?resize=400%2C400&ssl=1",400,400,true],"newspack-article-block-landscape-tiny":["https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?resize=200%2C150&ssl=1",200,150,true],"newspack-article-block-portrait-tiny":["https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?resize=150%2C200&ssl=1",150,200,true],"newspack-article-block-square-tiny":["https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?resize=200%2C200&ssl=1",200,200,true],"newspack-article-block-uncropped":["https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?fit=1200%2C675&ssl=1",1200,675,true]},"uagb_author_info":{"display_name":"Hirotaka NISHI","author_link":"https:\/\/support.questetra.com\/en\/author\/nishiquestetra\/"},"uagb_comment_info":3,"uagb_excerpt":"Questetra Form JavaScript API enables you to get\/assign values of input fields and register\/delete event handlers on the processing form screen.","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p9DiIh-vWx","jetpack-related-posts":[{"id":126766,"url":"https:\/\/support.questetra.com\/en\/developer-blog\/tutorial-questetra-form-javascript-api-1\/","url_meta":{"origin":122793,"position":0},"title":"Get\/Set Data Item Values on the Form Screen","author":"Hirotaka NISHI","date":"2022-09-01","format":false,"excerpt":"This section describes how to get\/update Data Item values on the form screen using the Questetra Form JavaScript API.","rel":"","context":"In &quot;Questetra Developers Blog&quot;","block_context":{"text":"Questetra Developers Blog","link":"https:\/\/support.questetra.com\/ja\/category\/developer-blog\/"},"img":{"alt_text":"tutorial questetra form javascript api","src":"https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?fit=1200%2C675&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?fit=1200%2C675&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?fit=1200%2C675&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?fit=1200%2C675&ssl=1&resize=700%2C400 2x, https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?fit=1200%2C675&ssl=1&resize=1050%2C600 3x"},"classes":[]},{"id":127110,"url":"https:\/\/support.questetra.com\/en\/developer-blog\/tutorial-questetra-form-javascript-api-3\/","url_meta":{"origin":122793,"position":1},"title":"Perform Your Own Input Checks on Form Screens","author":"Hirotaka NISHI","date":"2022-09-06","format":false,"excerpt":"Implement your own input checking mechanism that runs on the form screen using the Questetra Form Javascript API.","rel":"","context":"In &quot;Questetra Developers Blog&quot;","block_context":{"text":"Questetra Developers Blog","link":"https:\/\/support.questetra.com\/en\/category\/developer-blog\/"},"img":{"alt_text":"tutorial questetra form javascript api","src":"https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?fit=1200%2C675&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?fit=1200%2C675&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?fit=1200%2C675&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?fit=1200%2C675&ssl=1&resize=700%2C400 2x, https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?fit=1200%2C675&ssl=1&resize=1050%2C600 3x"},"classes":[]},{"id":127065,"url":"https:\/\/support.questetra.com\/en\/developer-blog\/tutorial-questetra-form-javascript-api-2\/","url_meta":{"origin":122793,"position":2},"title":"Perform Processing When an Event Occurs on the Form Screen","author":"Hirotaka NISHI","date":"2022-09-05","format":false,"excerpt":"This section describes how to register\/delete event handlers for data items on the form screen and for the form screen itself using Questetra Form Javascript API.","rel":"","context":"In &quot;Questetra Developers Blog&quot;","block_context":{"text":"Questetra Developers Blog","link":"https:\/\/support.questetra.com\/en\/category\/developer-blog\/"},"img":{"alt_text":"tutorial questetra form javascript api","src":"https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?fit=1200%2C675&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?fit=1200%2C675&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?fit=1200%2C675&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?fit=1200%2C675&ssl=1&resize=700%2C400 2x, https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?fit=1200%2C675&ssl=1&resize=1050%2C600 3x"},"classes":[]},{"id":166708,"url":"https:\/\/support.questetra.com\/en\/developer-blog\/decoration-string-diff\/","url_meta":{"origin":122793,"position":3},"title":"Display the Difference Between Two String Type Data Items on the Processing Form Screen","author":"Hirotaka NISHI","date":"2024-10-01","format":false,"excerpt":"This article explains how to display the difference between two text-type data items using decoration (HTML\/JavaScript) on the form screen. Questetra Form Javascript API is used to get the input value.","rel":"","context":"In &quot;Questetra Developers Blog&quot;","block_context":{"text":"Questetra Developers Blog","link":"https:\/\/support.questetra.com\/en\/category\/developer-blog\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2024\/10\/text-diff-en.png?fit=1200%2C675&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2024\/10\/text-diff-en.png?fit=1200%2C675&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2024\/10\/text-diff-en.png?fit=1200%2C675&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2024\/10\/text-diff-en.png?fit=1200%2C675&ssl=1&resize=700%2C400 2x, https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2024\/10\/text-diff-en.png?fit=1200%2C675&ssl=1&resize=1050%2C600 3x"},"classes":[]},{"id":79794,"url":"https:\/\/support.questetra.com\/en\/data-items\/guidepanel-type\/","url_meta":{"origin":122793,"position":4},"title":"Guide Panel-type","author":"Peter Glover","date":"2019-09-30","format":false,"excerpt":"Displays non-editable text as guidance for users of the input form.","rel":"","context":"In &quot;Data Items&quot;","block_context":{"text":"Data Items","link":"https:\/\/support.questetra.com\/en\/category\/data-items\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2019\/09\/Guide-panel-code.png?fit=1200%2C675&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2019\/09\/Guide-panel-code.png?fit=1200%2C675&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2019\/09\/Guide-panel-code.png?fit=1200%2C675&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2019\/09\/Guide-panel-code.png?fit=1200%2C675&ssl=1&resize=700%2C400 2x, https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2019\/09\/Guide-panel-code.png?fit=1200%2C675&ssl=1&resize=1050%2C600 3x"},"classes":[]},{"id":80860,"url":"https:\/\/support.questetra.com\/en\/data-items\/title\/","url_meta":{"origin":122793,"position":5},"title":"Title","author":"Peter Glover","date":"2019-11-05","format":false,"excerpt":"Displays a text field for entering a string and stores the entered string as the subject of the process.","rel":"","context":"In &quot;Data Items&quot;","block_context":{"text":"Data Items","link":"https:\/\/support.questetra.com\/en\/category\/data-items\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2019\/10\/Title.png?fit=1200%2C675&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2019\/10\/Title.png?fit=1200%2C675&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2019\/10\/Title.png?fit=1200%2C675&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2019\/10\/Title.png?fit=1200%2C675&ssl=1&resize=700%2C400 2x, https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2019\/10\/Title.png?fit=1200%2C675&ssl=1&resize=1050%2C600 3x"},"classes":[]}],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/support.questetra.com\/wp-content\/uploads\/2022\/06\/tutorial-questetra-form-javascript-api.png?fit=1200%2C675&ssl=1","_links":{"self":[{"href":"https:\/\/support.questetra.com\/en\/wp-json\/wp\/v2\/posts\/122793","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/support.questetra.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/support.questetra.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/support.questetra.com\/en\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/support.questetra.com\/en\/wp-json\/wp\/v2\/comments?post=122793"}],"version-history":[{"count":29,"href":"https:\/\/support.questetra.com\/en\/wp-json\/wp\/v2\/posts\/122793\/revisions"}],"predecessor-version":[{"id":191666,"href":"https:\/\/support.questetra.com\/en\/wp-json\/wp\/v2\/posts\/122793\/revisions\/191666"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/support.questetra.com\/en\/wp-json\/wp\/v2\/media\/122572"}],"wp:attachment":[{"href":"https:\/\/support.questetra.com\/en\/wp-json\/wp\/v2\/media?parent=122793"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/support.questetra.com\/en\/wp-json\/wp\/v2\/categories?post=122793"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/support.questetra.com\/en\/wp-json\/wp\/v2\/tags?post=122793"},{"taxonomy":"faq_section","embeddable":true,"href":"https:\/\/support.questetra.com\/en\/wp-json\/wp\/v2\/faq_section?post=122793"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}