javascript 和 django

标签 javascript jquery django

我正在从 PHP 转换到 Django,事实证明这是一场真正的斗争。我想进行内联编辑(使用 PHP 和 Ajax 轻而易举),但我真的非常卡住了。很抱歉,对于接下来的大量代码。

我渲染了一个 2 个 div,其中包含许多字段,都是一样的。一个显示,另一个隐藏。当您单击编辑按钮时,将显示要更新的 div,并且数据位于输入框和选择下拉列表中,因此用户可以进行更改。 HTML 如下"

<div id="display1">
    <span style="width:50px;">
      <button class="edit" onclick="javascript:toggle('1')">EDIT</button>
    </span>
    <span>
        <a href="/recruit/1/">Blair Leighton</a>
    </span>
    <span>
        Intertrust Private Partners 
    </span>
    <span>
        Japan 
    </span>
    <span>
        hands off 
    </span>
    <span>
        not connected 
    </span>
    <span>
        notes 
    </span>
</div>
<div class="noshow" id="edit1">
    <span style="width:100px;"><button class="update" id="1">update</button></span>
    <span>
        Blair Leighton
    </span>
    <span style="width:220px;">
        <input type="textfield" style="width:210px;" id="new_company" value="Intertrust Private Partners" />
    </span>
    <span>
        <input type="text" id="new_country" value="Japan" />
    </span>
    <span>
        <select id="new_status">
            <option value="no contact">no contact</option>
            <option value="no contact">hands off</option>
            <option value="no contact">ongoing</option>
            <option value="no contact">sent email</option>
            <option value="no contact">waiting</option>
            <option value="no contact">trash</option>
        </select>
    </span>
    <span>
        <input type="text" id="new_connection" value="not connected" />
    </span>
    <span style="width:220px;">
        <input type="textfield" style="width:210px;" id="new_notes" value="notes" />
    </span>
</div>

事实上,还有许多其他 div 具有顺序 ID display2、edit2 等等。

单击切换按钮显示编辑 div 后,我想从每个字段(在 jquery 数组中)收集数据,然后将其传递给 django View 以更新数据库。

然后,保持在刷新以显示更新值的同一页面上。

我该怎么做?

models.py 是:

从 django.db 导入模型

class recruit(models.Model):
    first_name = models.CharField(max_length=25)
    last_name = models.CharField(max_length=35)
    position = models.CharField(max_length=55)
    company = models.CharField(max_length=55)
    country = models.CharField(max_length=125)
    connection = models.CharField(max_length=55)
    status = models.CharField(max_length=55)
    phone = models.CharField(max_length=55)
    placed = models.CharField(max_length=55)
    placed_with = models.CharField(max_length=55)
    skype = models.CharField(max_length=55)
    notes = models.TextField()
    company_url = models.CharField(max_length=125)

非常感谢收到所有帮助。谢谢。

理查德

最佳答案

有一些 django 应用程序可以为您完成这项工作,尽管我从未使用过它们。

快速谷歌搜索给了我这个:http://pypi.python.org/pypi/django-inplaceedit ,也许还有更多甚至更好的解决方案。

如果您真的想自己编写所有代码,我建议您使用 django-ModelForm而不是手动将所有字段放在一起。

然后您可以使用一些 javascript Hook 您的表单提交,使其通过 AJAX 提交。我正在使用 jQuery对于这样的任务,但任何其他 js 库(原型(prototype)、dojo、mootools 等)也可以完成这项工作。

在 Django 中,只需按照 ModelForm 的文档中描述的那样保护数据并将其传回响应中呈现的内容。 onSuccess 你的 AJAX 调用用你的响应文本更新页面,你就完成了。

对于 View ,您还可以使用 django 的 generic update views

您可能也对此感兴趣:https://stackoverflow.com/questions/708801/whats-the-best-edit-in-place-plugin-for-jquery

关于javascript 和 django,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14684043/

相关文章:

php - jQuery.AJAX post() - 一些疑问和问题

django - "error readlink/var/lib/docker/overlay2 invalid argument"当我运行 docker-compose up

python - 获取 Django REST 中金额字段结果的总和

javascript - 如何使用 jest 和 React-testing-library 测试某个元素是否不存在?

javascript - 调用 Facebook 的 BigPipe onPageletArrive 脚本

php - 您如何使调试代码远离生产环境?

python - 在 Django 中不属于您网站的抽象网址

javascript - D3js 图表未显示

c# - 如何在 asp.net 中获取客户端当前日期和时间?

javascript - 影响多个 div 的 jQuery 单击函数