Hi,

You need to write a piece of javascript that attaches to your radio buttons
to call some javascript function to do what ever you want to happen.

You can use js libraries like jquery to make things easier.

31.3.2018 14.15 "xueqi dong" <xueqidon...@gmail.com> kirjoitti:

<https://lh3.googleusercontent.com/-R_HFbMboDMs/Wr9ptIsjQQI/AAAAAAAAAwQ/qfzbfcmpuGEWKAtCHo1vDu-ehVHkmF_PwCLcBGAs/s1600/VwH9Q.png>
Hi, I would like to achieve the function as shown in the picture above.
When an user click the radio button Lottery 1, Lottery 1 in the table above
will become highlighted by colour yellow. When the form is initially
rendered, neither lotteries are highlighted.

I googled this and it seems that this has to be done on the client side and
has little to do with Django. But I am not sure how to track the value of
the selected choice in html. I know I can get the value of the submitted
choice use forms.cleaned_data in views.py.

In my form.py I have

class AnswerForm(forms.Form):
    ANSWER_CHOICES = (
        (1, 'Lottery 1'),
        (2, 'Lottery 2'),
    )
    answer = forms.ChoiceField(choices=ANSWER_CHOICES, widget=forms.RadioSelect)
    question = forms.IntegerField(widget=forms.HiddenInput)


In problems.html template I have

<!DOCTYPE html>
<html lang="en">



<p>Please make a choice between two lotteries.</p>
<p>Which lottery do you want choose   </p>



 <head>
      <title>Two lotteries</title>
   </head>
<body>
       <table BORDER=1 WIDTH="40%" HEIGHT="40%" border = "1"
bordercolor = "green">
         <tr>
            <td>               </td>
            <th>State 1</th>
               <th>State 2</th>
               <th>State 3</th>
         </tr>

         <tr bgcolor = {{colour1}}>
            <td>Lottery 1</td>
            <td>{{ problem.0 }}{{ sltlottery }}</td>
             <td>{{ problem.1 }} </td>
             <td>{{ problem.2 }}</td>
         </tr>

           <tr bgcolor ={{colour2}}>
            <td>Lottery 2</td>
            <td> {{ problem.3 }} </td>
             <td> {{ problem.4 }} </td>
             <td> {{ problem.5 }} </td>
         </tr>

      </table>

   </body>



<form action=" " method="post">
    {% csrf_token %}
    {{ form.as_p }}
    <input  type="submit" value="Submit">
</form>


It looks like i need a logic statement like the following :  if selected
choice =1, colour 1= "yellow", colour 2= "white"  else: colour 2= "yellow",
colour 1= "white"

There are two crucial steps I am not sure how to do.

First, after an user select on choice by click the Radio button, how can I
track the associated value?  For example, when Lottery 1 is selected, I
need selected choice =1.
Second, what is the easiest way to set write the logic statement in html? I
am even not quite sure where to put the logic statement...

Any help would be much appreciated!

Xueqi

-- 
You received this message because you are subscribed to the Google Groups
"Django users" group.
To unsubscribe from this group and stop receiving emails from it, send an
email to django-users+unsubscr...@googlegroups.com.
To post to this group, send email to django-users@googlegroups.com.
Visit this group at https://groups.google.com/group/django-users.
To view this discussion on the web visit
https://groups.google.com/d/msgid/django-users/3bca5139-ff0c-4124-a937-947b33bd2c4c%40googlegroups.com
<https://groups.google.com/d/msgid/django-users/3bca5139-ff0c-4124-a937-947b33bd2c4c%40googlegroups.com?utm_medium=email&utm_source=footer>
.
For more options, visit https://groups.google.com/d/optout.

-- 
You received this message because you are subscribed to the Google Groups 
"Django users" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to django-users+unsubscr...@googlegroups.com.
To post to this group, send email to django-users@googlegroups.com.
Visit this group at https://groups.google.com/group/django-users.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/django-users/CAHn91ofsLWuqcPrT5fksb503ZUT_Nn3BGF3mXCFxwc3OGG%2BTag%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.

Reply via email to