Home > front end >  Refresh Values on Django Template using repeated AJAX calls
Refresh Values on Django Template using repeated AJAX calls

Time:10-17

I have a django webapp where I want to update a field with random values after every 10 seconds. Here's the code structure:

views.py

temp_values = [1, 2, 3, 3, 4, 5, 5, 6, 6, 7]

def get_temp():
    return temp_values[random.randint(0, 6)]


def ajax_data():
    data = {'temp': get_temp()}
    json_data = json.dumps(data)
    return Response(json_data, mimetypes='application/json')

class IndexPageView(TemplateView):
    template_name = 'main/index.html'


class ControlPageView(TemplateView):
    template_name = 'main/control.html'

    def index(self, request):
        return render(request, self.template_name, {})

    def get(self, request):
        form = ControlForm()
        return render(request, self.template_name, {'form': form})

    def post(self, request):
        form = ControlForm(request.POST)
        set_temp = 'bs'
        if form.is_valid():
            set_temp = form.cleaned_data['set_temp']
            write_to_register(2, set_temp)

        args = {'form': form, 'text': set_temp}
        return render(request, self.template_name, args)

control.html


<div >
  <div >

    <div >

      <h3>Temperature</h3>
      <input type="checkbox"> On/Off <br>
        <label>Current: </label><input type="text"  placeholder="34" disabled="disabled"><br>



      <form action="" method="POST">
        {% csrf_token %}

        <script src="http://code.jquery.com/jquery-3.0.0.js"></script>
      <script language="javascript" type="text/javascript">
        function updateValue() {
            $.ajax({
                    url:"/ajax_data",
                });
             $(".curr_temp").attr("placeholder", v);

        }
        $(document).ready(function(){
            var v = setInterval(updateValue,2000);
        });

    </script>
        {{ form.as_p }}
        
        <button type="submit">Set</button>
      </form>
      <img src="{% static 'img/graph.png' %}" alt="graph"/>
    </div>

urls.py

import random

from django.contrib import admin
from django.conf import settings
from django.urls import path, include
from django.conf.urls.static import static
from .utils import read_specific_response
import random

from main.views import IndexPageView, ChangeLanguageView, ControlPageView, ViewPageView


# pressure = read_specific_reponse(12)
# RPM = read_specific_reponse(29)

urlpatterns = [
    path('admin/', admin.site.urls),

    path('', IndexPageView.as_view(), name='index'),

    path('i18n/', include('django.conf.urls.i18n')),
    path('language/', ChangeLanguageView.as_view(), name='change_language'),

    path('control/', ControlPageView.as_view(), name='control'),
    path('view/', ViewPageView.as_view(), name='view'),

    path('accounts/', include('accounts.urls')),
]

if settings.DEBUG:
    urlpatterns  = static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

There is a current temp field & a set temp field (for which I have created a form which posts request on submit button click).

However console keeps throwing 404 url not found error. Please let me know where I am I going wrong

CodePudding user response:

You have to add your ajax_data view in your urls.py file

urlpatterns = [
    path('admin/', admin.site.urls),

    path('', IndexPageView.as_view(), name='index'),

    path('i18n/', include('django.conf.urls.i18n')),
    path('language/', ChangeLanguageView.as_view(), name='change_language'),

    path('control/', ControlPageView.as_view(), name='control'),
    path('view/', ViewPageView.as_view(), name='view'),
    path('ajax_data', ajax_data, name='ajax_data'),

    path('accounts/', include('accounts.urls')),
]
  • Related