编辑帖子 - Django 和 Javascript 问题

如何解决编辑帖子 - Django 和 Javascript 问题

我是 Django 和 Javascript 的新手。我想在网站上创建一个编辑部分，人们可以在其中编辑已经存在的帖子。类似于 Facebook 或 Twitter。

当我在我的帖子上点击“编辑”时，在控制台中我得到： network.js:28 POST http://127.0.0.1:8000/edit_post/ 404（未找到）

我尝试了很多东西，但无法让它发挥作用。任何帮助表示赞赏。我认为这个问题可能与“post”和“text”的使用有关。 'text' 在我的模型中，用于表示实际帖子的文本。

views.py：

@login_required
@csrf_exempt
def edit_post(request):
    if request.method == "POST":
        post_id = request.POST.get('id')
        new_post = request.POST.get('text')
        try:
            post = Post.objects.get(id=post_id)
            if post.user == request.user:
                post.text = new_post.strip()
                post.save()
                return JsonResponse({},status=201)
        except:
            return JsonResponse({},status=404)

    return JsonResponse({},status=400)

models.py

class User(AbstractUser):
    pass

class Post(models.Model):
    text = models.TextField(max_length=500,blank=True,null=True)
    username = models.ForeignKey('User',on_delete=models.CASCADE,related_name='author',null=True,blank=True)
    timestamp = models.DateTimeField(auto_Now_add=True)      
    like = models.ManyToManyField(
        User,related_name="liked_user")

    def __str__(self):
        return self.user.username

Javascript 文件：

edit = document.querySelectorAll(".edit");
text_area = document.querySelectorAll(".textarea");

edit.forEach((element) => {

  element.addEventListener("click",() => {
    edit_handeler(element);
  });
});

text_area.forEach((element) => {
element.addEventListener("keyup",(e) => {
    if (e.keyCode == 13 && e.shiftKey) return;
    if (e.keyCode === 13) edit_handeler(element);
  });
});

  function edit_post(id,post) {
  form = new FormData();
  form.append("id",id);
  form.append("text",text.trim());  

  fetch("/edit_post/",{
    method: "POST",body: form,}).then((res) => {
    document.querySelector(`#post-content-${id}`).textContent = post; 
    document.querySelector(`#post-content-${id}`).style.display = 
"block";
    document.querySelector(`#post-edit-${id}`).style.display = "none";
    document.querySelector(`#post-edit-${id}`).value = text.trim();  

  });
}

function edit_handeler(element) {
  id = element.getAttribute("data-id");
  edit_btn = document.querySelector(`#edit-btn-${id}`);
  if (edit_btn.textContent == "Edit") {

    document.querySelector(`#post-content-${id}`).style.display = 
"none";
    document.querySelector(`#post-edit-${id}`).style.display = 
"block";

    edit_btn.textContent = "Save"; 
    edit_btn.setAttribute("class","text-success edit");

  } else if (edit_btn.textContent == "Save") {
    edit_post(id,document.querySelector(`#post-edit-${id}`).value); 

    edit_btn.textContent = "Edit";
    edit_btn.setAttribute("class","text-primary edit");
  }
}

部分 html 文件：

 {% if user1 == user2 %}
                  <span class="text-primary edit" data-id="{{i.id}}" 
id="edit-btn-{{i.id}}">Edit</span>
                  <br><br>
                  {% endif %}

                  <span id="post-content-{{i.id}}" class="post" 
   {{i.post}}</span>
         <textarea data-id="{{i.id}}" id="post-edit-{{i.id}}" 
style="display:none;" class="form-control textarea" row="3">{{i.text}}</textarea>

urls.py

urlpatterns = [
    path("",views.index,name="index"),path("make_post",views.make_post,name="make_post"),path("fol/<str:user>",views.fol,name="fol"),path("following_list/<str:username>",views.following_list,name='following_list'),path('like/',views.like),path('edit_post/',views.edit_post),path("profile/<str:username>",views.profile,name="profile"),path("login",views.login_view,name="login"),path("logout",views.logout_view,name="logout"),path("register",views.register,name="register"),]