мне нужно, чтобы при нажатии на кнопку найти у меня открывался пдф файл, по id из бд(id вводится по input) попробовал сделать через js но не работает, подскажите как сделать?
let a
btn.onclick = function(e) {
e.preventDefault();
document.getElementById('form').style.display = 'none'
document.getElementById('pdf').style.display = 'block'
a = document.getElementById('floatingInput').value
}
html,
body {
height: 100%;
}
body {
display: flex;
align-items: center;
padding-top: 40px;
padding-bottom: 40px;
background-color: #f5f5f5;
}
.form-signin {
max-width: 330px;
padding: 15px;
}
.form-signin .form-floating:focus-within {
z-index: 2;
}
.form-signin input[type="email"] {
margin-bottom: -1px;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
.form-signin input[type="password"] {
margin-bottom: 10px;
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.img-block {
display: flex;
justify-content: center;
justify-items: center;
align-items: center;
width: 250px;
height: 150px;
}
.logo {
height: 100%;
width: auto;
}
{% load static %}
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
<meta name="generator" content="Hugo 0.104.2">
<link rel="canonical" href="https://getbootstrap.com/docs/5.2/examples/sign-in/">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<script defer src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
<link href="{% static 'css/style.css' %}" rel="stylesheet">
<style>
.pdf {
display: none;
position: absolute;
width: 100%;
height: 100%;
}
.bd-placeholder-img {
font-size: 1.125rem;
text-anchor: middle;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
@media (min-width: 768px) {
.bd-placeholder-img-lg {
font-size: 3.5rem;
}
}
.b-example-divider {
height: 3rem;
background-color: rgba(0, 0, 0, .1);
border: solid rgba(0, 0, 0, .15);
border-width: 1px 0;
box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
}
.b-example-vr {
flex-shrink: 0;
width: 1.5rem;
height: 100vh;
}
.bi {
vertical-align: -.125em;
fill: currentColor;
}
.nav-scroller {
position: relative;
z-index: 2;
height: 2.75rem;
overflow-y: hidden;
}
.nav-scroller .nav {
display: flex;
flex-wrap: nowrap;
padding-bottom: 1rem;
margin-top: -1px;
overflow-x: auto;
text-align: center;
white-space: nowrap;
-webkit-overflow-scrolling: touch;
}
</style>
<link href="{% static 'css/style.css' %}" rel="stylesheet">
</head>
<body class="text-center">
<embed src="{{ }}" class="pdf" id="pdf"/>
<main class="form-signin w-100 m-auto">
<form id="form" action="" method="POST">
{% csrf_token %}
<div class="img-block m-auto">
<img class="mb-4 logo" src="{% static 'images/logo.png' %}" alt="">
</div>
<div class="form-floating">
<input type="text" class="form-control" id="floatingInput" placeholder="name@example.com">
<label for="floatingInput">Номер задания</label>
</div>
<button class="w-100 btn btn-lg btn-primary mt-4" type="submit" id="btn">найти</button>
</form>
</main>
</body>
<script type="text/javascript" src="{% static 'js/main.js' %}"></script>
</html>
from django.db import models
class Numbers(models.Model):
abstract = models.FileField(upload_to="synopsisFiles/")
from django.shortcuts import render, redirect
from .models import Numbers
def index(request):
return render(request, 'main/index.html')