Saturday, March 31, 2018

Re: how to update form after a user select a choice

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" <xueqidong77@gmail.com> kirjoitti:

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+unsubscribe@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.
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+unsubscribe@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.

No comments:

Post a Comment