User.tpl $('#orderform')[0].submit(); funktioniert nicht

Deutsches Forum
1

Hallo Leute,

kann mir jemand evtl. sagen wieso ich mit $('#orderform')[0].submit(); das “hauptformular” in der user.tpl (z.b wenn ich als gast bestelle) nicht auslösen kann? In der neuen oxid v6 funktioniert es und in der alten version 4.6.1 (basic theme) tut sich nix bzw. die user.tpl wird “neugeladen” aber das formular wird nicht submitted (könnt ihr gerne testen).

http://oxid-tpl-debug.stahlwarenhaus-hebsacker.de/basic/

Der hintergrund ist das ich ein kleines jquery script gebaut habe, welches ein kleine ajax abfrage ausführt sobald ich auf den “weiter” button klicke und sobald ich die daten habe soll eben die form mit $('#orderform')[0].submit(); submitted werden.

Hat hier jemand eine idee wo ich evtl. ansetzen muss? Und bitte keine diskussionen bzgl. der alten oxid version, die v6 ist bei uns gerade in der mache :wink:

Besten dank im voraus.

2

Javascript ist auf den HTML Code abgestimmt. Am wahrscheinlichsten ist: Anderes Template = anderer Code = js kaputt.

3

.submit() ist ein jquery grundbefehl und “völlig” unabhängig von html. Lediglich der selektor wird entsprechend angepasst. Das gilt auch für die meisten jquery-codes, deswegen verstehe ich deine aussage nicht. Hier geht es um ein simplen jquery trigger, der auf jeder html seite funktioniert die eine form hat …

4

Klingt danach, als ob Du was leeres sendest. Schau mal, welche jQuery-Version in 4.6.x arbeitet und lass Dir die Daten in der console ausgeben.

5

Ich nutze beim oxid 4.6.1 die jquery version 1.9.1 eingebunden per google-api. Die console gibt keine fehler aus. Es wird lediglich die user.tpl “reloaded” … komme da gerade nicht wirklich weiter.

6

Und was ist nun dein Selektor?

7

Steht doch im ersten post was mein selektor ist. Die ID der form (#orderform), daher auch $('#orderform')[0].submit();. Logisch oder? :wink:

Ich vermute hier ein problem beim “alten” oxid, denn bei v6 geht es und ich war eben mal auf 5 völlig fremden zufälligen seiten mit kontaktformular und dort geht es auch.

8

Nein, die ID darf nur einmal vorkommen, weshalb es wohl $(‘#orderform’).submit(); heißen sollte. Aus 2 Formen kannst mit $('.orderform')[0].submit(); das erste DOM-Element einer Klasse (!!) oder direkt $('form')[0].submit(); auswählen.

9

Ok aber das ändert leider nix an der tatsache. Ob $(’#orderform’).submit(); oder $('#orderform')[0].submit(); oder auch $(’.orderform’).submit(); es funktioniert nicht, immer das gleiche ergebnis. Auf den 5 wahllosen testseiten haben beide methoden reibungslos funktioniert.

Verstehe nicht wieso der “simple” trigger nicht funktioniert …

10

$(’#orderform’) -> jquery object
$(’#orderform’)[0] -> dom element
geht beides. Und normal geht das auch im “alten” Oxid. Wenn die Seite neu geladen wird, schlägt wahrscheinlich ein Check fehl (“füllen Sie alle Felder aus”). Du musst dir also anschauen was abgesendet wird und warum das bei dir nicht geht, hat aber nichts mit Oxid zu tun. Kannst du alles in der Konsole sehen.

11

Bei einer frisch installierten oxid shop installtion (4.6.1) wird beim genannten befehl einfach die seite neugeladen, egal ob kein feld ausgefüllt ist oder alle felder ausgefüllt sind. Daher ist es nicht unwahrscheinlich as irgendwas mit dem check der felder nicht stimmt. Klicke ich allerdings den weiter-button ganz normal mit der maus, funktioniert es einwandfrei. Ebenfalls sehe ich bei beiden varianten keiner unterschiede in der console, alle parameter scheinen gleich zu sein die gesendet werden …

Edit: Sehe gerade das ein parameter fehlt der übergeben wird. userform: Weiter+zum+n%E4chsten+Schritt Das könnte das problem sein …

Hat hier jemand ein anstupser für mich?

12

Code zeigen :wink:

13

Bei einer frisch installierten 4.6.1 gibt es im basic-Theme weder eine ID orderform noch jquery.

14

Natürlich hab ich dem frisch installierten shop jquery verpasst und der form eine ID gegeben :wink:

15 
$(document).ready(function(){
$('#FormButton').click(function (event) {
    var form = this;
    event.preventDefault();
    setTimeout(function () {
        form.submit();
    }, 2000); // in milliseconds

     var address = $('#ustreet').val() + " " + $('#ustreetnr').val() + ", " + $('#uplz').val();

     $.ajax({
            url: 'https://maps.googleapis.com/maps/api/geocode/json?address=' + address + '&key=123456',

            dataType: 'json',
            success: function(json) {
            geo = json.results[0].geometry.location.lat + ", " + json.results[0].geometry.location.lng;

            $('#oxmailcheck').val(geo);
            $('#orderform')[0].submit();
            }

    });

}); 
});
16

Lass Dir mal form ausgeben: console.log(form);
Wenn da was fehlt, würde ich es so versuchen:
var form = $(this).closest('form');
var form = $(this).closest('form')[0]; DOM

17

Ok. Schaue ich mir nach’m Mittag an. :slight_smile:

18

Ist der Button userform, da gibt’s einen check:

protected function _setupDelAddress()
{
    return (oxConfig::getParameter( 'blshowshipaddress' ) !== null || oxConfig::getParameter( 'blhideshipaddress' ) !== null) && oxConfig::getParameter( 'userform' ) === null;
}

oxcmpuser, wenn das true ist geht’s nicht weiter.

19

<input id="FormButton" class="button medium" name="userform" value="Weiter zum nächsten Schritt" type="button">

Hm irgend wie hänge ich gerade fest …

20

input ist schon mal kein form, und jquery submit() geht nur auf Elemente