Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Skrypt " Podgląd Newsa."
Forum PHP.pl > Forum > PHP
korey
29.11.2009, 16:12:12
Witam..

Prubuje zrobić skrypt a dokładnie BUTTON który działał by tak ze po kliknięciu na niego wyskakuje mi okienko z Treściami wpisanymi w formularzu. (ma to ziałać jak klasyczny podlą posta na forach)
Kombinowałam na kilka sposobów i miernie mi to wychodziło.

O to Sposoby jakimi próbowałem to zrobić.

Formularz:
Nazwa pliku: add_news_form
[PHP] pobierz, plaintext 
  1. <?php
  2. 	echo 'Dodawanie newsa.<br />';
  3.  
  4. 				if ((isset($log) && isset($pass) && $log != ""  && $pass != ""))
  5. 				{
  6.  
  7. echo 'formulaz dodawania newsa';
  8.  
  9. 	$dzien = date("j:m:Y");
  10. 	$godzina = date("H:i:s");
  11. 	$data = "Dnia $dzien, $godzina";
  12.  
  13.  
  14. echo '<form action="admin.php?administrator=add_news_doit" method="post">';
  15. echo '<table style="margin-left: auto; margin-right: auto;">';
  16. echo '<tr>';
  17. echo '<td>Tytuł:</td><td><input name="tytul" type="text" size="34" value="" /></td>';
  18. echo '</tr>';
  19. echo '<tr>';
  20. echo '<td>Data:</td><td><input name="data" type="text" size="34" value="'.$data.'" /></td>';
  21. echo '</tr>';
  22. echo '<tr>';
  23.  
  24. echo '<td>Autor:</td><td><input name="autor" id="autor" type="text" id="autor"size="34" value="" />';
  25. echo '</td>';
  26. echo '</tr>';
  27. echo '<tr>';
  28. echo '<td>Krótka Tresc:</td><td><textarea name="tresc" id="content" cols="60" rows="7"></textarea></td>';
  29. echo '</tr>';
  30. echo '<tr>';
  31. echo '<td>Pełny Tekst:</td><td><textarea name="full_tresc" cols="60" rows="7"></textarea></td>';
  32. echo '</tr>';
  33.  
  34. echo '</table>';
  35. echo '<center>';
  36. echo '<input type="reset" value="Wyczysc" /> <input type="submit" value="Dodaj newsa" />';
  37. echo ' <INPUT TYPE="BUTTON"  value="Wstecz" onClick="history.back()" />';
  38. echo ' <INPUT TYPE="BUTTON" value="Podglad" onClick="window.open()" />';
  39. echo '</form>';
  40. echo '</center>';			
  41. 				}
  42. 				else {
  43. 				page_error();
  44. 					}
  45.  
  46. ?>
[PHP] pobierz, plaintext



Plik Który ma wyświatlać nawsa w podglądzie:
nazwa: view.php
[PHP] pobierz, plaintext 
  1.       <?php
  2.  
  3.       echo $_GET['content'];
  4.  
  5.       ?>
[PHP] pobierz, plaintext



Za pomocą tego kodu próbowałem to zrobić ale nie wychodziło. sad.gif
[PHP] pobierz, plaintext 
  1. echo '<input type="button" onclick="window.open('preview.html?content='+document.getElementById('content').value,'Podglad','width=400;height=300')" />';
[PHP] pobierz, plaintext

PHP wyświetlało błąd, a gdy pozamieniałe. "" , '' Przycisk nie działał.

zrobiłem też funkcje i wstawiałem ją w input ale nic z tego:

[PHP] pobierz, plaintext 
  1. echo ' <INPUT TYPE="BUTTON" value="Podglad" onClick="view_news()" />';
  2. //albo
  3. echo ' <INPUT TYPE="BUTTON" value="Podglad" onClick="view_news('$tresc, $autor, $data, $tytul, $ful_tresc.')" />';
