Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [JavaScript][CSS] pole input type="file"
mtskilla
post
Post #1





Grupa: Zarejestrowani
Postów: 76
Pomógł: 1
Dołączył: 17.01.2007

Ostrzeżenie: (0%)
-----

Witam

Czy da się jakoś zrobic aby po dodaniu pliku przez pole input type=file w polu formularza widoczna
byla nie cala sciezka dostepu do pliku tylko sama nazwa dodanego pliku??

pozdrawiam
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi (1 - 10)
kapuch
post
Post #2





Grupa: Zarejestrowani
Postów: 389
Pomógł: 69
Dołączył: 26.04.2010
Skąd: Łódź

Ostrzeżenie: (0%)
----- 

[PHP] pobierz, plaintext 
  1. basename();
[PHP] pobierz, plaintext
Go to the top of the page
+Quote Post
mtskilla
post
Post #3





Grupa: Zarejestrowani
Postów: 76
Pomógł: 1
Dołączył: 17.01.2007

Ostrzeżenie: (0%)
-----

dzieki wielkie ale nie mam zielonego pojecia jak tego uzyc skoro po do daniu od pliku przez pole input file nie ma żadnej zmiennej do ktorej moznaby odwolac basename();
nie czaje tego...

moze jeszcze jakies male naprowadzenie...
Go to the top of the page
+Quote Post
kapuch
post
Post #4





Grupa: Zarejestrowani
Postów: 389
Pomógł: 69
Dołączył: 26.04.2010
Skąd: Łódź

Ostrzeżenie: (0%)
----- 

[HTML] pobierz, plaintext 
  1. <form method="post">
  2. <input type="file" name="plik" />
  3. <input type="submit" value="ok" />
  4. </form>
[HTML] pobierz, plaintext 

[PHP] pobierz, plaintext 
  1. echo basename($_POST['plik']);
[PHP] pobierz, plaintext

Go to the top of the page
+Quote Post
mtskilla
post
Post #5





Grupa: Zarejestrowani
Postów: 76
Pomógł: 1
Dołączył: 17.01.2007

Ostrzeżenie: (0%)
-----

no tak ale z tego co widze to Twoja metoda działa dopiero po przesłaniu pliku przez formularz post. a mi chodzi o cos takiego,
ze w momencie klikniecia w przycisk przegladaj i dodania czegos to w polu input type=file pokazuje się sciezka do pliku (przed wyslaniem formularza)
a ja bym chcial zeby pokazalo się tylko nazwa pliku..

mysle, ze js to zalatwi.. ale niestety nie wiem jak..

nie wiem czy odpalales kiedys strone z formularzem w przegladarce google chrom - jest to jedyna przegladarka ktora ma to ustawione domyslnie - pokazuje tylko nazwe zaladowanego pliku..
reszta ff, ie czy opera wszedzie w polu input file pokazuje sciezke dostępu..
Go to the top of the page
+Quote Post
kapuch
post
Post #6





Grupa: Zarejestrowani
Postów: 389
Pomógł: 69
Dołączył: 26.04.2010
Skąd: Łódź

Ostrzeżenie: (0%)
-----

A ja mysle ze tak to sie nie da zrobic, chyba ze przegladarka dopuszcza taka mozliwosc.
Jak zmienisz wartosc (o ile ci sie uda), tego pola to jak pozniej przeslesz plik?
Skad skrypt bedzie znal calkowita sciezke do tego pliku, skoro przekazesz mu tylko nazwe samego pliku?
W google chrome najprawdopodobniej ten input ma wbudowana funkcje, ktora przechowuje nazwe skrocona (do wyswietlania w polu) i nazwe calkowita (dla skryptu), a jesli ff i inne tego nie obsluguja, to jakiekolwiek kombinacje przy value tego pola, skoncza sie bledem skryptu.
To jest moje zdanie.

