La moltiplicazione dei fields

[mau_develop]

...più che altro per chiedere un parere a chi già si è dedicato a qs implementazione, e cmq lo script funziona in mancanza di meglio
Lato admin J3.0
devo inserire input ma non so quanti...1 ..10...1000?
poi come li chiamo ... nome 1 nome 2 ... bah
.... JQuery!

creo un custom input field:

Codice: [Seleziona]

class JFormFieldNamesinput extends JFormField{

    protected $type = 'Namesinput';

    protected function getInput(){
         
        $out = '';
        isset($this->element['class']) && $this->element['class'] != '' ?
        $class = htmlspecialchars($this->element['class']) :
        $class = '';
       
        isset($this->element['size']) && $this->element['size'] ?
        $size =  (int)$this->element['size'] :
        $size = '';
       
        isset($this->element['placeholder']) && $this->element['placeholder'] != '' ?
        $placeholder = htmlspecialchars($this->element['placeholder']) :
        $placeholder = '';
   
        $btnremove='<a class="btn" href="#" id="remName"><i class="icon-cancel"></i></a>';
       
        // bottone add
        $out .= '<a class="btn" href="#" id="addName"><i class="icon-save-new"></i> '.JText::_(' aggiungi un nome').'</a>';
        // input field
        $inputfld = '<input type="text" id="'.$this->id.'" size="20" name="'.$this->name.'[]" value="" placeholder="'.$placeholder.'" />';
        foreach($this->value as $k=>$val){
            $out .= '<div id="pnames">
                        <p><input type="text" id="'.$this->id.'" size="20" name="'.$this->name.'[]" value="'.$val.'" placeholder="'.$placeholder.'" />';
            if($k >= 1) $out .= $btnremove;
           
            $out .= '</p></div>';
       
        }
       
        JFactory::getDocument()->addScriptDeclaration("
            $(function() {
                var namesDiv = $('#pnames');
       
                $('#addName').live('click', function() {
                    $('<p>$inputfld $btnremove</p>').appendTo(namesDiv);
                    return false;
                });
       
                $('#remName').live('click', function() {
                    $(this).parents('p').remove();
                    return false;
                });
               
            });

        ");
       
        return $out;
       
    }

nell'xml la definizione del field:

Codice: [Seleziona]

<field name="sname"
            type="namesinput"
            class="inputbox"
            size="30"
            maxlenght="45"
            placeholder="inserisci un nome"
            label="Nomi"
            description="Inserimento nomi"
            />

nella table->bind:

Codice: [Seleziona]

if (isset($array['sname']) && is_array($array['sname'])) {
            $registry = new JRegistry;
            $registry->loadArray($array['sname']);
            $array['sname'] = (string) $registry;
        }

nel model form->loadFormData(), appena dopo:

Codice: [Seleziona]

if (empty($data)) {
            $data = $this->getItem();

inserire:

Codice: [Seleziona]

$registry = new JRegistry;
            $registry->loadString($data->sname);
            $data->set('sname',$registry->toArray());

nella view bisogna caricare JQuery_latest.
Ho pensato di usare JQury senza nessun plugin poichè ha quell'ottima .append che già risolveva il problema

il campo sname del db è di tipo text

E' scritto su J3.0

PS non implementatelo senza fare i check dei campi nei file/metodi  appropriati, ve lo bucano in 0 secondi

a RI PS @simone: come si fa con moo?

[simone83]

Dovrebbe essere

Codice: [Seleziona]

window.addEvent('domready',function(){
                                   
    var namesDiv = $('pnames');
   
    var btnRemove= new Element('a',{'class':'btn removeEvent','href':'javascript:void(0)','id':'remName','html':'<i class=\"icon-cancel\">'});
    var inputfld = new Element('input',{'type':'text','id':'".$this->id."', 'size':20,'name': '".$this->name."[]','placeholder':'".$placeholder."' });
   
    $('addName').addEvent('click', function() {
           
            var nRow=new Element('p');
           
            inputfld.inject(nRow);
            btnRemove.inject(nRow,'bottom');
           
            btnRemove.addEvent('click',function(){
                    nRow.destroy();                           
            })
           
            nRow.inject(namesDiv,'bottom');
            return false;
    });
   
    $$('.removeEvent').addEvent('click', function() {
        this.getParent().destroy();
        return false;
    });

})
Te l'ho fatto su un file javascript e quindi non ho controllato gli apici per il php quindi guardaci, c'e un errore nei bottoni remove xche cosi facendo crei bottoni con lo stesso id e dopo non funzione, quindi invece di trovarti l'id ti faccio trovare la classe removeEvent che ho messo nel js ma va anche nel php.

Guarda se ti funziona xche sono poco lucido, non dormo da 4 giorni 

[mau_develop]

, c'e un errore nei bottoni remove xche cosi facendo crei bottoni con lo stesso id e dopo non funzione
---------------------------------------------------------
mmmhh ..nn ho capito...nel mio? sì probabile ma funziona ugualmente poichè il parent per lui è ciò che è incluso insieme al p nel div ... o sbaglio?
Tieni presente che quando uso js ci arrivo per deduzioni, lo conosco veramente poco...

mettere un id non mi costa nulla tanto dovrei comunque implementare un contatore altrimenti così ne crei infiniti e generi ugualmente una vulnerabilità, ovviamente mettendolo anche nel check().
Mettendolo solo nel check poi ti mandano a quel paese quando ne compilano 10 e ne salvi 5
Dovrebbe essere il size() dei p +1.

Se provi il mio script, che cmq è buttato giù perchè in realtà mi occorre una cosa più complessa, succede che la nuova input la colloca subito dopo la prima anche se ce ne sono già 2.. why?

[simone83]

Se provi il mio script, che cmq è buttato giù perchè in realtà mi occorre una cosa più complessa, succede che la nuova input la colloca subito dopo la prima anche se ce ne sono già 2.. why?

devi usare append non appendTo in jquery

http://api.jquery.com/append/

mettere un id non mi costa nulla

questo non lo so se jquery e cosi inteligente, i mootools se cerchi un elemnto per id ti restiruisce il primo xche suppone che sia uno solo e quindi il bottone che metti tu ti cancella solo il primo p perche riferito al primo bottone che trova.

[mau_develop]

con append  al primo click scompare tutto il field

comunque ho capito una cosa, quell'append to in realtà non appende il div ma concatena i p
se io faccio la foreach come ho fatto scombussolo tutto perchè includo il div. me ne sono accorto perchè mettendo il contatore:

Codice: [Seleziona]

var i = $('#pnames p').size() + 1;
veniva sempre 2 poichè conta i p dentro quel div.
Portato fuori dalla foreach il div appende sotto correttamente.

Per quanto riguarda l'intelligenza di JQuery ti posso dire  praticamente nulla, non oso criticare o apprezzare una cosa che ignoro ... comunque pare sia così, il parent è il tag in cui è chiuso, p

[mau_develop]

in qs modo e modificando opportunamente il codice si può gestire chessò... una riga di una fattura? ... evitare un cross con una tabella?

Codice: [Seleziona]

protected function getInput(){
         
        $out = '';
        isset($this->element['class']) && $this->element['class'] != '' ?
        $class = htmlspecialchars($this->element['class']) :
        $class = '';
       
        isset($this->element['size']) && $this->element['size'] ?
        $size =  (int)$this->element['size'] :
        $size = '';
       
        isset($this->element['placeholder']) && $this->element['placeholder'] != '' ?
        $placeholder = htmlspecialchars($this->element['placeholder']) :
        $placeholder = '';
   
        $btnremove='<a class="btn" href="#" id="remName"><i class="icon-cancel"></i></a>';
       
        // bottone add
        $out .= '<a class="btn" href="#" id="addName"><i class="icon-save-new"></i> '.JText::_(' aggiungi un nome').'</a>';
     
        $out .= '<div id="pnames">';
       
        $c=0;
       
        for($c=0; $c<count($this->value['name']); $c++){
           
           // print_r($this->value['name']);
            $out .= '<p>';
            $out .= '<input type="text" id="'.$this->id.'_name" size="20" name="'.$this->name.'[name][]" value="'.$this->value['name'][$c].'" placeholder="'.$placeholder.'" />';
            $out .= '<input type="text" id="'.$this->id.'_surname" size="20" name="'.$this->name.'[surname][]" value="'.$this->value['surname'][$c].'" placeholder="'.$placeholder.'" />';
           
            if($c >= 1) $out .= $btnremove;
           
            $out .= '</p>';
       
        }
        $out .= '</div>';
       
        JFactory::getDocument()->addScriptDeclaration("
            $(function() {
               
                var namesDiv = $('#pnames');
       
                $('#addName').live('click', function() {
                    $('<p><input type=\"text\" id=\"{$this->id}_name\" size=\"20\" name=\"{$this->name}[name][]\" value=\"\" placeholder=\"{$placeholder}\" /><input type=\"text\" id=\"{$this->id}_surname\" size=\"20\" name=\"{$this->name}[surname][]\" value=\"\" placeholder=\"{$placeholder}\" />{$btnremove}</p>').appendTo(namesDiv);
                    return false;
                });
       
                $('#remName').live('click', function() {
                    $(this).parents('p').remove();
                    return false;
                });
               
            });

        ");
       
        return $out;
       
    }