Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript][PHP] Wysyłanie danych formularza bez odświeżania strony
Forum PHP.pl > Forum > Przedszkole
kamilosxd678
9.09.2012, 14:46:05
Witam! Konstruuje sobie panel administratorski. Stworzyłem go na zasadzie diva z menu i diva z treścią do którego przez jQuery ładowane są kolejne podstrony. Te rozwiązanie okazało się jednak dużym problemem, ponieważ formularze zawarte w podstronach odświeżają całą treść niszcząc to co chciałem uzyskać. Stąd rodzi się moje pytanie, czy jest możliwość pozbycia się tego problemu tak, aby odświeżany był tylko div lub by to w ogóle nie następowało?

Kody:
Strona główna
[PHP] pobierz, plaintext 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3. <head>
  4.     <meta http-equiv="content-type" content="text/html;charset=utf-8" />
  5.     <title>Main Panel</title>
  6. 	<link type="text/css" href="css/admin.css" rel="stylesheet" />
  7.     <link type="text/css" href="css/menu.css" rel="stylesheet" />
  8.     <script type="text/javascript" src="js/jquery.js"></script>
  9.     <script type="text/javascript" src="js/menu.js"></script>
  10. 	<script type="text/javascript">
  11. 		$(function(){
  12. 			$('ul.menu li a').click(function(){
  13. 				$('li.current').removeClass();
  14. 				$(this).parent().addClass('current');
  15. 				$('#Content').load($(this).attr('hreflang'));
  16. 			});
  17. 			$('ul.menu li div ul li a').click(function(){
  18. 				$('li.current').removeClass();
  19. 				$(this).parent().parent().parent().parent().addClass('current');
  20. 				$('#Content').load($(this).attr('hreflang'));
  21. 			});
  22. 		});
  23. 	</script>
  24. </head>
  25. <body>
  26. <div id="menu">
  27. <?
  28. 	echo '<ul class="menu">';
  29.         if($_SESSION['priv'][0] == true){
  30. 		echo'
  31. 		<li><a href="java script:;" hreflang="news.php?view=view" class="parent"><span>News</span></a>
  32.             <div><ul>
  33.                 <li><a href="java script:;" hreflang="news.php?view=view"><span>Przeglądaj newsy</span></a></li>
  34.                 <li><a href="java script:;" hreflang="news.php?view=add"><span>Dodaj news</span></a></li>
  35.             </ul></div>
  36.         </li>
  37. 		';
  38. 	}
  39.         if($_SESSION['priv'][1] == true){
  40.              echo '<li><a href="java script:;" hreflang="count_privs.php"><span>Oblicz kod uprawnień</span></a></li>';
  41.         }
  42. 	echo '<li class="last"><a href="logout.php"><span><strong style="color: #FF0000">Wyloguj</strong></span></a></li>';
  43.     echo '</ul>';
  44. ?>
  45. </div>
  46. <div id="Content">
  47. <span style="font-size: 50px">Content</span>
  48. </div>
  49. </body>
  50. </html>
[PHP] pobierz, plaintext

