Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [Ajax][jQuery]Przesyłanie danych do okna Fancybox
Forum PHP.pl > Forum > XML, AJAX
Stef@n
Witam,
mam pewien problem. Potrzebuje załadować dane z formularza do okienka FancyBox. Oto kod Formularza oraz JS:
  1. <script type="text/javascript" src="js/jquery.js"></script>
  2. <script type="text/javascript" src="js/fancybox_mousewheel.js"></script>
  3. <script type="text/javascript" src="js/fancybox.js"></script>
  4. <link rel="stylesheet" type="text/css" href="css/okienka.css" media="screen" />
  5. <script type="text/javascript">
  6. $(document).ready(
  7. function() {
  8. $(".zaladuj").fancybox({
  9.  
  10. });
  11. }
  12. );
  13. <a href="do_okienka.php" class="zaladuj">załaduj</a><br /><br />
  14.  
  15. <input type="checkbox" name="nazwa[]" value="jakies dane1" /><br />
  16. <input type="checkbox" name="nazwa[]" value="jakies dane2" /><br />
  17. <input type="checkbox" name="nazwa[]" value="jakies dane3" /><br />
  18. <input type="checkbox" name="nazwa[]" value="jakies dane4" /><br />
  19. <input type="checkbox" name="nazwa[]" value="jakies dane5" /><br />
  20. <input type="checkbox" name="nazwa[]" value="jakies dane6" /><br />


kod pliku do_okienka.php
  1. <div style="width:800px; overflow: auto; padding: 6px;">
  2. jakies dane
  3. </div>


Nie mam zielonego pojęcia jak to zrobić. Jedynie co znalazłem to coś takiego
  1. $.ajax({
  2. type : "POST",
  3. cache : false,
  4. url : "do_okienka.php",
  5. data : $(this).serializeArray(),
  6. success: function(data) {
  7. $.fancybox(data);
  8. }
  9. });

Niestety jak do wprowadzę to okienko nie działa. Przyznam się bez bicia, że pierwszy raz próbuje coś zrobić jQuery na funkcjach Ajax do tego dochodzi FancyBox. Szukałem na necie jakiś informacji, ale troszeczkę opornie opisane lub na przykładach mało związanych z powyższym przykładem.

Proszę was bardzo o pomoc.
Kildyt
Nadaj div-omi jakiś identyfikator abyś mógł później w js-ie łatwo edytować.
AJAX-em pobierz żądany plik i wynik zapytania wrzuć do tego div-y. Wszystko znajdziesz w dokumentacji jQuery (ajax i operacje na znacznikach HTML).
Stef@n
Cytat(Kildyt @ 22.01.2011, 12:30:01 ) *
Nadaj div-omi jakiś identyfikator abyś mógł później w js-ie łatwo edytować.
AJAX-em pobierz żądany plik i wynik zapytania wrzuć do tego div-y. Wszystko znajdziesz w dokumentacji jQuery (ajax i operacje na znacznikach HTML).

Wiem jak to ma wyglądać z punktu organizacyjnego, ale nie wiem jak zmontować kod. Przeglądałem dokumentacje i za przeproszeniem dużo nie zdziałałem.
Kildyt
Kod
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(
    $.ajax({
        url: 'ajax/form.php',
        success: function(data) {
            $('#formAjax').html(data);
        }
    });
);
</script>

<div id="formAjax"></div>

Może to Cię jakoś naprowadzi.
Stef@n
Cytat(Kildyt @ 22.01.2011, 13:48:02 ) *
Kod
...

Może to Cię jakoś naprowadzi.

A no naprowadziło smile.gif... Pogrzebałem po Google i po testowałem parę przykładów. Wyszło coś takiego:

  1. <script type="text/javascript">
  2. $(function(){
  3. $(".zaladuj").click(function() {
  4. var test = $("input[name=test]").val();
  5. var cb = $("input[name=cb[]]").val();
  6. data = "test=" + test + "&cb=" + cb;
  7. $.ajax({
  8. type: "POST",
  9. data: data,
  10. url: "do_okienka.php",
  11. success: function(html){
  12. $("#info").html(html);
  13. $.fancybox(html);
  14. }
  15. });
  16. });
  17. });
  18.  
  19. <div style="display: none;">
  20. <div id="info" style="width:400px;height:100px;overflow:auto;">
  21.  
  22. </div>
  23. </div>
  24. <a href="#info" class="zaladuj">załaduj</a><br /><br />
  25.  
  26. <input type="text" name="test" value="" /><br />
  27. <input type="checkbox" name="cb[]" value="jakies dane1" /><br />
  28. <input type="checkbox" name="cb[]" value="jakies dane2" /><br />


Został tylko jeden problem jak wysłać tablice cb[] poprzez ajax do php?
patrix007
Cytat(Stef@n @ 22.01.2011, 15:34:20 ) *
Został tylko jeden problem jak wysłać tablice cb[] poprzez ajax do php?

Normalnie wysyłasz jak każdą zmienną.

Definiując w JS:
  1. var id = new Array(20);

I wysyłając ją jako zmienną przez AJAX:
  1. xmlhttp.send("id=" + id);

Po odebraniu przez PHP:
  1. $id = $_POST['id'];

Masz zmienną w postaci:
  1. $id == ",1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20"


Wystarczy zrobić explode w PHP:
  1. $id = explode(",", $id);

I masz tablicę odebraną - trzeba by jeszcze użyć funkcji empty() aby odfiltrować puste wartości.
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.