|
|
## Παράδειγμα προσθήκης εξτρα ελέγχου : ΑΦΜ
|
|
|
### Οδηγίες
|
|
|
> **Σενάριο:** Έχετε δημιουργήσει ήδη μια φόρμα και έχετε ένα πεδίο στο οποίο θέλετε να συμπληρωθεί το ΑΦΜ από τον επισκέπτη.
|
|
|
|
|
|
1. Πρέπει να βρειτε το όνομα του πεδίου (id=...) μέσω της επιλογής **view-source του** browser πχ στην δική μας περίπτωση είναι edit-submitted-pd-l3-z . ***(1)**
|
|
|
2. Βάλτε ένα νέο πεδίο τύπου **Markup** **ΜΕΤΑ** το πεδίο κειμένου που έχετε φτιάξει για το ΑΦΜ .
|
|
|
3. βάλτε **Μορφότυπο κειμένου : Full HTML**
|
|
|
4. προσθεστε τον παρακάτω κώδικα στο value :
|
|
|
|
|
|
```javascript
|
|
|
<script>
|
|
|
// Στον παρακάτω κώδικα αντικαταστείστε το "edit-submitted-pd-l3-z" με τον id του πεδίου που σας ενδιαφέρει.
|
|
|
|
|
|
function checkAFM(afm) {
|
|
|
if (!afm.match(/^\d{9}$/) || afm == '000000000')
|
|
|
return false;
|
|
|
var m = 1, sum = 0;
|
|
|
for (var i = 7; i >= 0; i--) {
|
|
|
m *= 2;
|
|
|
sum += afm.charAt(i) * m;
|
|
|
}
|
|
|
return sum % 11 % 10 == afm.charAt(8);
|
|
|
}
|
|
|
|
|
|
function afm_init_check() {
|
|
|
//Εδώ καλούμε μια function checkAFM που επιστρέφει true/false και εμφανίζουμε το κατάλληλο μήνυμα.
|
|
|
var afm=document.getElementById("edit-submitted-pd-l3-z").value;
|
|
|
if(!checkAFM(afm)) alert ("ΛΑΘΟΣ ΑΦΜ");
|
|
|
}
|
|
|
|
|
|
var el = document.getElementById("edit-submitted-pd-l3-z");
|
|
|
//Εδώ προσθέτουμε τον Listerner στο πεδίο μας. 'Οταν χάσει το focus το πεδίο αυτό τότε θα εκτελείται η function afm_init_check
|
|
|
el.addEventListener("blur", afm_init_check);
|
|
|
</script>
|
|
|
```
|
|
|
5. Εκτελούμε δοκιμές στην φόρμα μας (κατά προτίμηση σε πιο παλιά και αργά PC) για να σιγουρευτούμε ότι η φόρμα μας συμπεριφέρεται όπως επιθυμούμε.
|
|
|
|
|
|
|
|
|
|
|
|
### Παραδείγματα για τα παραπάνω βήματα:
|
|
|
#### *(1) Παραδειγμα για το βήμα 1:
|
|
|
Έστω ότι έχτε ονομάσει το πεδίο ΑΦΜ. Επιλέγετε το προβολή κώδικα στον firefox/chrome κτλ
|
|
|
Στον κώδικα HTML της σελίδας σας κάνετε αναζήτηση για "ΑΦΜ" θα βρείτε ένα σημείο που θα έχει κάτι σαν :
|
|
|
```html
|
|
|
<label for="edit-submitted-pd-l-a">ΑΦΜ </label>
|
|
|
<input type="text" id="edit-submitted-pd-l3-z" name="submitted[pd][l3][z]" value="123456789" size="60" maxlength="128" class="form-text" />
|
|
|
```
|
|
|
Αυτό που μας ενδιαφέρει είναι το τμήμα που λέει
|
|
|
```html
|
|
|
<input type="text" id="edit-submitted-pd-l3-z"
|
|
|
```
|
|
|
|
|
|
Από εδώ βρίσκουμε ότι το id που θέλουμε είναι το **edit-submitted-pd-l3-z**
|
|
|
|