堆棧內存溢出
  簡體   English   中英

如何將 javascript 變量值從一個 html 頁面傳遞到另一個 html 頁面？

[英]How to pass the javascript variable value from one html page to the another html page?

 原文  2020-05-27 13:07:16  0   2    javascript/ python/ html/ django/ ajax

問題描述

我正在使用 JavaScript 和 Django 創建測驗應用程序。 實際上整個邏輯都是在 JavaScript 中完成的。 對於測驗應用程序，我有一個分數變量，我在索引中顯示分數變量值。html 如下所示：

          resultCont.innerHTML = 'Your Score:- ' + score + '/80' ;

這里的分數是 JavaScript 變量。

另一件事我需要將此分數變量存儲到我的數據庫中。 因此，我需要使用 ajax 將分數變量發布到我的 views.py 文件中，我的 function 正在運行，以將分數與用戶名一起提交給 Django 模型。

模型.py：

class Results(models.Model):
    username = models.CharField(max_length=50,default='')
    score = models.IntegerField()

    def __str__(self):
        return self.username

在這里，我采用了用戶名和分數變量。 用戶名是外鍵。

視圖.py

def score(request):
    if request.method == 'GET':
        return render(request, 'quiz/html/end.html',{'form':Score()})
    else:
        try:
            form = Score(data=request.POST)
            newscore = form.save(commit=False)
            newscore.owner = request.user
            newscore.save()
            return redirect('category')
        except ValueError:
            return render(request, 'quiz/html/end.html',{'form':Score(), 'error' :'please fill the form properly'})

end.html：這里我使用表格提交分數和姓名。 我隱藏了用戶名，以便用戶無法更改名稱。

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

        <div>
            <p style="display:none;">
                <label for="id_username">Username:</label>
                <input type="text" name="username" value={{user.username}} placeholder="{{user.username}}" maxlength="50" required="" id="id_username">
            </p>

            <p>
                <label for="id_score">Score:</label>
                <input type="number" name="score" placeholder ='' value='I want the score value here from javascsript' required="" id="id_score">         
            </p>
        </div>
        <button type="submit">Submit</button>

    </form>

我寫了 ajax 發布請求，但我嘗試在同一索引中顯示分數。html。 它正在顯示，但我想要最后的分數值。html。 是否可以將index.html的分數（分數存儲在#result中）顯示到最后。html（分數需要存儲的地方）

function scoresubmit(){
          $.ajax({
            url: '/',
            method : 'POST',
            // data: {score: $('#score').val(), "csrfmiddlewaretoken" : "{{csrf_token}}"},
            success: function() {
              $('#name').html(score);
            }
             });
            }

index.html：（從這里）

resultCont.innerHTML = 'Your Score:- ' + score + '/80' ;

end.html:(到這里)

 <input type="number" name="score" placeholder ='' value='I want the score value here from javascsript' required="" id="id_score">

網址.py：

path('home', views.home,name = "home"),
    path('main',views.main, name='main'),
    path('', views.score, name = "score"),
    path('profile/',views.profile, name = "profile"),
    path('category/',views.category, name = "category"),

我在這里唯一想要的是將分數與用戶名一起存儲在我的數據庫（Django）中。

我的 ajax 代碼有什么問題。 如何使用 ajax 發布請求將值從一個傳遞到另一個 html？

2 個解決方案

解決方案1
 1  2020-05-29 16:15:24

嘿下面是我試過的代碼。 我在 index.html 中創建了一個表單。 獲取虛擬輸入，標記並對其執行一些操作並將變量分數發送到末尾。html 並將其存儲在數據庫中。 由於我使用的是 JS ajax，因此我使用了 djano-rest 框架。 下面是代碼

模型.py

from django.db import models
from django.contrib.auth.models import User


# Create your models here.
class Results(models.Model):
    user = models.ForeignKey(User, default=None, on_delete=models.CASCADE)
    score = models.IntegerField()
    marks = models.IntegerField()

索引.html

body>
    <form id="scoreform" method="POST">
        {% csrf_token %}
        <p class="marks">
            <label for="marks">Marks</label>
            <input type="number" name='marks' id="id_marks">
        </p>

        <input type="submit"  id="submit" value="Submit">
    </form>
</body>

<script src="{% static 'main.js' %}"></script>

end.html

<body>
    <form id="scoreform" method="POST">
        {% csrf_token %}
        <p class="username">
            <label for="username">Label</label>
            <input type="text" name="username" value={{score.user}}>
        </p>
        <p class="scores">
            <label for="score">Score</label>
            <input type="number" name='score' id="score-value" value={{score.score}}>
        </p>

    </form>
</body>

視圖.py

from django.shortcuts import render, redirect
from .models import Results
from .forms import Score
from django.contrib.auth.decorators import login_required
from rest_framework.decorators import api_view
from rest_framework.response import Response
from .serializers import ResultSerializer

# Create your views here.
@api_view(['GET','POST'])
@login_required(login_url='users:login')
def score(request):
    form = Score()
    print(1)
    if request.method == 'POST':
        serializer = ResultSerializer(data=request.data)
        print(serializer)
        if (serializer.is_valid()):
            print(3)
            serializer.save(user = request.user)
            return Response(request.user.pk)
    return render(request, 'index.html', {'form': form})
    #return redirect('score:end', pk=request.user.pk)   

@login_required(login_url='users:login')
def end(request, pk):
    score = Results.objects.get(pk=pk)
    return render(request, 'end.html', {'score':score})

這也具有登錄功能，因為我想將用戶標記到分數。 我不知道誰清楚這會適合你。 但我真的希望這會有所幫助

解決方案2
 0  2020-05-27 16:27:49

你能試試這個
在views.py文件中如果方法是GET，則創建一個Result實例Model like result = Result.objects.get(pk = pk) pk是指主鍵獲取特定用戶的結果，並通過在您的視圖中識別出一些獨特的方法，例如 pk。 然后使用模板標簽顯示在最后。html

暫無
暫無

聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

相關問題 如何在JavaScript中將值從一個html頁面傳遞到另一個頁面？ 如何將javascript / jquery函數從一個HTML頁面傳遞到另一HTML頁面 如何將動態變量從一個 html 頁面傳遞給 javascript？ 如何將文本框值從一個html頁面傳遞到另一個 如何使用JavaScript將值從一個HTML頁面傳遞到另一個HTML頁面？ 如何使用javascript將值從一個html頁面傳遞到另一個html頁面 如何僅使用JavaScript將表單數據從一個HTML頁面傳遞到另一HTML頁面？ 通過 JavaScript 將變量從一個 html 頁面傳遞到另一個頁面 將javascript變量從一個html頁面傳遞到另一頁面 如何使用html將值傳遞到另一個頁面
相關標簽
 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM