Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/409.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/89.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何将切换开关与django布尔字段一起使用?_Javascript_Html_Css_Django - Fatal编程技术网

Javascript 如何将切换开关与django布尔字段一起使用?

Javascript 如何将切换开关与django布尔字段一起使用?,javascript,html,css,django,Javascript,Html,Css,Django,我有一个工作经验模型,其中包含“正在工作”字段,当用户仍在公司工作时,该字段为真。 在前端,我使用了一个切换开关,我想在单击时更改布尔字段值“正在工作”。 在django中使用toggle的逻辑应该是什么 切换开关 HTML <div style="display:inline-block"> <label>Currently working here?</label> <label class="switch">

我有一个工作经验模型,其中包含“正在工作”字段,当用户仍在公司工作时,该字段为真。 在前端,我使用了一个切换开关,我想在单击时更改布尔字段值“正在工作”。 在django中使用toggle的逻辑应该是什么

切换开关

HTML

<div style="display:inline-block">
    <label>Currently working here?</label>
    <label class="switch">
        <input type="checkbox">
        <span class="slider round"></span>
    </label>
</div>

CharField
提供
null=True
参数是个坏主意

如果要在单击时更改布尔字段值
正在工作
,则需要使用Jquery

我创建了一个名为
toggle
的应用程序,因此您需要将其替换为应用程序的名称

这是完整的代码

url.py::

from django.urls import path
from toggle.views import home, toggle

urlpatterns = [
    path('', home),
    path('toggle/', toggle),
]
视图。py:

from django.shortcuts import render
def home(request):
    w, created = Work_Experience.objects.get_or_create(id=1)
    return render(request,'home.html', {'workexperiance': w})

from django.http import HttpResponse
from toggle.models import Work_Experience
def toggle(request):
    w = Work_Experience.objects.get(id=request.POST['id'])
    w.is_working = request.POST['isworking'] == 'true'
    w.save()
    return HttpResponse('success')
<div style="display:inline-block">
    <label>Currently working here?</label>
    <label class="switch">
        <input type="checkbox" id="checkbox" value="{{workexperiance.is_working}}">
        <span class="slider round"></span>
    </label>
</div>
<script src="https://code.jquery.com/jquery-3.3.1.js"></script> <!-- Import Jquery Here-->
<script type="text/javascript">
$(document).ready(function() {
    $('#checkbox').change(function() {
        $.post("/toggle/", {
            id: '{{workexperiance.id}}', 
            isworking: this.checked, 
            csrfmiddlewaretoken: '{{ csrf_token }}' 
        });
    });
}); 
</script>
home.html:

from django.shortcuts import render
def home(request):
    w, created = Work_Experience.objects.get_or_create(id=1)
    return render(request,'home.html', {'workexperiance': w})

from django.http import HttpResponse
from toggle.models import Work_Experience
def toggle(request):
    w = Work_Experience.objects.get(id=request.POST['id'])
    w.is_working = request.POST['isworking'] == 'true'
    w.save()
    return HttpResponse('success')
<div style="display:inline-block">
    <label>Currently working here?</label>
    <label class="switch">
        <input type="checkbox" id="checkbox" value="{{workexperiance.is_working}}">
        <span class="slider round"></span>
    </label>
</div>
<script src="https://code.jquery.com/jquery-3.3.1.js"></script> <!-- Import Jquery Here-->
<script type="text/javascript">
$(document).ready(function() {
    $('#checkbox').change(function() {
        $.post("/toggle/", {
            id: '{{workexperiance.id}}', 
            isworking: this.checked, 
            csrfmiddlewaretoken: '{{ csrf_token }}' 
        });
    });
}); 
</script>

目前在这里工作?
$(文档).ready(函数(){
$('#复选框')。更改(函数(){
$.post(“/toggle/”{
id:“{{workexperiance.id}}”,
正在工作:这个。检查过了,
csrfmiddlewaretoken:“{{csrf_令牌}”
});
});
}); 
运行:
/manage.py runserver
并访问:
http://localhost:8000

当您单击当前在此处工作时?复选框将立即 更改布尔字段值“正在工作”