Jesli dalo by sie jednak to zrobic w js, to jakos tak:
[JAVASCRIPT] pobierz, plaintext 
  1. function basename(path) {
  2.     return path.replace(/\\/g,'/').replace( /.*\//, '' );
  3. } 
[JAVASCRIPT] pobierz, plaintext 

[HTML] pobierz, plaintext 
  1. <input type="file" name="plik" onchange="this.value=basename(this.value);" />
[HTML] pobierz, plaintext

Ale to nie dziala - sprawdzalem, tzn dziala bo jak wstawisz alert w ta funkcje basename to pokazuje okrojona nazwe, ale nie przepisuje jej do pola w input - prawdopodobnie dlatego, ze jest to zablokowane.

PS. Tak samo w Chrome, albo Operze (zapomnialem juz) masz textarea, ktore mozesz sobie recznie powiekszac/zmniejszac, a ff tego nie ma :/

Ten post edytował kapuch 20.07.2010, 16:17:06
Go to the top of the page
+Quote Post
#luq
post
Post #7





Grupa: Zarejestrowani
Postów: 589
Pomógł: 91
Dołączył: 22.05.2008
Skąd: Gliwice

Ostrzeżenie: (0%)
-----

@kapuch ma rację to kwestia implementacji obiektu input[type=file] przeglądarki. Przypisanie takie jest zablokowane z powodu bezpieczeństwa. Wyobraźmy sobie, że jest formularz na stronie i ma ukryte pole [type=file] które jest po załadowaniu skryptowo wypełniane ścieżką np. "C:/Windows/..." po kliknięciu na sumbita ten plik jest przesyłany na serwer, pomijając o tym wiedzę usera.

Możesz przecież nałożyć absolutnie/relatywnie na ten input niewidocznego div`a i po wypełnieniu pola wpisywać w niego basname i ustawiać go jako widoczny (IMG:style_emoticons/default/winksmiley.jpg)
Go to the top of the page
+Quote Post
mtskilla
post
Post #8





Grupa: Zarejestrowani
Postów: 76
Pomógł: 1
Dołączył: 17.01.2007

Ostrzeżenie: (0%)
-----

Cytat(kapuch @ 20.07.2010, 17:09:09 ) *
PS. Tak samo w Chrome, albo Operze (zapomnialem juz) masz textarea, ktore mozesz sobie recznie powiekszac/zmniejszac, a ff tego nie ma :/


w chromie mozna zmieniac textarea..



#luq a czy jest możliwe sprawdzenie czy pole input jest wypelnione? (czy zostal wybrany obrazek) bez odswiezania calego formularza? bo chociaz to nie problem
to wolalbym az tak nie kombinowac.
zrobilbym to na zasadzie onchange="document.form.submit()">
da sie jakos inaczej? bez odswiezania?


wielkie dzieki za pomoc chlopaki (IMG:style_emoticons/default/smile.gif)


Go to the top of the page
+Quote Post
#luq
post
Post #9





Grupa: Zarejestrowani
Postów: 589
Pomógł: 91
Dołączył: 22.05.2008
Skąd: Gliwice

Ostrzeżenie: (0%)
-----

To co chcesz zrobić da się zrobić w taki sposób:

[HTML] pobierz, plaintext 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  2. <html>
  3.   <head>
  4.     <title>Disable</title>
  5.     <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
  6. 	<script type="text/javascript" src="./js/jquery.js"></script>
  7.  
  8. 	<script type="text/javascript">
  9. 		function basename(path) {
  10. 			return path.replace(/\\/g,'/').replace( /.*\//, '' );
  11. 		} 
  12.  
  13. 		$(document).ready(function(){
  14. 			$('#foo').change(function(){
  15. 				var v = $(this).val();
  16.  
  17. 				$('#foo_basname').text( basename( v ) );
  18. 				$('#foo_basname').show();
  19. 			});
  20. 		});
  21. 	</script>
  22.  
  23.   </head>
  24. <body>
  25.  
  26. 	<form action="" method="post">
  27. 		<input style="width: 200px; height: 20px; border: 1px solid #000;" type="file" id="foo" name="foo" />
  28. 		<div id="foo_basname" style="background: #fff; width: 145px; height: 20px; position: relative; top: -20px; display: none;"></div>
  29. 	</form>
  30.  
  31. </body>
  32. </html>
[HTML] pobierz, plaintext


Tylko ładnie ostylować inputa i tego div`a żeby wyglądało tak samo i nikt tego nie zauważy.
Go to the top of the page
+Quote Post
mtskilla
post
Post #10





Grupa: Zarejestrowani
Postów: 76
Pomógł: 1
Dołączył: 17.01.2007

Ostrzeżenie: (0%)
-----

Wszystko ok takie rozwiązanie ma dwa minusy:

pierwszy- w kazdej przegladarce pole input file wyglada inaczej.. rozni sie szerokoscią i poprostu jest to nie do ogarniecia. trzebaby zastosowac styl css na if dla kazdej przegladarki zeby ladnie przykryc
pole input tym drugim divem - tak zeby byl widoczny przycisk (przegladaj / wybierz etc - rowniez zalezne od przegladarki..) nie wspomne o chromie w ktorym przycisk przedladania przeskakuje na lewą strone...

tak czy siak wybrnąłem z tego problemu i postanowiłem zrobic diva który bedzie przykrywał całe to pole - łącznie z przyciskiem do przeglądania..

ale tutaj pojawia się drugi problem jaki napotkałem.. mianowicie przy wiekszej ilosci pol input file div przykrywajacy pojawia sie tak czy siak tylko raz...

chyba przeprosze w koncu multiple-file-upload z jquery...
nie chcialem w to wchodzic bo nie bardzo rozumiem zasade jak te pliki dodane
tym sposbem są nazywane - zeby potem zrobic z nich miniaturki i zapisac gdzies tam na serwerze
http://www.fyneworks.com/jquery/multiple-file-upload/
mieliscie moze z tym doczynienia?
Go to the top of the page
+Quote Post
#luq
post
Post #11





Grupa: Zarejestrowani
Postów: 589
Pomógł: 91
Dołączył: 22.05.2008
Skąd: Gliwice

Ostrzeżenie: (0%)
-----

1. Tak jak powiedziałem, trzeba to ostylować. Chyba input[type=file] jest oporny na style ale pewno się da jakoś JavaScriptem to załatwić.
2. No bo musisz zrobić dla każdego inputa inny div. No to jest chyba logiczne.
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · Następny nowszy »
 

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Przełącz na: Standardowy · Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 23.08.2025 - 11:02
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn