dodavanje/brisanje input fields javascriptom
1 Prilog(a)
ovih dana me hoce javascript. treba mi nesto hitno, pa ako netko ima nesto gotovo ili ideju kako najjednostavnije/najbrze da izvedem ovo, pliz pliz pliz! :)
u attachmentu je slika forme. dakle, covjek bas bas hoce javascriptom dodavat/micat setove polja za unos. ima li ko sta gotovo? hvala unaprijed! |
Pogledaj ovde:
http://onlinetools.org/articles/unob.../chapter3.html |
Najlakše je da kloniraš. Stavi prototip reda u neki skriveni div...
Kôd:
<div id="skriveni" style="display: none;"><div class="red"> Kôd:
<form ...> js: Kôd:
addNewRow = function () { |
Citat:
idem isprobavat ovo sad pa javljam rezultate. puno hvala! |
radi savrseno!
samo jedno dodatno pitanje -> kako da ovo koristim kad editiram postojece zapise iz baze? znaci, citam iz baze x zapisa i njima punim setove (rowove), kako im pridjeljujem vrijednosti? smijem li echo onoliko inputa koliko ih ima u bazi sa odgovarajucim imenima (tipa polje1[] itd itd) ili moram punit javascript polja? prvo mi je jasno, drugo nisam siguran? |
uhh radio sam nesto slicno pre nekoliko meseci uspeh da nadjem :)
http://dev.emigma.com/skat_trgovina/...hitri&item=40# posto je to radjeno oko 3-4ujutru nemoj ocekivati mnogo ali sta znam mozda ti pomogne. Inace ovo je radjeno sa predefinisanim brojem polja. Mada mislim da sam negde radio i sa neogranicenim... sacu da pogledam |
Po mom mišljenju, najbolje ti je da u jednom trenutku samo jedan red bude editabilan, tj. da imaš samo po jedan set form elemenata na stranici.
|
Citat:
|
Citat:
npr. PHP kôd:
je l' to - to, il' sam promasio poentu? :) |
Milism da jesi ... ovde se od rekorda tabele generise neko input polje
|
Kôd:
addNewRow = function (vrednost) { Sad samo pozoves addNewRow('ovde neka vrednost') i lepo... Nedavno sam za klijenta radio nesto slicno, naravno na ovom principu, tako da mogu da okacim deo koda ili pomognem dodatno... P.S. Kod gore podrazumeva da je u pitanju text polje.. Ako je u pitanju select, onda promeni selectedIndex (npr. novo.selectedIndex = 1). Index naravno pocinje od nule. |
Hm, pa prvo dete 'skrivenog' je red (div) a ne element forme, tako da ovom izmenom praktično ne menjaš ništa.
Citat:
Inače, i ovo kloniranje redova s elementima formulara ima svoje zamke - prvi korak je što elementi u name atributu imaju '[]' - a tu leži i zamka - jer ukoliko se u tom redu nalazi checkbox ili radio button, ili pak multiselect - nastaje prava zbrka i gubi se povezanost indeksa niza primljenih podataka s redovima na klijent strani ;-) |
Citat:
konkretno, rowovi opisuju tablicu na nacin: 1. text input -> ime kolone 2. select -> boja slova kolone 3. select -> boja pozadine kolone 4. text input -> duljina kolone jedna tablica, naravno, ima vise kolona -> odatle vise setova input polja. sto se tice indexiranja checkboxova i multiselect lista (pretpostavljam da radi indexiranja govoris da je zamka), s tim nema problema jer ih nece biti. a sto se tice edita, meni i ne treba da mi click na 'remove' odma mice te zapise iz baze jer pri updateu cu napravit: - ucitati postojece iz baze u formu - izmijenit formu kako vec (nebitno) - upisat novo stanje forme ispocetka u definicije odogvarajuce tabele u bazi (sto znaci, cijeli formular ce se pozivat sa odredjenim idformulara=xy), izmijenit ih kako vec i novo stanje iznova upisat (phpom, naravno). [slicno ko otvaranje fajla sa 'w' opcijom -> truncate file to zero :) ] znaci, sve sto mi je crna rupa je podacima iz baze popunit ovako generiranu formu... |
Ako razumem - formular se odnosi na definiciju kolona tabele (žao mi što liči na ponavljanje, ali bitno je da se nešto ne ispusti). Dakle, pored inputa u okviru ovih rowova (hehe, dobro zvuči :-) koji predstavljaju pojedine kolone tabele, postoji i input koji identifikuje samu tabelu (najverovatnije neki hidden). Tada se proces updatea svodi u stvari na brisanje svih postojećih zapisa iz baze koji se odnose na tu tabelu, i tek naknadni upis stanja definisanog na klijentskoj strani.
U tom slučaju ima smisla ostaviti isti obrazac s mogućnošću uklanjanja postojećih zapisa. Što se tiče pripreme inicijalnog stanja formulara, najlakše je generisati postojeće zapise sa serverske strane unutar rowova (prolazak kroz petlju s rezultatima iz baze i dodavanje value atributa na inpute i selected atributa na odabrane opcije). Dakako, moguće je odraditi inicijaciju i s klijentske strane, slično predloženoj modifikaciji funkcije addNewRow i uz pripremu JS strukture koja odgovara podacima iz baze, ali ne vidim potrebu za tim... |
Citat:
Citat:
Kôd:
<input type=text value=$nesto> ili moram punit preko neceg tipa: Citat:
|
Citat:
samo, stavljaj navodnike oko atributa, a nije zgoreg ni xHTML da ispostujes pa da pises: <input type="text" ... value="$nesto" /> |
e sad fino odoh sve to skupa onda sklopit :)
pa javim rezultate... Citat:
tnx! pozdrav |
evo mene s jos jednim pitanjem.
zahvaljujem na dosadasnjim odgovorima, radi sve savrseno. a imam jos jedan zahtjev pa mi pade na pamet da bi se to vjerojatno jako zgodno dalo napravit javascriptom... imam SELECT listu u ovisnosti od koje se javascriptom generira nekoliko text fieldova ispod nje. recimo da postoji pet opcija u listu, to znaci da imam pet setova text fieldova. ono sta mi treba je da kod submita posalje samo one koji su popunjeni. drugim rijecima, postoji li nacin da javascriptom prodjem kroz sve text fieldove na stranici i obrisem neispunjene tako da u $_POST dobijem 'ciste vrijednosti' odnosno samo one unesene? ima zapravo jos jedna bolja opcija, ako je to moguce u javascriptu... setovi text fieldova su mi u divovima koji imaju id="param0", id="param1"...,id="paramn" n je naravno broj opcija u SELECT listi. postoji li opcija da ja ubijem sve divove (ili da im poubijam djecu :) ) osim paramx - gdje je 'x' index trenutno selektirane opcije u listi (u trenutku submita)? mlogo hvala in advance! :) ps. siguran sam da ovo moze, ali ubi me javascript...zderem se s tim vec satima i nikako da mi proradi... |
PS#2.
i molio bih nekoga ako ima neki dobar javascript tutorial gdje se covjek moze pristojno snac i gdje mogu jednom za svagda rijesit ove dileme oko childova, nodova i ostalog. googlam, toga ima na tone, ali nigdje da nadjem nekako sistematicno. sjecam se, pa prije sigurno 2 godine, NoviKorisnik je cini mi se na esu postavio link prema nekom sajtu gdje je fenomenalno bilo prikazano cijelo 'drvo' javascripta, mislim objekti, grananje, methods, properties... al nikako to vise nac...:1050: |
pogledaj http://www.howtocreate.co.uk/tutoria...ript/dombasics
EDIT: uzgred ovo sto ti hoces je potpuno nepotrebna akrobacija, zasto naprosto na server strani ne ignorises prazna polja, ili ih cak obrises ako ti je tako lakse.. EDIT2: pogledaj i ovo http://developer.mozilla.org/en/docs...DOM_Interfaces |
zato sto je moguc slucaj da covjek odabere u select listi jednu opciju, za nju krene popunjavat textfields, a onda se predomisli, kaze da oce drugu opciju, nju popuni i submita. ovakva forma ce onda submitat sve i pomijesat polja pa bi mi bilo korisno da se submitaju samo oni fieldovi koji su odgovarajuci odabranoj opciji...
ali dobro, ovo pitam jer je sve vezano uz forme radjeno javascriptom, pa reko da zaokruzim onda i ovo tako. ako nece ic, slozit cu nesto na server strani, naravno... PS. hvala za link! |
samo jedno konkretno pitanje...
postoji li u javascriptu neka analogija onome sta je u PHPu unset($var)? mislim, da to napravim sa nekim konkretnim objektom (DIVom ili necim)... znaci, da ne radim child/parent nego direktno 'element.remove'? |
Citat:
JavaScript je ok da stvri ulepa, napravi komfornijim ili laksim, ali cvrstoca apliakcije mora da bude u serverskim skriptovima. Ne smes da se oslanjas ni na sta sto je na klijentu (veb citacu) jer postoji milon nacina da klijent ne uradi ono sto si ti planirao ili da ga neknatera da uradi ono sto nisi planirao. |
ma slazem se potpuno, ali je jednostavno tako zadano. ko i ovo na pocetku samog topica, sve se moglo neusporedivo lakse, jednostavnije, sigurnije odradit sa serverske strane, ali covjek simply inzistira da se kompletna forma i sva dogadjanja oko nje odradjuju na client strani a server strana da odradjuje jedino submit. siso sam s pameti vise od toga jer nema nikakvog razumnog razloga za to, objasnio sam mu nekoliko puta pros&contras, ali ako covjek oce, sta da mu ja radim. u krajnjoj liniji, on placa (izem ti argument :1027: )
da sebi radim nesto slicno, ne bi mi palo na pamet ulazit u ovakve akrobacije, but jbg... |
Jesi li mu bar objasnio zasto to ne valja, da ne bude posle kuknjave i da budes ti kriv kada mu uvale neke nezgodne stvari na sajt... :)
Neke se stvari ni za pare ne rade :) |
Koliko sam ja to u stanju objasnit, jesam (stvari tipa sigurnost, cross-browser jednostavnost i slicno)
covjek sasluso, primio na znanje i osto pri svom (iako shvaca o cemu se radi, programer je i on) :) a sto se para tice... toliko sam trenutno ocajan da bi prihvatio i crnog vraga. trenutna maxima je -> sve se moze! (radio bi mu ovo i u flashu da je zapeo) :D PS. dobra stvar je da se radi o jednom specijaliziranom CMS sistemu sa vrlo uskim brojem korisnika, tako da vec time prilican dio problema (sigurnosti i slicno) otpada. |
Citat:
slucaju zaobici rad na securityu. Ne nalaze se sigurnosne rupe samo gledanjem u konkretni kod aplikacije, neke stvari su i 'golim okom' vidljive, pokusaj makar koliko je to moguce da ukombinujes bezbednost u celu pricu. Off Topic: Shvatam da je problem kada nemas neko vreme posla pa kad ti dodje prihvatis sta bilo, ali nije najpametnije resenje ako gledas celu sliku :) Sta mislis, jel ti se isplati 1000e (primer) da dobijes za posao na kojem, ukoliko se otkriju neki ozbiljniji sigurnosni propusti ili mayor greske (ako se koristi na nekim vecim projektima) - jer-je-klijent-nalozio-da-mora-da-ih-bude, rizikujes prljanje imena u web dev 'industriji' i buduce poslove? :1074: |
ok, kad je tako, probaj sledecu ideju: kad korisnik popuni nesto do pola, kako kazes, i onda promeni izbor, ti odradi ciscenje podataka pomocu javascripta...znaci umesto da fizicki brises polja iz DOM stabla, samo prodji kroz sva polja koja su visak i setuj im vrednost na prazan string. Onda mozes na server strani da naprosto zanemaris polja koja te ne zanimaju..
Razlog za izbegavanje removeChild() metode je sto je nju jako tesko naterati da radi u petlji. Nisam nikad uspeo da shvatim tacno zasto, ali meni nije poslo za rukom da je nateram da radi kako treba, osim kad treba izbaciti svu decu nekog elementa. Mogao bi evntualno da probas da disable-ujes textboxove koji ti ne trebaju, ali nisam siguran kako se to ponasa cross-browser, mislim da ce neki browseri ipak poslati ta polja.. |
Citat:
jer, u konkretnom slucaju, opet se svakako ocekuju neke vrste unosa, u skladu s ocekivanim provjeravaju na server strani i onda dalje obradjuju. Citat:
Off Topic: u pravu si potpuno. zato pokusavam smanjit (eventualnu) stetu na minimum. a ako je bude, sta rec -> sam skocio sam se ubio. ko sto rekoh, nisam ovaj tren u poziciji odbijat (ne jer nema nista nego je ima previse [ali troskova :D ] ) tako da, sta mi Bog da. al kolko tolko, da smanjim rizike na minimum. zato i davim toliko s ovim pitanjima. |
Citat:
puno ti hvala! |
Citat:
ako pruza neke usluge sajt na kome se vrti cms mozda csrfem da zloupotrebis poverenje koje sajt pruza korisniku time sto napravis neku kakvu takvu stetu ili da dobijes sopstvenu dobit neke vrste, pa cak i rfi koji pukom srecom uocis slucajno pregledavajuci sta se prosledjuje od vrednosti do servera i 'pokusajem' izvodjenja istog na recimo (heh) strani gde se includuje odredjeni fajl u odnosu na nefiltriranu vrednost iz get metode, sql inj. gde se opet nema nikakve filtracije, slicnih naivnih primera je previse :) Off Topic: Pa ako je tako, racuni se moraju platiti :) ti samo pitaj za konkretan problem na koji naletis ili savet i rado cemo ti odgovoriti ukoliko je u sklopu nasih oblasti :) |
Citat:
samo da ostavim rjesenje...pa ako ce kome kad zatrebat tako neka akrobacija, nek se nadje: Kôd:
function DeleteTooMuch(what) sve unose koji nisu vezani uz tu opciju (a vezani su na nacin imeunosa_brojopcijeulisti) hvala jos jednom! |
Vreme je GMT +2. Trenutno vreme je 05:53. |
Powered by vBulletin® Verzija 3.6.8
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.
Copyright © DevProTalk. All Rights Reserved.