ugrás a tartalomhoz

Ajax form submit

Theo76 · 2019. Szep. 13. (P), 13.33
Sziasztok!


Egy olyan gondom van, hogy jQueryvel hívok meg egy formot tartalmazó "ablakot" az oldal betöltése után, amit ajax kezelne. Viszont valamiért nem adja át a scriptnek a vezérlést...

Így néz ki a form meghívása:
  1. $.popUp = function( options ){  
  2. ...  
  3.     showPopUp();  
  4.   
  5.     function showPopUp() {  
  6.         var popUpWindow =   "<div class='popUpBackground'></div>" +  
  7.                             "<div class='popUpBoxContainer'>" +  
  8.                             "<div class='popUpBoxTable'>" +  
  9.                             "<div class='popUpBoxRow'>" +  
  10.                             "<div class='popUpBoxCell'></div>" +  
  11.                             "<div class='popUpBoxCell popUpWindow'>" +  
  12.                             "<div class='popUpBoxContent'>" +  
  13.                             "<div class='popUp-box popUpBorder-Black popUpBox-Shadow-normal popUp-box-radius'>" +  
  14.                             "<div class='popUp-box-title normal'>" + options['title']['text'] + "</div>" +  
  15.                             $formStart +  
  16.                             "<div class='popUp-box-content'>" + options['content'] + "<div class='popUp-box-buttons'>" + button + "</div>" + "</div>" +  
  17.                             ( ( $formStart == "" ) ? "" : "</form>" ) +  
  18.                             "</div>" +  
  19.                             "</div>" +  
  20.                             "</div>" +  
  21.                             "<div class='popUpBoxCell'></div>" +  
  22.                             "</div>" +  
  23.                             "</div>" +  
  24.                             "</div>";  
  25.   
  26.         $( '#working' ).append( popUpWindow );  
  27.         $( '#working' ).css({  
  28.             opacity: 0,  
  29.             display: 'block'  
  30.         }).animate({opacity:1},100);  
  31.     }  
  32.   
  33. };  
A másik script tartalma:
  1. $( document ).ready( function(){  
  2. ...  
  3.     $( '#ajaxSubmit' ).submit( function() {  
  4.         var $dest = ( typeof $( this ).attr( 'data-dest' ) === 'undefined' ) ? 'working' : $( this ).attr( 'data-dest' );  
  5.   
  6.         $.ajax({  
  7.             url:    $( this ).attr( 'action' ),  
  8.             type:   $( this ).attr( 'method' ),  
  9.             data:   $( this ).serialize(),  
  10.             mimeType:"multipart/form-data",   
  11.   
  12.             success: function( response ) {  
  13.                 $( '#' + $dest ).html( response );  
  14.             },  
  15.   
  16.             error: function( response ) {  
  17.                 $( '#errorMsg' ).html( response );  
  18.             }  
  19.         });  
  20.   
  21.         return false;  
  22.     });  
  23. ...  
A segítséget előre is köszönöm!
 
1

Nem értem

Pepita · 2019. Szep. 17. (K), 19.57
Mi az a $.popUp?
Mitől fog lefutni ez a függvény?
Mit jelent az, hogy:
jQueryvel hívok meg egy formot tartalmazó "ablakot"


Abból kiindulva, hogy magát a kérdést sem értem, arra következtetek, hogy a feladatot sem definiáltad megfelelően, ezért lett egy nagy katyvasz belőle, amit eddig nem tudott senki kihámozni.
Csak mellékesen jegyzem meg, hogy javascript-be nemigazán szoktunk így és ennyi sok html-t beégetni, valamint a "$( '#errorMsg' ).html( response );" is furcsa, kb bármilyen html kód (esetleg további javascript) jön a válaszban, gondolkodás nélkül megy a frontendre...
(Ha már jQuery, be lehet tenni a modal-t az eredeti html-be, csak display: none; és amikor szükség van rá, akkor $('#modal_ablak_id').show().)

Szerintem először azt írd le sorban, hogy mi a feladat. Pl.:

- Adott ez a felület (html kódrészlet)
- Júzer kattint az #én_gombom_id gombra, akkor
- szeretnék megjeleníteni egy (modal) ablakot,
- aminek a tertalma: (html kódrészlet)
- amikor megjelenik (vagy közvetlenül előtte) a modal, szeretnék egy ajax adatlekérést a http://akármi.com/ajax-kérés URL címről, majd
- a válasz függvényében megjeleníteni adatokat:
- Ha sikeres az ajax-kérés, akkor így és így,
- Ha hiba történt, akkor meg amúgy
- Végül a modal ablakon az #xyz gombra kattintva írjuk ki, hogy "Sikerült!" és zárjuk be az ablakot.

Ha kellően kis lépésekre és ügyesen fel tudod bontani, sokkal könnyebb lesz megfelelő megoldást találni.