diff --git a/templates/repo/issue/branch_selector_field.tmpl b/templates/repo/issue/branch_selector_field.tmpl
index cbf7929fdb..5793a8bfda 100644
--- a/templates/repo/issue/branch_selector_field.tmpl
+++ b/templates/repo/issue/branch_selector_field.tmpl
@@ -1,12 +1,8 @@
 {{if and (not .Issue.IsPull) (not .PageIsComparePull)}}
 <input id="ref_selector" name="ref" type="hidden" value="{{.Reference}}">
-<input id="editing_mode" name="edit_mode" type="hidden" value="{{(or .IsIssueWriter .HasIssuesOrPullsWritePermission)}}">
-<form method="post" action="{{$.RepoLink}}/issues/{{.Issue.Index}}/ref" id="update_issueref_form">
-	{{$.CsrfTokenHtml}}
-</form>
 <div class="ui dropdown select-branch branch-selector-dropdown ellipsis-items-nowrap {{if not .HasIssuesOrPullsWritePermission}}disabled{{end}}"
 	data-no-results="{{ctx.Locale.Tr "no_results_found"}}"
-	{{if not .Issue}}data-for-new-issue="true"{{end}}
+	{{if and .Issue (or .IsIssueWriter .HasIssuesOrPullsWritePermission)}}data-url-update-issueref="{{$.RepoLink}}/issues/{{.Issue.Index}}/ref"{{end}}
 >
 	<div class="ui button branch-dropdown-button">
 		<span class="text-branch-name gt-ellipsis">{{if .Reference}}{{$.RefEndName}}{{else}}{{ctx.Locale.Tr "repo.issues.no_ref"}}{{end}}</span>
diff --git a/web_src/js/features/repo-legacy.js b/web_src/js/features/repo-legacy.js
index b65938b045..2323d818c2 100644
--- a/web_src/js/features/repo-legacy.js
+++ b/web_src/js/features/repo-legacy.js
@@ -58,32 +58,27 @@ export function initRepoCommentForm() {
   function initBranchSelector() {
     const elSelectBranch = document.querySelector('.ui.dropdown.select-branch');
     if (!elSelectBranch) return;
-    const isForNewIssue = elSelectBranch.getAttribute('data-for-new-issue') === 'true';
 
+    const urlUpdateIssueRef = elSelectBranch.getAttribute('data-url-update-issueref');
     const $selectBranch = $(elSelectBranch);
     const $branchMenu = $selectBranch.find('.reference-list-menu');
     $branchMenu.find('.item:not(.no-select)').on('click', async function (e) {
       e.preventDefault();
-      const selectedValue = $(this).data('id'); // eg: "refs/heads/my-branch"
-      const editMode = $('#editing_mode').val();
-      $($(this).data('id-selector')).val(selectedValue);
-      if (isForNewIssue) {
-        elSelectBranch.querySelector('.text-branch-name').textContent = this.getAttribute('data-name');
-        return; // only update UI&form, do not send request/reload
-      }
-
-      if (editMode === 'true') {
-        const form = document.getElementById('update_issueref_form');
-        const params = new URLSearchParams();
-        params.append('ref', selectedValue);
+      const selectedValue = this.getAttribute('data-id'); // eg: "refs/heads/my-branch"
+      const selectedText = this.getAttribute('data-name'); // eg: "my-branch"
+      if (urlUpdateIssueRef) {
+        // for existing issue, send request to update issue ref, and reload page
         try {
-          await POST(form.getAttribute('action'), {data: params});
+          await POST(urlUpdateIssueRef, {data: new URLSearchParams({ref: selectedValue})});
           window.location.reload();
         } catch (error) {
           console.error(error);
         }
-      } else if (editMode === '') {
-        $selectBranch.find('.ui .branch-name').text(selectedValue);
+      } else {
+        // for new issue, only update UI&form, do not send request/reload
+        const selectedHiddenSelector = this.getAttribute('data-id-selector');
+        document.querySelector(selectedHiddenSelector).value = selectedValue;
+        elSelectBranch.querySelector('.text-branch-name').textContent = selectedText;
       }
     });
     $selectBranch.find('.reference.column').on('click', function () {