[PHP] pobierz, plaintext



Wie ktoś jak moge to zrobić..?


darko
29.11.2009, 16:32:08
np.

[PHP] pobierz, plaintext 
  1. echo 'Dodawanie newsa.<br />';
  2.  
  3. echo 'formulaz dodawania newsa';
  4.  
  5. 	$dzien = date("j:m:Y");
  6. 	$godzina = date("H:i:s");
  7. 	$data = "Dnia $dzien, $godzina";
  8.  
  9.  
  10. echo '<form action="admin.php?administrator=add_news_doit" method="post">';
  11. echo '<table style="margin-left: auto; margin-right: auto;">';
  12. echo '<tr>';
  13. echo '<td>Tytuł:</td><td><input id="tytul" name="tytul" type="text" size="34" value="" /></td>';
  14. echo '</tr>';
  15. echo '<tr>';
  16. echo '<td>Data:</td><td><input id="data" name="data" type="text" size="34" value="'.$data.'" /></td>';
  17. echo '</tr>';
  18. echo '<tr>';
  19.  
  20. echo '<td>Autor:</td><td><input id="autor" name="autor" id="autor" type="text" id="autor"size="34" value="" />';
  21. echo '</td>';
  22. echo '</tr>';
  23. echo '<tr>';
  24. echo '<td>Krótka Tresc:</td><td><textarea id="tresc" name="tresc" id="content" cols="60" rows="7"></textarea></td>';
  25. echo '</tr>';
  26. echo '<tr>';
  27. echo '<td>Pełny Tekst:</td><td><textarea id="fulltresc" name="full_tresc" cols="60" rows="7"></textarea></td>';
  28. echo '</tr>';
  29.  
  30. echo '</table>';
  31. echo '<center>';
  32. echo '<input type="reset" value="Wyczysc" /> <input type="submit" value="Dodaj newsa" />';
  33. echo ' <INPUT TYPE="BUTTON"  value="Wstecz" onClick="history.back()" />';
  34. echo ' <INPUT TYPE="BUTTON" value="Podglad" onClick="preview();" />';
  35. echo '</form>';
  36. echo '</center>';
  37. echo '<div id="targetDiv"></div>';
[PHP] pobierz, plaintext


Wyskocz z PHP i na końcu pliku doklej jeszcze to:

[HTML] pobierz, plaintext 
  1. <script>
  2. function preview() {
  3. 	var t = document.getElementById('targetDiv');
  4. 	var targets = new Array('tytul', 'data', 'autor', 'tresc', 'fulltresc');
  5. 	var data = '<b>Podgląd newsa</b>:<br /><br />';
  6.  
  7. 	for(var x in targets) {
  8. 		data += document.getElementById(targets[x]).value;
  9. 		data += '<br />';
  10. 	}
  11. 	t.innerHTML = data;
  12. }
  13. </script>
[HTML] pobierz, plaintext
korey
29.11.2009, 16:35:55
ale ta funkcja musi być w tym samym pliku co formularz?
darko
29.11.2009, 16:40:18
Tak, ale zabezpiecz się przed wstrzyknięciem kodu javascript z pól formularza i eskejpuj sobie pojedyncze cudzysłowy, bo Ci skrypt wywali.
korey
29.11.2009, 16:52:08
Jesteś normalnie wielki..
Powiedz mi a dało by tade wpakowac to wszystko w taka tabele:

