Radio Button Example in Django to Change Background color on Django

0


 Radion Button Example in Django to Change Background color on Django?

Radiobutton is used to provide option-based UI where we can select only a single option.

Syntax for RadioButton

<input type="radio" name="r"   value= "xyz"  /> XYZ

<input type="radio" name="r"   value= "ABC"  /> ABC


Simple Code of urls.py:-

from django.urls import path
from . import views

urlpatterns=[
   # path('',views.welcome,name='welcome'),
   
    path('radioexample',views.radioexample,name='radioexample')
   
]

Simple code of views.py

def radioexample(request):
   if request.method=="POST":
      cs = request.POST["course"]
      return render(request,"helloapp/radioexample.html",{"res":cs})
   return render(request,"helloapp/radioexample.html")


Code of HTML file:-

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <form action="" method="post">
      {% csrf_token %}
      <input type="radio" name="course" value="C" />C
      <br>
      <input type="radio" name="course" value="CPP" />CPP
      <br>
      <input type="radio" name="course" value="DS" />DS
      <br>
      <input type="submit" name="btnsubmit" value="Click" />


    </form>
    {{res}}
</body>
</html>


Now I am explaining one example of RadioButton to take three different radio buttons to change background-color


Code of urls.py


from django.urls import path

from . import views


urlpatterns=[

    

path("radiodesign",views.radiodesign,name='radiodesign'),

path("radiocode",views.radiocode,name='radiocode')

        ];




Step2nd:-

Create two method on views.py to load design and write code?

def radiodesign(request):

return render(request,"employee/radiodesign.html")



def radiocode(request):

color = request.POST["color"]

return render(request,"employee/radiodesign.html",{'key':color})



step3rd:-


create templates/appname/radiodesign.html


<!DOCTYPE html>

<html>

<head>

<title></title>

</head>

<body bgcolor="{{key}}">


<form action="radiocode" method="post">

    {% csrf_token %}

     <input type="radio" name="color" value="Red" {% if key == 'Red'  %} checked="true" {% endif  %}>Red <br><br>

     <input type="radio" name="color" value="Green" {% if key == 'Green'  %} checked="true" {% endif  %}>Green <br><br>

     <input type="radio" name="color" value="Blue" {% if key == 'Blue'  %} checked="true" {% endif  %}>Blue <br><br>

     <input type="submit" name="btnsubmit" value="Click" />


</form>


</body>

</html>




Now you can implement the program, when we click on the radio button then the background color will be changed on the webpage.


I am using <body bgcolor="Red" >   property of body where the color will be implemented by views.py logic method.















.







'


Post a Comment

0Comments

POST Answer of Questions and ASK to Doubt

Post a Comment (0)