Title: Inserting element with js
Last modified: October 7, 2022

---

# Inserting element with js

 *  Resolved [nicewp123](https://wordpress.org/support/users/nicewp123/)
 * (@nicewp123)
 * [3 years, 8 months ago](https://wordpress.org/support/topic/inserting-element-with-js/)
 * Hello! I would like to insert element with js in layout of my form (i.e. js chart).
   From here [https://wordpress.org/support/topic/forminator-create-chart/](https://wordpress.org/support/topic/forminator-create-chart/)
   it is clear how to get variables from forminator form. But how to insert the 
   new structural element in the layout of the form (i.e. chart or anything in between
   the fields)? Can I somehow use Forminator HTML field and plug chart (or anything
   else) in there using js? Please let me know how to do it, many thanks!

Viewing 4 replies - 1 through 4 (of 4 total)

 *  [Kris – WPMU DEV Support](https://wordpress.org/support/users/wpmudevsupport13/)
 * (@wpmudevsupport13)
 * [3 years, 8 months ago](https://wordpress.org/support/topic/inserting-element-with-js/#post-16080015)
 * Hi [@nicewp123](https://wordpress.org/support/users/nicewp123/)
 * I hope you are doing good today.
 * Could you please try this snippet and see whether it helps with adding your script
   in HTML?
 *     ```
       add_filter( 'wp_kses_allowed_html', 'formi_allow_html', 10, 2 );
       function formi_allow_html ( $html, $context ) {
       	if ( 'post' === $context ) {
       		$html['script'] = array(
       			'src' => true,
       		);
       	}
       	return $html;
       }
       ```
   
 * You can add the above snippet as a mu-plugins. Please check this link on how 
   to implement the above code as a mu-plugins:
 * > [Must Use Plugins](https://wordpress.org/support/article/must-use-plugins/)
 * The above code will filter the HTML fields to allow scripts. If you still have
   issues even after that then please do share the script you are adding, so that
   we could check further and assist based on that.
 * Kind Regards,
    Kris
 *  Thread Starter [nicewp123](https://wordpress.org/support/users/nicewp123/)
 * (@nicewp123)
 * [3 years, 7 months ago](https://wordpress.org/support/topic/inserting-element-with-js/#post-16117827)
 * [@wpmudevsupport13](https://wordpress.org/support/users/wpmudevsupport13/), Thank
   you very much for your help!
    One more thing I wanted to ask: When I edit calculation
   field value with js, then it is not saved correctly in submissions (takes original
   formula). But I can edit text field with js and it is saved correctly. But then
   text field can be edited by user and css I applied to block it don’t seem to 
   work perfectly (user can click Tab and edit the field despite tabindex=”-1″).
   I’m wondering how to implement “no tab no edit” feature (as Calculation field).
 * Here are the files: [https://easyupload.io/2np9hi](https://easyupload.io/2np9hi)
 *  Plugin Support [Nithin – WPMU DEV Support](https://wordpress.org/support/users/wpmudevsupport11/)
 * (@wpmudevsupport11)
 * [3 years, 7 months ago](https://wordpress.org/support/topic/inserting-element-with-js/#post-16121942)
 * Hi [@nicewp123](https://wordpress.org/support/users/nicewp123/),
 * I’m afraid it isn’t possible to change the value of the Calculation field by 
   just using jQuery.
 * The calculation occurs in the backend, you can check the following example snippet
   that you could refer if you are looking to change it using PHP:
 *     ```
       add_filter( 'forminator_prepared_data', 'wpmudev_fix_calc_multi', 10, 2 );
       function wpmudev_fix_calc_multi( $prepared_data, $module_object ){
       	if( $module_object->id != 2910 ){
       		return $prepared_data;
       	}
   
       	if ( ! empty( $prepared_data['calculation-1'] ) ) {
       		$prepared_data['calculation-1'] = $prepared_data['calculation-1'] * 2;
       	}
   
       	return $prepared_data;
       }
       ```
   
 * Where the value `2910` in the above snippet is the Form ID, which you’ll have
   to change according to your form. And the “calculation-1” would be your field
   ID, and you’ll have to change it based on your form.
 * I hope this helps in moving forward.
 * Kind Regards,
    Nithin
 *  Plugin Support [Amin – WPMU DEV Support](https://wordpress.org/support/users/wpmudev-support2/)
 * (@wpmudev-support2)
 * [3 years, 7 months ago](https://wordpress.org/support/topic/inserting-element-with-js/#post-16139076)
 * Hello [@nicewp123](https://wordpress.org/support/users/nicewp123/) ,
 * We haven’t heard from you for several days now, so it looks like you don’t have
   any more questions for us.
 * Feel free to re-open this ticket if needed.
 * Kind regards
    Kasia

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Inserting element with js’ is closed to new replies.

 * ![](https://ps.w.org/forminator/assets/icon-256x256.gif?rev=3443182)
 * [Forminator Forms – Contact Form, Payment Form & Custom Form Builder](https://wordpress.org/plugins/forminator/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/forminator/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/forminator/)
 * [Active Topics](https://wordpress.org/support/plugin/forminator/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/forminator/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/forminator/reviews/)

## Tags

 * [layout](https://wordpress.org/support/topic-tag/layout/)

 * 4 replies
 * 4 participants
 * Last reply from: [Amin – WPMU DEV Support](https://wordpress.org/support/users/wpmudev-support2/)
 * Last activity: [3 years, 7 months ago](https://wordpress.org/support/topic/inserting-element-with-js/#post-16139076)
 * Status: resolved