diff --git a/bitbake/lib/toaster/toastergui/static/js/layerdetails.js b/bitbake/lib/toaster/toastergui/static/js/layerdetails.js
index 0d4240b354..2ff8e598a9 100644
--- a/bitbake/lib/toaster/toastergui/static/js/layerdetails.js
+++ b/bitbake/lib/toaster/toastergui/static/js/layerdetails.js
@@ -10,6 +10,7 @@ function layerDetailsPageInit (ctx) {
   var targetTab = $("#targets-tab");
   var machineTab = $("#machines-tab");
   var detailsTab = $("#details-tab");
+  var editLayerSource = $("#edit-layer-source");
 
   /* setup the dependencies typeahead */
   libtoaster.makeTypeahead(layerDepInput, libtoaster.ctx.layersTypeAheadUrl, { include_added: "true" }, function(item){
@@ -423,4 +424,101 @@ function layerDetailsPageInit (ctx) {
   $(".glyphicon-trash").tooltip();
   $(".commit").tooltip();
 
+  editLayerSource.click(function() {
+    // Kindly bring the git layers imported from layerindex to normal page and not this new page :(
+    $(this).hide();
+    $("#save-changes-for-switch").attr("disabled", "disabled");
+
+    $("#git-repo-info", "#directory-info").hide();
+    $("#edit-layer-source-form").fadeIn();
+    if ($("#layer-dir-path-in-details").val() == "") {
+      //Local dir path is empty...
+      $("#repo").prop("checked", true);
+      $("#layer-git").fadeIn();
+      $("#layer-dir").hide();
+    } else {
+      $("#layer-git").hide();
+      $("#layer-dir").fadeIn();
+    }
+  });
+
+  $('input:radio[name="source-location"]').change(function() {
+    if ($('input[name=source-location]:checked').val() == "repo") {
+      $("#layer-git").fadeIn();
+      $("#layer-dir").hide();
+	if ($("#layer-git-repo-url").val().length === 0 && $("#layer-git-ref").val().length === 0) {
+	    $("#save-changes-for-switch").attr("disabled", "disabled");
+	}
+    } else {
+      $("#layer-dir").fadeIn();
+      $("#layer-git").hide();
+    }
+  });
+
+  $("#layer-dir-path-in-details").keyup(function() {
+    $("#save-changes-for-switch").removeAttr("disabled");
+  });
+
+  $("#layer-git-repo-url").keyup(function() {
+    if ($("#layer-git-repo-url").val().length > 0 && $("#layer-git-ref").val().length > 0) {
+      $("#save-changes-for-switch").removeAttr("disabled");
+    }
+  });
+
+  $("#layer-git-ref").keyup(function() {
+    if ($("#layer-git-repo-url").val().length > 0 && $("#layer-git-ref").val().length > 0) {
+      $("#save-changes-for-switch").removeAttr("disabled");
+    }
+  });
+
+  $('#cancel-changes-for-switch').click(function() {
+    editLayerSource.show();
+    $("#git-repo-info", "#directory-info").fadeIn();
+    $("#edit-layer-source-form").fadeOut();
+
+    if ($("#layer-dir-path-in-details").val().length) {
+      $("#dir").prop("checked", true);
+      $("#layer-git").fadeOut();
+      $("#layer-dir").fadeIn();
+    } else {
+      $("#layer-git").fadeIn();
+      $("#layer-dir").fadeOut();
+    }
+  });
+
+  $('#save-changes-for-switch').click(function() {
+
+    var layerData = {
+      vcs_url: $('#layer-git-repo-url').val(),
+      commit: $('#layer-git-ref').val(),
+      dirpath: $('#layer-subdir').val(),
+      local_source_dir: $('#layer-dir-path-in-details').val(),
+    };
+
+    if ($('input[name=source-location]:checked').val() == "repo") {
+      layerData.local_source_dir = "";
+    } else {
+      layerData.vcs_url = "";
+      layerData.git_ref = "";
+    }
+
+    $.ajax({
+        type: "POST",
+        url: ctx.xhrUpdateLayerUrl,
+        data: layerData,
+        headers: { 'X-CSRFToken' : $.cookie('csrftoken')},
+        success: function (data) {
+          if (data.error != "ok") {
+            console.warn(data.error);
+          } else {
+            /* success layer property changed */
+            window.location.reload();
+          }
+        },
+        error: function (data) {
+          console.warn("Call failed");
+          console.warn(data);
+        }
+    });
+  });
 }