Podstrona formularza
[PHP] pobierz, plaintext 
  1. <html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  2. <title>Encrypter</title>
  3. </head>
  4. <body>
  5. <form name="encrypt" method="post" action="count_privs" enctype="multipart/form-data">
  6. 	<fieldset>
  7.        	<p><label>To encrypt:</label><input type="text" class="text-long" name="txt"></p>
  8. 	   	<p><label>To decode:</label><input type="text" class="text-long" name="priv"></p>
  9. 		<p><label>Permissions:</label><br/>
  10. 		<input type="checkbox" name="w_sumie_nie_wiem_po_co_to" value="wartość" checked="checked" />Zaznacz<br/>
  11. 		<input type="checkbox" name="chkbx1" value="wartość" checked="checked" />Pierwszy<br/>
  12. 		<input type="checkbox" name="chkbx2" value="wartość" checked="checked" />Drugi<br/>
  13. 		<input type="checkbox" name="chkbx3" value="wartość" checked="checked" />Trzeci<br/>
  14. 		<input type="checkbox" name="chkbx4" value="wartość" checked="checked" />Czwarty<br/>
  15. 		<input type="checkbox" name="chkbx5" value="wartość" checked="checked" />Piąty<br/>
  16. 		<input type="checkbox" name="chkbx6" value="wartość" checked="checked" />Szósty<br/>
  17. 		<input type="checkbox" name="chkbx7" value="wartość" checked="checked" />Siódmy<br/>
  18. 		<input type="checkbox" name="chkbx8" value="wartość" checked="checked" />Ósmy<br/>
  19. 		<input type="checkbox" name="chkbx9" value="wartość" checked="checked" />Dziewiąty<br/>
  20. 		<input type="checkbox" name="chkbx10" value="wartość" checked="checked" />Dziesiąty<br/>
  21. 		<input type="checkbox" name="chkbx11" value="wartość" checked="checked" />Jedenasty<br/>
  22. 		<input type="checkbox" name="chkbx12" value="wartość" checked="checked" />Dwunasty<br/>
  23. 		<input type="checkbox" name="chkbx13" value="wartość" checked="checked" />Trzynasty<br/>
  24. 		<input type="checkbox" name="chkbx14" value="wartość" checked="checked" />Czternasty<br/>
  25. 		<input type="checkbox" name="chkbx15" value="wartość" checked="checked" />Piętnasty<br/>
  26. 		</p>
  27.    		<input type="submit" style="background:#b9bcbe;padding:2px 4px;color:#000;border:none" value="Encrypt">
  28. 	 </fieldset>
  29. </form>
  30. <?
  31. if(isset($_POST['txt'])){
  32. 	$sha = sha1($_POST['txt']);
  33. 	$md = md5($_POST['txt']);
  34. 	echo $_POST['txt'].' w SHA1 = '.$sha.' , a w MD5 = '.$md;
  35. 	echo '<br />';
  36. }
  37. if(isset($_POST['w_sumie_nie_wiem_po_co_to'])){
  38. 	$privs = 0;
  39. 	$i = 0;
  40. 	if($_POST['chkbx1'] == true) $privs += pow(2,$i); $i++; 
  41. 	if($_POST['chkbx2'] == true) $privs += pow(2,$i); $i++; 
  42. 	if($_POST['chkbx3'] == true) $privs += pow(2,$i); $i++; 
  43. 	if($_POST['chkbx4'] == true) $privs += pow(2,$i); $i++; 
  44. 	if($_POST['chkbx5'] == true) $privs += pow(2,$i); $i++; 
  45. 	if($_POST['chkbx6'] == true) $privs += pow(2,$i); $i++; 
  46. 	if($_POST['chkbx7'] == true) $privs += pow(2,$i); $i++; 
  47. 	if($_POST['chkbx8'] == true) $privs += pow(2,$i); $i++; 
  48. 	if($_POST['chkbx9'] == true) $privs += pow(2,$i); $i++; 
  49. 	if($_POST['chkbx10'] == true) $privs += pow(2,$i); $i++;
  50. 	if($_POST['chkbx11'] == true) $privs += pow(2,$i); $i++; 
  51. 	if($_POST['chkbx12'] == true) $privs += pow(2,$i); $i++; 
  52. 	if($_POST['chkbx13'] == true) $privs += pow(2,$i); $i++; 
  53. 	if($_POST['chkbx14'] == true) $privs += pow(2,$i); $i++; 
  54. 	if($_POST['chkbx15'] == true) $privs += pow(2,$i);
  55. 	echo $privs;
  56. }
  57. ?>
  58. </body></html>
[PHP] pobierz, plaintext
b4rt3kk
9.09.2012, 15:36:28
Jeśli chcesz wysyłać formularz bez odświeżania strony to musisz użyć Ajaxa, a do jego walidacji posłużyć się JS (względnie jQuery) i ew. Ajaxem. Inaczej mówiąc wyrzuć domyślną akcję inputa submit i zastąp ją przesłaniem danych z formularza do skryptu PHP zapisującego wyniki w bazie, czy co tam chcesz z nimi zrobić, poprzez Ajax.

[HTML] pobierz, plaintext 
  1. $('input[type=submit]').click(function() {
  2.   // pobierasz dane z inputów
  3.   // następnie przesyłasz do skryptu php za pomocą Ajax'a
  4. });
[HTML] pobierz, plaintext
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.