mirror of
https://github.com/danbee/my-images
synced 2025-03-04 08:49:05 +00:00
Ended up not using Rails UJS after all
This commit is contained in:
parent
f5bc989048
commit
f134388fac
@ -9,7 +9,7 @@ class TagsController < ApplicationController
|
|||||||
image.save
|
image.save
|
||||||
render partial: "tags/tag", locals: { image: image, tag: tag }
|
render partial: "tags/tag", locals: { image: image, tag: tag }
|
||||||
else
|
else
|
||||||
head 200, content_type: "text/html"
|
head :no_content, content_type: "text/html"
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
|
|
||||||
@ -19,6 +19,6 @@ class TagsController < ApplicationController
|
|||||||
image.tags.delete(tag)
|
image.tags.delete(tag)
|
||||||
image.save
|
image.save
|
||||||
|
|
||||||
render json: { status: :ok }
|
head :no_content
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
|
|||||||
@ -5,7 +5,6 @@ export default class extends Controller {
|
|||||||
static targets = ["name"];
|
static targets = ["name"];
|
||||||
|
|
||||||
delete(event) {
|
delete(event) {
|
||||||
const imageId = this.element.dataset.imageId;
|
|
||||||
const tag = this.nameTarget.innerText;
|
const tag = this.nameTarget.innerText;
|
||||||
|
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
|
|||||||
@ -1,11 +1,20 @@
|
|||||||
import { Controller } from "stimulus";
|
import { Controller } from "stimulus";
|
||||||
|
import ajaxService from "../services/ajax_service";
|
||||||
|
|
||||||
export default class extends Controller {
|
export default class extends Controller {
|
||||||
static targets = ["tag", "tagList"]
|
static targets = ["tag", "tagList"]
|
||||||
|
|
||||||
onPostSuccess(event) {
|
create(event) {
|
||||||
let [data, status, xhr] = event.detail;
|
const tag = this.tagTarget.value;
|
||||||
this.tagListTarget.innerHTML += xhr.response;
|
|
||||||
|
event.preventDefault();
|
||||||
|
|
||||||
|
ajaxService.createTag(tag)
|
||||||
|
.then(response => {
|
||||||
|
if (response.status == 200) {
|
||||||
|
this.tagListTarget.innerHTML += response.data;
|
||||||
|
};
|
||||||
this.tagTarget.value = "";
|
this.tagTarget.value = "";
|
||||||
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -7,12 +7,9 @@
|
|||||||
// To reference this file, add <%= javascript_pack_tag 'application' %> to the appropriate
|
// To reference this file, add <%= javascript_pack_tag 'application' %> to the appropriate
|
||||||
// layout file, like app/views/layouts/application.html.erb
|
// layout file, like app/views/layouts/application.html.erb
|
||||||
|
|
||||||
import Rails from "rails-ujs";
|
|
||||||
import { Application } from "stimulus";
|
import { Application } from "stimulus";
|
||||||
import { definitionsFromContext } from "stimulus/webpack-helpers";
|
import { definitionsFromContext } from "stimulus/webpack-helpers";
|
||||||
|
|
||||||
Rails.start();
|
|
||||||
|
|
||||||
const application = Application.start();
|
const application = Application.start();
|
||||||
const context = require.context("controllers", true, /.js$/);
|
const context = require.context("controllers", true, /.js$/);
|
||||||
application.load(definitionsFromContext(context));
|
application.load(definitionsFromContext(context));
|
||||||
|
|||||||
@ -18,12 +18,15 @@ const config = () => ({
|
|||||||
headers: { "X-CSRF-Token": csrfToken() }
|
headers: { "X-CSRF-Token": csrfToken() }
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
createTag: (tag) => {
|
createTag: (tag) => {
|
||||||
|
return axios.post(`/user/images/${imageId()}/tags`, { tag }, config());
|
||||||
},
|
},
|
||||||
|
|
||||||
deleteTag: (tag) => {
|
deleteTag: (tag) => {
|
||||||
return axios.delete(`/user/images/${imageId()}/tags/${tag}.json`, config());
|
return axios.delete(
|
||||||
|
`/user/images/${imageId()}/tags/${encodeURIComponent(tag)}`,
|
||||||
|
config()
|
||||||
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -3,15 +3,9 @@
|
|||||||
<%= render "tags/tags", image: image, tags: image.tags %>
|
<%= render "tags/tags", image: image, tags: image.tags %>
|
||||||
|
|
||||||
<div class="new-tag-form">
|
<div class="new-tag-form">
|
||||||
<%= form_with url: user_image_tags_path(image),
|
<%= form_tag user_image_tags_path(image),
|
||||||
method: :post,
|
method: :post,
|
||||||
html: {
|
data: { action: "tags#create" } do %>
|
||||||
data: {
|
|
||||||
remote: true,
|
|
||||||
type: "html",
|
|
||||||
action: "ajax:success->tags#onPostSuccess"
|
|
||||||
}
|
|
||||||
} do %>
|
|
||||||
<%= text_field_tag :tag, nil, data: { target: "tags.tag" } %>
|
<%= text_field_tag :tag, nil, data: { target: "tags.tag" } %>
|
||||||
<%= submit_tag "Add Tag" %>
|
<%= submit_tag "Add Tag" %>
|
||||||
<% end %>
|
<% end %>
|
||||||
|
|||||||
@ -2,7 +2,6 @@
|
|||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@rails/webpacker": "3.5",
|
"@rails/webpacker": "3.5",
|
||||||
"axios": "^0.18.0",
|
"axios": "^0.18.0",
|
||||||
"rails-ujs": "^5.2.1",
|
|
||||||
"stimulus": "^1.1.0"
|
"stimulus": "^1.1.0"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
|||||||
@ -4563,10 +4563,6 @@ querystringify@^2.0.0:
|
|||||||
version "2.0.0"
|
version "2.0.0"
|
||||||
resolved "https://registry.yarnpkg.com/querystringify/-/querystringify-2.0.0.tgz#fa3ed6e68eb15159457c89b37bc6472833195755"
|
resolved "https://registry.yarnpkg.com/querystringify/-/querystringify-2.0.0.tgz#fa3ed6e68eb15159457c89b37bc6472833195755"
|
||||||
|
|
||||||
rails-ujs@^5.2.1:
|
|
||||||
version "5.2.1"
|
|
||||||
resolved "https://registry.yarnpkg.com/rails-ujs/-/rails-ujs-5.2.1.tgz#2869c6d54fdfefac3aaa257f4efe211d8f5a7169"
|
|
||||||
|
|
||||||
randomatic@^3.0.0:
|
randomatic@^3.0.0:
|
||||||
version "3.1.0"
|
version "3.1.0"
|
||||||
resolved "https://registry.yarnpkg.com/randomatic/-/randomatic-3.1.0.tgz#36f2ca708e9e567f5ed2ec01949026d50aa10116"
|
resolved "https://registry.yarnpkg.com/randomatic/-/randomatic-3.1.0.tgz#36f2ca708e9e567f5ed2ec01949026d50aa10116"
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user