diff --git a/public/js/index.js b/public/js/index.js
index f1d308457..972f8f30d 100644
--- a/public/js/index.js
+++ b/public/js/index.js
@@ -2194,14 +2194,33 @@ function initTopicbar() {
         },
     });
 }
-function toggleDuedateForm() {
-    $('#add_deadline_form').fadeToggle(150);
+function toggleDeadlineForm() {
+    $('#deadlineForm').fadeToggle(150);
 }
 
-function deleteDueDate(url) {
-    $.post(url, {
-        '_csrf': csrf,
-    },function( data ) {
-        window.location.reload();
+function setDeadline() {
+    var deadline = $('#deadlineDate').val();
+    updateDeadline(deadline);
+}
+
+function updateDeadline(deadlineString) {
+    var issue_api_url = suburl + '/api/v1/repos/' + $('meta[name=_repo_owner]').attr("content") + '/' + $('meta[name=_repo_name]').attr("content") + '/issues/' + $('meta[name=_issue_index]').attr("content");
+
+    $('#deadline-loader').addClass('loading');
+
+    var realDeadline = null;
+    if (deadlineString !== '') {
+        realDeadline = deadlineString + 'T13:55:29.764Z';
+    }
+
+    $.ajax(issue_api_url + '/deadline', {
+        data: JSON.stringify({
+            'due_date': realDeadline,
+        }),
+        contentType: 'application/json',
+        type: 'POST',
+        complete: function () {
+            window.location.reload();
+        }
     });
 }
diff --git a/routers/api/v1/repo/issue.go b/routers/api/v1/repo/issue.go
index d8214e380..3295d08dd 100644
--- a/routers/api/v1/repo/issue.go
+++ b/routers/api/v1/repo/issue.go
@@ -338,7 +338,7 @@ func EditIssue(ctx *context.APIContext, form api.EditIssueOption) {
 func UpdateIssueDeadline(ctx *context.APIContext, form api.CreateDeadlineOption) {
 	// swagger:operation POST /repos/{owner}/{repo}/issues/{index}/deadline issue issueCreateIssueDeadline
 	// ---
-	// summary: Set an issue deadline
+	// summary: Set an issue deadline. If set to null, the deadline is deleted.
 	// consumes:
 	// - application/json
 	// produces:
diff --git a/templates/base/head.tmpl b/templates/base/head.tmpl
index a486d9b9b..14752e265 100644
--- a/templates/base/head.tmpl
+++ b/templates/base/head.tmpl
@@ -21,6 +21,13 @@
 	{{if .SearchLimit}}
 		<meta name="_search_limit" content="{{.SearchLimit}}" />
 	{{end}}
+	{{with .Repository}}
+		<meta name="_repo_owner" content="{{.Owner.Name}}" />
+		<meta name="_repo_name" content="{{.Name}}" />
+	{{end}}
+	{{with .Issue}}
+		<meta name="_issue_index" content="{{.Index}}" />
+	{{end}}
 {{if .GoGetImport}}
 	<meta name="go-import" content="{{.GoGetImport}} git {{.CloneLink.HTTPS}}">
 	<meta name="go-source" content="{{.GoGetImport}} _ {{.GoDocDirectory}} {{.GoDocFile}}">
diff --git a/templates/repo/issue/view_content/sidebar.tmpl b/templates/repo/issue/view_content/sidebar.tmpl
index 648533fca..f6d05598c 100644
--- a/templates/repo/issue/view_content/sidebar.tmpl
+++ b/templates/repo/issue/view_content/sidebar.tmpl
@@ -194,6 +194,7 @@
 
 		<div class="ui divider"></div>
 		<span class="text"><strong>{{.i18n.Tr "repo.issues.due_date"}}</strong></span>
+		<div class="ui form" id="deadline-loader">
 		{{if gt .Issue.DeadlineUnix 0}}
 			<p>
 				<span class="octicon octicon-calendar"></span>
@@ -203,8 +204,8 @@
 				{{end}}
 				{{if and .IsSigned .IsRepositoryWriter}}
 					<br/>
-					<a style="cursor:pointer;" onclick="toggleDuedateForm();"><i class="edit icon"></i>Edit</a> -
-					<a style="cursor:pointer;" onclick="deleteDueDate('{{$.RepoLink}}/issues/{{.Issue.Index}}/deadline/delete');"><i class="remove icon"></i>Remove</a>
+					<a style="cursor:pointer;" onclick="toggleDeadlineForm();"><i class="edit icon"></i>Edit</a> -
+					<a style="cursor:pointer;" onclick="updateDeadline('');"><i class="remove icon"></i>Remove</a>
 				{{end}}
 			</p>
 		{{else}}
@@ -212,20 +213,17 @@
 		{{end}}
 
 		{{if and .IsSigned .IsRepositoryWriter}}
-			<form method="POST"{{if gt .Issue.DeadlineUnix 0}}style="display: none;"{{end}}} id="add_deadline_form" action="{{$.RepoLink}}/issues/{{.Issue.Index}}/deadline/update" class="ui action input fluid">
-				{{$.CsrfTokenHtml}}
-				<div class="ui fluid action input">
-					<input required placeholder="{{.i18n.Tr "repo.issues.due_date_form"}}" {{if gt .Issue.DeadlineUnix 0}}value="{{.Issue.DeadlineUnix.Format "2006-01-02"}}"{{end}} type="date" name="date" style="min-width: 13.9rem;border-radius: 4px 0 0 4px;border-right: 0;white-space: nowrap;">
-					<button class="ui green icon button">
-					{{if gt .Issue.DeadlineUnix 0}}
-							<i class="edit icon"></i>
-					{{else}}
-							<i class="plus icon"></i>
-					{{end}}
-					</button>
-				</div>
-			</form>
+			<div class="ui fluid action input"{{if gt .Issue.DeadlineUnix 0}} style="display: none;"{{end}} id="deadlineForm">
+				<input required placeholder="{{.i18n.Tr "repo.issues.due_date_form"}}" {{if gt .Issue.DeadlineUnix 0}}value="{{.Issue.DeadlineUnix.Format "2006-01-02"}}"{{end}} type="date" name="deadlineDate" id="deadlineDate" style="min-width: 13.8rem;border-radius: 4px 0 0 4px;border-right: 0;white-space: nowrap;">
+				<button class="ui green icon button" onclick="setDeadline();">
+				{{if gt .Issue.DeadlineUnix 0}}
+					<i class="edit icon"></i>
+				{{else}}
+					<i class="plus icon"></i>
+				{{end}}
+				</button>
+			</div>
 		{{end}}
-
+		</div>
 	</div>
 </div>