[PHP] pobierz, plaintext 
  1.   $tytul = $_GET['tytul'];
  2.   $data = $_GET['data'];
  3.   $autor = $_GET['autor'];
  4.   $tresc = $_GET['tresc'];
  5.   $full_tresc = $_GET['full_tresc'];
  6.  
  7. echo '<link rel="stylesheet" type="text/css" href="functions/newsy.css" media="screen"/>';
  8. echo '<table name="news" class="news" cellpadding="3" cellspacing="0">';
  9. echo '<tbody>';
  10.     echo '<tr align="left">';
  11.      echo '<td colspan="2" rowspan="1" name="news_title" class="news_title">'.ucfirst($tytul).'</td>';
  12.    echo '</tr>';
  13.    echo '<tr  align="justify">';
  14.    echo '<td colspan="2" rowspan="1"><b>'.ucfirst($tresc).'</b>';
  15. echo ucfirst($ful_tresc);
  16.    echo '</td>';
  17.  echo ' </tr>';
  18.    echo '<tr>';
  19.       echo '<td name="news_autor" class="news_autor"><b>Autor: </b>'.ucfirst($autor).'</td>';
  20.      echo '<td name="news_data" class="news_data">'.ucfirst($data).'</td>';
  21.     echo '</tr>';
  22.   echo '</tbody>';
  23. echo '</table>';
  24.  
  25. 		echo '<br />';
[PHP] pobierz, plaintext

tak wygląda w news:
darko
29.11.2009, 16:56:09
Wszystko da radę, walcz dalej sam, ale uważaj na dane pochodzące od użytkownika, nigdy im nie ufaj i używaj htmlentities, htmlspecialchars i strip_tags
korey
29.11.2009, 17:01:52
Kurde było by dobrze ale z js to kompletnie nic nie umiem.. kod jest dobry ale nic z niego nie rozumiem
darko
29.11.2009, 17:13:12 
[HTML] pobierz, plaintext 
  1. <script>
  2. // funkcja podgląd wywoływana po kliknięciu przycisku podgląd z forumlarza
  3. function preview() {
  4.       // do zmiennej t przypisujemy element div o id=targetDiv
  5. 	var t = document.getElementById('targetDiv');
  6. 	// w tablicy targets trzymamy nazwy idków elementów forumlarza, z którego ściągamy dane 
  7. 	var targets = new Array('tytul', 'data', 'autor', 'tresc', 'fulltresc');
  8. 	// w tej zmiennej przechowujemy treść wstrzykiwaną później do naszego diva
  9. 	var data = '<b>Podgląd newsa</b>:<br /><br />';
  10.     // dla każdego x znalezionego w tablicy z nazwami idków
  11. 	for(var x in targets) {
  12. 		// dopisz do wstawianej zawartości wartość elementu formularza o znalezionym id
  13. 		data += document.getElementById(targets[x]).value;
  14. 		// dodaj jeszcze znacznik nowej linii (<br />)
  15. 		data += '<br />';
  16. 	}
  17. 	// wszystkie dane zebrane, wiec wstrzyknij do (ustaw wartość) docelowego diva 
  18. 	t.innerHTML = data;
  19. }
  20. </script>
[HTML] pobierz, plaintext


Jak będziesz wstawiał wartości przysłane z formularza, to w php używaj funkcji htmlentities, htmlspecialchars i strip_tags

Pozdrawiam!
korey
29.11.2009, 17:28:58
a nie dało by rady jakos tak tego rozłożyć..?
Wtedy pomiędzy mógłbym powstawiać znaczniki tabeli i miałbym taki efekt jaki potrzebuje
[PHP] pobierz, plaintext 
  1. 	  data += document.getElementById(targets[tytul]).value;
  2. 	  data += '<br />';
  3. 	  data += document.getElementById(targets[data]).value;
  4.  	  data += '<br />';
  5. 	  data += document.getElementById(targets[autor]).value;
  6. 	  data += '<br />';
  7. 	  data += document.getElementById(targets[tresc]).value;	  
  8. 	  data += '<br />';
  9. 	  data += document.getElementById(targets[fulltresc]).value;	
