Update example with bootstrap 3
This commit is contained in:
		
							
								
								
									
										3
									
								
								.gitignore
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										3
									
								
								.gitignore
									
									
									
									
										vendored
									
									
								
							| @@ -1,3 +1,6 @@ | |||||||
| *.pyc | *.pyc | ||||||
|  | *.egg-info | ||||||
| .DS_Store | .DS_Store | ||||||
| docs/_build | docs/_build | ||||||
|  | /build | ||||||
|  | /dist | ||||||
|   | |||||||
| @@ -1,7 +1,16 @@ | |||||||
| from django import forms | from django import forms | ||||||
|  |  | ||||||
|  | CHOICES = ( | ||||||
|  |     (0, 'Zero'),  | ||||||
|  |     (1, 'One'),  | ||||||
|  |     (2, 'Two'), | ||||||
|  | ) | ||||||
|  |  | ||||||
| class ExampleForm(forms.Form): | class ExampleForm(forms.Form): | ||||||
|     title = forms.CharField() |     char_field = forms.CharField() | ||||||
|     choices = forms.ChoiceField(choices=((0, 'Zero'), (1, 'One'), (2, 'Two')), widget=forms.RadioSelect) |     choice_field = forms.ChoiceField(choices=CHOICES) | ||||||
|     password = forms.CharField(widget=forms.PasswordInput) |     radio_choice = forms.ChoiceField(choices=CHOICES, widget=forms.RadioSelect) | ||||||
|  |     file_fied = forms.FileField() | ||||||
|  |     password_field = forms.CharField(widget=forms.PasswordInput) | ||||||
|     textarea = forms.CharField(widget=forms.Textarea) |     textarea = forms.CharField(widget=forms.Textarea) | ||||||
|  |     boolean_field = forms.BooleanField() | ||||||
|   | |||||||
| @@ -2,31 +2,63 @@ | |||||||
| <!DOCTYPE html> | <!DOCTYPE html> | ||||||
| <html> | <html> | ||||||
|     <head> |     <head> | ||||||
|         <meta http-equiv="content-type" content="text/html; charset=utf-8"0> |         <meta http-equiv="content-type" content="text/html; charset=utf-8"> | ||||||
|         <meta name="viewport" content="width=device-width, initial-scale=1.0"> |         <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||||||
|         <link href="{{ STATIC_URL }}css/bootstrap.min.css" rel="stylesheet" media="screen"> |         <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css"> | ||||||
|         <title>Bootstrap form example</title> |         <title>Bootstrap form example</title> | ||||||
|  |  | ||||||
|     </head> |     </head> | ||||||
|     <body> |     <body> | ||||||
|         <div class="container"> |         <div class="container"> | ||||||
|             <h1>Bootstrap form example</h1> |  | ||||||
|             <hr /> |  | ||||||
|  |  | ||||||
|             <div class="row"> |             <div class="row"> | ||||||
|                 <div class="span12"> |                 <div class="span12"> | ||||||
|                     <form class="form-horizontal"> |                     <h1>Bootstrap form example</h1> | ||||||
|  |  | ||||||
|  |                     <p>below demostate how the form looks with bootstrap</p> | ||||||
|  |                 </div> | ||||||
|  |             </div> | ||||||
|  |  | ||||||
|  |             <!-- basic example --> | ||||||
|  |             <div class="row"> | ||||||
|  |                 <div class="span12"> | ||||||
|  |                     <h2>Basic example</h2> | ||||||
|  |  | ||||||
|  |                     <hr /> | ||||||
|  |  | ||||||
|  |                     <form class="form" role="form"> | ||||||
|                         {{ form|bootstrap }} |                         {{ form|bootstrap }} | ||||||
|                         <div class="form-actions"> |                         <div class="form-group"> | ||||||
|                             <input type="submit" class="btn btn-primary" value="Submit" /> |                             <div class="col-sm-12"> | ||||||
|  |                                 <input type="button" class="btn btn-primary" value="Submit" /> | ||||||
|  |                             </div> | ||||||
|                         </div> |                         </div> | ||||||
|                     </form> |                     </form> | ||||||
|                 </div> |                 </div> | ||||||
|             </div> |             </div> | ||||||
|  |  | ||||||
|  |  | ||||||
|  |             <!-- horizontal form --> | ||||||
|  |             <div class="row"> | ||||||
|  |                 <div class="span12"> | ||||||
|  |                     <h2>Horizontal form</h2> | ||||||
|  |  | ||||||
|  |                     <hr /> | ||||||
|  |  | ||||||
|  |                     <form class="form-horizontal" role="form"> | ||||||
|  |                         {{ form|bootstrap_horizontal }} | ||||||
|  |                         <div class="form-group"> | ||||||
|  |                             <div class="col-sm-offset-2 col-sm-10"> | ||||||
|  |                                 <input type="button" class="btn btn-primary" value="Submit" /> | ||||||
|  |                             </div> | ||||||
|  |                         </div> | ||||||
|  |                     </form> | ||||||
|  |                 </div> | ||||||
|  |             </div> | ||||||
|  |  | ||||||
|         </div> |         </div> | ||||||
|  |  | ||||||
|         <!-- scripts --> |         <!-- scripts --> | ||||||
|         <script src="http://code.jquery.com/jquery.js"></script> |         <script src="http://code.jquery.com/jquery.js"></script> | ||||||
|         <script src="{{ STATIC_URL }}js/bootstrap.min.js"></script> |         <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.2/js/bootstrap.min.js"></script> | ||||||
|     </body> |     </body> | ||||||
| </html> | </html> | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user
	 tzangms
					tzangms