"…mais ce serait peut-être l'une des plus grandes opportunités manquées de notre époque si le logiciel libre ne libérait rien d'autre que du code…"

Une application Web Django (POST)…

Posted by patrick sur juillet 19, 2007

Je poursuis à la fois la lecture du livre ‘RESTful Web Services’ et la lecture du tutorial 4 de django. Lors du billet concernant la méthode HTTP ‘GET’ on a vu que la seule façon d’appeler la méthode ‘POST’ était de passer par un formulaire.

D’abord, je renomme le fichier bookmark/index.html en bookmark/details.html. Je modifie le fichier /cygdrive/e/projets/pybookmarks/bookmarks/views.py en conséquence.

Je mets à jour Django: cd ~/django-src; svn update

$ svn update
U django/conf/locale/sv/LC_MESSAGES/django.po
U django/conf/locale/sv/LC_MESSAGES/django.mo
A django/contrib/localflavor/sk
A django/contrib/localflavor/sk/__init__.py
A django/contrib/localflavor/sk/sk_regions.py
A django/contrib/localflavor/sk/sk_districts.py
A django/contrib/localflavor/sk/forms.py
U tests/regressiontests/forms/localflavor.py
U AUTHORS

Actualisé révision 5724.

Je relance le serveur HTTP: python manage.py runserver

A voir le tutoriel 04 (« This tutorial begins where Tutorial 3 left off. We’re continuing the Web-poll application and will focus on simple form processing and cutting down our code« ) et surtout le tutoriel sur les vues génériques de Django (http://www.djangoproject.com/documentation/generic_views/)

Je regarde d’abord ce qui se passe lorsque j’ajoute un objet de type ‘tag’ et que je le modifie à l’aide de l’interface d’administration de django:

Requete POST

[19/Jul/2007 12:11:55] « POST /admin/bookmarks/tag/add/ HTTP/1.1 » 302 0
….
[19/Jul/2007 12:14:08] « POST /admin/bookmarks/tag/4/ HTTP/1.1 » 302 0
[19/Jul/2007 12:14:09] « GET /admin/bookmarks/tag/4/ HTTP/1.1 » 200 2481

Comme on pouvait s’y attendre la requête HTTP ‘POST’ sert aussi bien à la création ‘test’ qu’à la modification ‘test_post’ puisqu’à l’heure actuelle (juillet 2007) les formulaires HTML n’acceptent que des requêtes ‘GET’ ou ‘POST’.

Si on regarde le code XHTML (strict puique voici l’entête du document: <!DOCTYPE html PUBLIC « -//W3C//DTD XHTML 1.0 Strict//EN » « http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd »&gt;) concernant le formulaire voilà ce que l’on a:

<form action="" method="post" id="tag_form">
<div>

   <fieldset class="module aligned ()">

   <div class="form-row" >

    <label for="id_name" class="required">Name:</label>

    <input type="text" id="id_name" class="vTextField required" name="name" size="30" value="test" maxlength="100" />
   </div>

   </fieldset>   <div class="submit-row">

      <p class="float-left"><a href="delete/" class="deletelink">Delete</a></p>

      <input type="submit" value="Save and add another" name="_addanother"  />

      <input type="submit" value="Save and continue editing" name="_continue" />

      <input type="submit" value="Save" class="default" />
   </div>

</div>
</form>

On voit que Django utilise bien les CSS :)(media/css/forms.css) que voici:

/* FORM ROWS */
.form-row { overflow:hidden; padding:8px 12px; font-size:11px; border-bottom:1px solid #eee; }
.form-row img, .form-row input { vertical-align:middle; }
form .form-row p { padding-left:0; font-size:11px; }
/* FORM LABELS */
form h4 { margin:0 !important; padding:0 !important; border:none !important; }
label { font-weight:normal !important; color:#666; font-size:12px; }
label.inline { margin-left:20px; }
.required label, label.required { font-weight:bold !important; color:#333 !important; }
/* MODULES */
.module { border:1px solid #ccc; margin-bottom:5px; background:white; }
.module p, .module ul, .module h3, .module h4, .module dl, .module pre { padding-left:10px; padding-right:10px; }
.module blockquote { margin-left:12px; }
.module ul, .module ol { margin-left:1.5em; }
.module h3 { margin-top:.6em; }
.module h2, .module caption { margin:0; padding:2px 5px 3px 5px; font-size:11px; text-align:left; font-weight:bold; background:#7CA0C7 url(../img/admin/default-bg.gif) top left repeat-x; color:white; }
.module table { border-collapse: collapse; }
/* FORM DEFAULTS */
input, textarea, select { margin:2px 0; padding:2px 3px; vertical-align:middle; font-family:"Lucida Grande", Verdana, Arial, sans-serif; font-weight:normal; font-size:11px; }
textarea { vertical-align:top !important; }
input[type=text], input[type=password], textarea, select, .vTextField { border:1px solid #ccc; }
.float-right { float:right; }
.float-left { float:left; }
.clear { clear:both; }
.align-left { text-align:left; }
.align-right { text-align:right; }
input[type=submit], input[type=button], .submit-row input { background:white url(../img/admin/nav-bg.gif) bottom repeat-x; padding:3px; color:black; border:1px solid #bbb; border-color:#ddd #aaa #aaa #ddd; }
input[type=submit]:active, input[type=button]:active { background-image:url(../img/admin/nav-bg-reverse.gif); background-position:top; }
input[type=submit].default, .submit-row input.default { border:2px solid #5b80b2; background:#7CA0C7 url(../img/admin/default-bg.gif) bottom repeat-x; font-weight:bold; color:white; }
input[type=submit].default:active { background-image:url(../img/admin/default-bg-reverse.gif); background-position:top; }

 /* ACTION ICONS */
.addlink { padding-left:12px; background:url(../img/admin/icon_addlink.gif) 0 .2em no-repeat; }
.changelink { padding-left:12px; background:url(../img/admin/icon_changelink.gif) 0 .2em no-repeat; }
.deletelink { padding-left:12px; background:url(../img/admin/icon_deletelink.gif) 0 .25em no-repeat; }
a.deletelink:link, a.deletelink:visited { color:#CC3434; }
a.deletelink:hover { color:#993333; }

Bravo pour le côté artistique ! C’est vrai que ça ne s’invente pas. Voilà ce que l’on aurait sans les feuilles de style CSS:

Adlin sans les CSS

Bon ça c’était pour montrer quel travail de Romain il fallait pour saisir simplement un simple champ texte.

Regardons maintenant les vues génériques de Django 

The django.views.generic.create_update module contains a set of functions for creating, editing and deleting objects.

django.views.generic.create_update.create_object

Description:

A page that displays a form for creating an object, redisplaying the form with validation errors (if there are any) and saving the object. This uses the automatic manipulators that come with Django models.

En cours…..

A voir:

http://code.google.com/hosting/search?q=label:django

http://www.djangosites.org/latest/

http://code.google.com/p/django-rest-interface/

http://code.google.com/p/django-restful-model-views/

Laisser un commentaire

Entrez vos coordonnées ci-dessous ou cliquez sur une icône pour vous connecter:

Logo WordPress.com

Vous commentez à l'aide de votre compte WordPress.com. Déconnexion / Changer )

Image Twitter

Vous commentez à l'aide de votre compte Twitter. Déconnexion / Changer )

Photo Facebook

Vous commentez à l'aide de votre compte Facebook. Déconnexion / Changer )

Photo Google+

Vous commentez à l'aide de votre compte Google+. Déconnexion / Changer )

Connexion à %s

 
%d blogueurs aiment cette page :