[PHP] pobierz, plaintext
darko
29.11.2009, 17:30:04
Oczywiście, że można, idziesz dobrym tropem, powodzenia!
[HTML] pobierz, plaintext 
  1. data += '<br /> czy cokolwiek innego';   
  2.          data += document.getElementById('tytul').value;
  3. 	  data += '<br /> czy cokolwiek innego';
  4. 	  data += document.getElementById('data').value;
  5.  	  data += '<br />';
  6. 	  data += document.getElementById('autor').value;
  7. 	  data += '<br />';
  8. 	  data += document.getElementById('tresc').value;	  
  9. 	  data += '<br />';
  10. 	  data += document.getElementById('fulltresc').value;
[HTML] pobierz, plaintext
korey
29.11.2009, 18:22:55
Tak wygląda teraz cała pętla:


[HTML] pobierz, plaintext 
  1.      for(var x in targets) {
  2.  
  3.       // dopisz do wstawianej zawartości wartość elementu formularza o znalezionym id
  4. 	  data += '<link rel="stylesheet" type="text/css" href="functions/newsy.css" media="screen"/>';
  5. data += '<table name="news" class="news" cellpadding="3" cellspacing="0">';
  6.   data += '<tbody>';
  7.     data += '<tr align="left">';
  8. 	  data += '<td colspan="2" rowspan="1" name="news_title" class="news_title">';
  9.       data += document.getElementById('tytul').value;
  10. 	  data += '</td>';
  11.       data += '</tr>';
  12. 	  data += '<tr  align="justify">';
  13.       data += '<td colspan="2" rowspan="1"><b>';
  14.       data += document.getElementById('tresc').value;
  15. 	  data += '</b>';
  16.       data += document.getElementById('fulltresc').value;  
  17. 	  data += '</td>';
  18. 	  data += ' </tr>';
  19. 	  data += '<tr>';
  20.       data += '<td name="news_autor" class="news_autor"><b>Autor: </b>';
  21. 	  data += document.getElementById('autor').value; 
  22. 	  data +='</td>';
  23. 	  data += '<td name="news_data" class="news_data">';
  24. 	  data += document.getElementById('data').value;
  25.  
  26.     data += '</tr>';
  27.   data += '</tbody>';
  28. data += '</table>';
  29. 	       // dodaj jeszcze znacznik nowej linii (<br />)
  30.       }
[HTML] pobierz, plaintext

nie wiem czemu ale gdy naciskam na podgląd wyświetla mi sie kazda z zawartości po 5 razy..
mógłbyś powiedzieć jak zrobić by entery wciskane w <textarea> działały jak <br /> w tym podglądaczu.?
darko
29.11.2009, 18:30:23
Daj to:
[HTML] pobierz, plaintext 
  1. data += '<table name="news" class="news" cellpadding="3" cellspacing="0">';
  2. data += '<tbody>';
  3. data += '<tr align="left">';
  4. data += '<td colspan="2" rowspan="1" name="news_title" class="news_title">';
[HTML] pobierz, plaintext


