1 files changed, 7 insertions, 0 deletions

diff --git a/app/assets/javascripts/protected_branches/protected_branch_create.js b/app/assets/javascripts/protected_branches/protected_branch_create.js
index c9474f0516c..726ddba1014 100644
--- a/app/assets/javascripts/protected_branches/protected_branch_create.js
+++ b/app/assets/javascripts/protected_branches/protected_branch_create.js
@@ -15,17 +15,23 @@ export default class ProtectedBranchCreate {
     this.isLocalStorageAvailable = AccessorUtilities.isLocalStorageAccessSafe();
     this.currentProjectUserDefaults = {};
     this.buildDropdowns();
+    this.$forcePushToggle = this.$form.find('.js-force-push-toggle');
     this.$codeOwnerToggle = this.$form.find('.js-code-owner-toggle');
     this.bindEvents();
   }
 
   bindEvents() {
+    this.$forcePushToggle.on('click', this.onForcePushToggleClick.bind(this));
     if (this.hasLicense) {
       this.$codeOwnerToggle.on('click', this.onCodeOwnerToggleClick.bind(this));
     }
     this.$form.on('submit', this.onFormSubmit.bind(this));
   }
 
+  onForcePushToggleClick() {
+    this.$forcePushToggle.toggleClass('is-checked');
+  }
+
   onCodeOwnerToggleClick() {
     this.$codeOwnerToggle.toggleClass('is-checked');
   }
@@ -86,6 +92,7 @@ export default class ProtectedBranchCreate {
       authenticity_token: this.$form.find('input[name="authenticity_token"]').val(),
       protected_branch: {
         name: this.$form.find('input[name="protected_branch[name]"]').val(),
+        allow_force_push: this.$forcePushToggle.hasClass('is-checked'),
         code_owner_approval_required: this.$codeOwnerToggle.hasClass('is-checked'),
       },
     };