przed for(var x in targets) {


a to

[HTML] pobierz, plaintext 
  1. data += '</tr>';
  2. data += '</tbody>';
  3. data += '</table>';
[HTML] pobierz, plaintext


już poza pętlą. Co do textarea, to jeśli chcesz dać nową linię, to zamiast '<br />' trzeba dac '\n'
korey
29.11.2009, 19:00:38
Robiłam juz tak na początku i nic..
moze cos zle z tym jest.
[PHP] pobierz, plaintext 
  1.   for(var x in targets) {
  2.  
  3. }
[PHP] pobierz, plaintext
darko
29.11.2009, 20:18:30
Jeśli jesteś w tej pętli

for(var x in targets) {

to każde

data += document.getElementById('tytul').value; // itd.

zamień na

data += document.getElementById(targets[x]).value;

albo nie stosuj tej pętli tylko odwołuj się po nazwach:

data += document.getElementById('tytul').value;
data += '<br /> czy cokolwiek innego';
data += document.getElementById('data').value;
data += '<br /> czy cokolwiek innego';
data += document.getElementById('autor').value;
// I TAK DALEJ
Albo tak, albo tak.
korey
30.11.2009, 09:54:52
Usunąłem całkowicie znaczniki pętli i nie ma żadnego efektu sad.gif
teraz mój kod wygląda tak:

[PHP] pobierz, plaintext 
  1.      <script>
  2.       // funkcja podgląd wywoływana po kliknięciu przycisku podgląd z forumlarza
  3.       function preview() {
  4.  
  5.       // do zmiennej t przypisujemy element div o id=targetDiv
  6.  
  7.       var t = document.getElementById('targetDiv');
  8.  
  9.       // w tablicy targets trzymamy nazwy idków elementów forumlarza, z którego ściągamy dane
  10.  
  11. 	  var targets = new Array('tytul', 'data', 'autor', 'tresc', 'fulltresc');
  12.  
  13.       // w tej zmiennej przechowujemy treść wstrzykiwaną później do naszego diva
  14.  
  15.       var data = '<b>Podgląd newsa</b>:<br /><br />';
  16.  
  17.       // dla każdego x znalezionego w tablicy z nazwami idków
  18.  
  19.   for(var x in targets) {
  20.  
  21.       // dopisz do wstawianej zawartości wartość elementu formularza o znalezionym id
  22. 	  data += '<link rel="stylesheet" type="text/css" href="functions/newsy.css" media="screen"/>';
  23. data += '<table name="news" class="news" cellpadding="3" cellspacing="0">';
  24.   data += '<tbody>';
  25.     data += '<tr align="left">';
  26. 	  data += '<td colspan="2" rowspan="1" name="news_title" class="news_title">';  
  27.       data += document.getElementById('tytul').value;
  28. 	  data += '</td>';
  29.       data += '</tr>';
  30. 	  data += '<tr  align="justify">';
  31.       data += '<td colspan="2" rowspan="1"><b>';
  32.       data += document.getElementById('tresc').value;
  33. 	  data += '</b>';
  34.       data += document.getElementById('fulltresc').value;  
  35. 	  data += '</td>';
  36. 	  data += ' </tr>';
  37. 	  data += '<tr>';
  38.       data += '<td name="news_autor" class="news_autor"><b>Autor: </b>';
  39. 	  data += document.getElementById('autor').value; 
  40. 	  data +='</td>';
  41. 	  data += '<td name="news_data" class="news_data">';
  42. 	  data += document.getElementById('data').value;
  43. 	      data += '</tr>';
  44.   data += '</tbody>';
  45. data += '</table>';
  46.  
  47. data += '<br />';
  48.       }
  49.  
  50.       // wszystkie dane zebrane, wiec wstrzyknij do (ustaw wartość) docelowego diva
  51.  
  52.       t.innerHTML = data;
  53.  
  54.       }
  55.  
  56.       </script>
[PHP] pobierz, plaintext
Podgląd newsa na takim kodzie wygląda poprawnie z taka małą różnicą że gdy naciska się 'podgląd' w div'ie wyskakuje mi 5 takich tabel. każda z nich pokazuje podgląd Newsa
przykładowy SS:
darko
30.11.2009, 10:37:41
Cytat
Usunąłem całkowicie znaczniki pętli


Tak questionmark.gif 

[PHP] pobierz, plaintext 
  1.  for(var x in targets) {
[PHP] pobierz, plaintext
(i klamra zamykająca)

Ciekawe...
korey
30.11.2009, 11:04:34
no jak usunąłem to nic sie nie działo..
więc dodałem je spowrotem i działa, ale tak ze całość wyświetla sie 5 razy
darko
30.11.2009, 11:44:01
Domyślam się, że usunąłeś sam początek pętli czyli for(var x in targets) { ale zapomniałeś o klamrze zamykającej }. Poza tym jeśli już piszesz, że nie działa, to chociaż podaj błąd z konsoli.
korey
30.11.2009, 12:44:13
Nie no usunąłem całe for i klamrę zamykającą też. Klikałem na przycisk i w ogóle nic sie nie działo. żadnego błędu nic
darko
30.11.2009, 13:15:06
Nie wiem, co Ci tu nie działa, zrobiłem tak:

[PHP] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <style>
  6. #news
  7. {
  8. 	font-family: Verdana, Sans-Serif;
  9. 	font-size: 13px;
  10. 	margin: 1px;
  11. 	text-align: left;
  12. 	border-collapse: collapse;
  13. 	color :navy;
  14. }
  15. </style>
  16. </head>
  17. <body>
  18. <?php 
  19. echo 'Dodawanie newsa.<br />';
  20.  
  21. echo 'formulaz dodawania newsa';
  22.  
  23. 	$dzien = date("j:m:Y");
  24. 	$godzina = date("H:i:s");
  25. 	$data = "Dnia $dzien, $godzina";
  26.  
  27.  
  28. echo '<form action="admin.php?administrator=add_news_doit" method="post">';
  29. echo '<table style="margin-left: auto; margin-right: auto;">';
  30. echo '<tr>';
  31. echo '<td>Tytuł:</td><td><input id="tytul" name="tytul" type="text" size="34" value="" /></td>';
  32. echo '</tr>';
  33. echo '<tr>';
  34. echo '<td>Data:</td><td><input id="data" name="data" type="text" size="34" value="'.$data.'" /></td>';
  35. echo '</tr>';
  36. echo '<tr>';
  37.  
  38. echo '<td>Autor:</td><td><input id="autor" name="autor" id="autor" type="text" id="autor"size="34" value="" />';
  39. echo '</td>';
  40. echo '</tr>';
  41. echo '<tr>';
  42. echo '<td>Krótka Tresc:</td><td><textarea id="tresc" name="tresc" id="content" cols="60" rows="7"></textarea></td>';
  43. echo '</tr>';
  44. echo '<tr>';
  45. echo '<td>Pełny Tekst:</td><td><textarea id="fulltresc" name="full_tresc" cols="60" rows="7"></textarea></td>';
  46. echo '</tr>';
  47.  
  48. echo '</table>';
  49. echo '<center>';
  50. echo '<input type="reset" value="Wyczysc" /> <input type="submit" value="Dodaj newsa" />';
  51. echo ' <INPUT TYPE="BUTTON"  value="Wstecz" onClick="history.back()" />';
  52. echo ' <INPUT TYPE="BUTTON" value="Podglad" onClick="preview();" />';
  53. echo '</form>';
  54. echo '</center>';
  55. echo '<div id="targetDiv"></div>';
  56. ?>
  57.  
  58. <script>
  59. function preview() {
  60. 	var t = document.getElementById('targetDiv');
  61. 	var targets = new Array('tytul', 'data', 'autor', 'tresc', 'fulltresc');
  62. 	var descs = new Array('Tytuł:', 'Data:', 'Autor:', 'Krótka treść:', 'Pełny tekst:');
  63. 	var data = '<table id="news" name="news" class="news" cellpadding="3" cellspacing="0"><tr><th>Podgląd newsa</th><th></th></tr>';
  64. 	for(var x in targets) {
  65. 		data +='<tr><td>'+descs[x]+'</td><td>';
  66. 		data += document.getElementById(targets[x]).value;
  67. 		data += '</td></tr>';
  68. 	}
  69. 	data += '</table>';
  70. 	t.innerHTML = data;
  71. }
  72. </script>
  73. </body>
  74. </html>
[PHP] pobierz, plaintext


I wszystko gra, tabelkę dekorujesz sobie stylem w head, walcz już dalej sam.
korey
30.11.2009, 14:15:18
Ej wiesz nie wiem jak to zrobiłem ale pousuwałem trochę z tego poprzedniego kodu i działa idealnie.. biggrin.gif biggrin.gif biggrin.gif
Dzięki za pomoc. smile.gif
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.