lina-: wie onsubmit "aufhalten"?

moin :)

Ich möchte gern ein submit kurzzeitig aufhalten und eine Funktion dazwischen ausführen zu lassen.
Hier mal ein bissl Codeschnipsel:

  • Die Form die submitted wird:
    <html:form target="tabContent"  onsubmit="checkTextField()" action="/OrderQueryAction" >

  • ein Textfeld in der Form das bei submit zunächst geprüft werden soll.
    <html:text name="orderQueryForm" property="pubdate" styleId="calText"  onblur="updateTextField('calText')"/>
    (styleId ist das Struts-äquivalent zu id)

  • die Funktion die einfach nur veranlasst, dass das Textfeld verlassen wird (und somit die update-funktion aufgerufen wird --> siehe Textfeld onblur)
    function checkTextField(){
      document.getElementById('calText').blur();
    }

In Firefox geht diese Strategie wunderbar auf. Nur der IE macht mir mal wieder Sorge...
Der verarbeitet das ganze scheinbar in zwei Threads - so dass das submit schon durch ist während update noch nicht fertig ist.
Das Ergebnis ist ein kurzes Aufflackern des richtigen values im Textefeld - und anschliessend wird doch wieder das alte dargestellt.

Nun habe ich ja überlegt, dass setTimeout mir helfen könnte - aber damit kann ich ja maximal die update-methode noch weiter hinauszögern.

Hat jemand ne tolle Idee zu diesem Problem?

liebe Grüße aus Berlin
lina-

--
Self-Code: ie:% fl:( br:^ va:) ls:/ fo:| rl:( ss:) de:] js:| mo:)
  1. hi,

    (styleId ist das Struts-äquivalent zu id)

    könntest du vielleicht mal richtiges HTML posten, anstatt immer wieder diesen komischen "Struts"-kram?

    Hat jemand ne tolle Idee zu diesem Problem?

    ich habe bisher nicht mal verstanden, woeigentlich dein problem liegt.

    und obskure funktionen mit namen wie checkTextField(), deren "check" dann doch nur aus einem einfachen blur()-aufruf besteht, machen die sache auch nicht gerade durchsichtiger.

    gruß,
    wahsaga

    --
    /voodoo.css:
    #GeorgeWBush { position:absolute; bottom:-6ft; }
    1. moin :)

      könntest du vielleicht mal richtiges HTML posten, anstatt immer wieder diesen komischen "Struts"-kram?

      Struts-tags sind auch nur HTML... aber für dich noch mal im Klartext:

      • Die Form:
        <form target="irgendeineSeite.html"  onSubmit="blurTextField()" action="/OrderQueryAction">
        (wie ich action-mapping in HTML "übersetzten" soll weiss ich leider nicht)

      • Das Textfeld
        <input name="orderQueryForm" type="text" id="calText" onBlur="updateTextField('calText')">

      • die (umbenannte) Funktion zum verlassen des Textfeldes
        function blurTextField(){
          document.getElementById('calText').blur();
        }

      Der theoretische Ablauf:

      • Der User gibt in das Textfeld etwas ein.
      • verlässt er das Textfeld in dem er irgendwo anders hin klickt, wird die Funktion "update(id)" aufgerufen und das Textfeld wird überprüft und aktualisiert (_das_ funktioniert prima)
      • verlässt der User das Textfeld jedoch nicht, sondern führt ein submit mit "Enter" aus, soll das Textfeld ebenso aktualisiert werden.
      • Dazu muss das Feld erstmal verlassen werden - also gebe ich bei onSubmit an, dass das Feld verlassen wird (mit blur()).
      • Irgendwie werden jedoch zwei verschiedene Threads ausgelöst - und genau hier liegt mein Problem. Da ich nicht weiss, wie der IE das intern handhabt, kann ich nichts dagegen tun, dass das aktualisieren nur von kurzer Dauer ist.

      Ist das ganze jetzt durchsichtiger?

      liebe Grüße aus Berlin
      lina-

      --
      Self-Code: ie:% fl:( br:^ va:) ls:/ fo:| rl:( ss:) de:] js:| mo:)
      1. hi,

        Struts-tags sind auch nur HTML...

        nein.

        • verlässt er das Textfeld in dem er irgendwo anders hin klickt, wird die Funktion "update(id)" aufgerufen und das Textfeld wird überprüft und aktualisiert (_das_ funktioniert prima)

        updateTextField() heißt die funktion in deinem code.

        • verlässt der User das Textfeld jedoch nicht, sondern führt ein submit mit "Enter" aus, soll das Textfeld ebenso aktualisiert werden.
        • Dazu muss das Feld erstmal verlassen werden

        nein, dazu muss die funktion updateTextField() aufgerufen werden, das sagtest du doch gerade selber - also warum machst du das bei onSubmit nicht einfach?

        gruß,
        wahsaga

        --
        /voodoo.css:
        #GeorgeWBush { position:absolute; bottom:-6ft; }
        1. moin :)

          updateTextField() heißt die funktion in deinem code.

          *g* zu viel umbenennen ;)

          • verlässt der User das Textfeld jedoch nicht, sondern führt ein submit mit "Enter" aus, soll das Textfeld ebenso aktualisiert werden.
          • Dazu muss das Feld erstmal verlassen werden
            nein, dazu muss die funktion updateTextField() aufgerufen werden, das sagtest du doch gerade selber - also warum machst du das bei onSubmit nicht einfach?

          Weil es intern (beim IE) leider so ist, dass bei einem expliziten aufruf von onSubmit auch ein onBlur() auf alle Elemente der Form aufgerufen wird - was den Effekt hat, dass die Funktion zum updaten zweimal ausgeführt wird (was nicht Sinn der Sache ist).

          Komischerweise tritt dieser Effekt nicht auf, wenn man onSubmit in der Form einfach wegläßt (sich also darauf verläßt dass ein submit auch alle Elemente "blured").

          Hab ich alles schon probiert :(

          liebe Grüße aus Berlin
          lina-

          --
          Self-Code: ie:% fl:( br:^ va:) ls:/ fo:| rl:( ss:) de:] js:| mo:)
      2. Hallo,

        • Dazu muss das Feld erstmal verlassen werden - also gebe ich bei onSubmit an, dass das Feld verlassen wird (mit blur()).

        Warum nicht <form <!--weitere Anweisungen //--> onsubmit="return deineFunktion(<Parameter>);">

        Nun musst Du nur wie bereits geschilder in Deiner Funktion ein return true bzw false korrekt verbauen.

        Mit freundlichem Gruß
        Micha

  2. Hallo,

    Da aus Deinem Auszug nichts zur Funktion ansich hervorging, vermute ich mal das Du kein oder ein falsches retun gesetzt hast!

    return false; // lässt das Forum nicht absenden

    return true; // Formular wird gesendet

    Mit freundlichem Gruß
    Micha

    1. moin :)

      Da aus Deinem Auszug nichts zur Funktion ansich hervorging, vermute ich mal das Du kein oder ein falsches retun gesetzt hast!

      Die update-Funktion an sich funktioniert ja auch bestens - die hat mit dem Problem nichts zu tun (soweit konnte ich das schon eingrenzen)

      return false; // lässt das Forum nicht absenden

      return true; // Formular wird gesendet

      Das Formular soll aber in jedem Fall abgesendet werden.
      Zumal das return in der Check-Methode auch nicht viel hilft :]

      Ich habe ja fast die Vermutung, dass das intern so abläuft:

      • submit speichert die Werte des Formulars
      • onsubmit führt seine Funktion aus
      • submit reloaded das Fenster (klar - mit den alten Werten die es vorher gespeichert hatte)

      Also - was ich umständlich zu sagen versuche ist: könnte es sein, das s der Eventhandler erst _nach_ dem eigentlichen Event zuschlägt?

      liebe Grüße aus Berlin
      lina-

      --
      Self-Code: ie:% fl:( br:^ va:) ls:/ fo:| rl:( ss:) de:] js:| mo:)
      1. hi,

        Ich habe ja fast die Vermutung, dass das intern so abläuft:

        • submit speichert die Werte des Formulars
        • onsubmit führt seine Funktion aus
        • submit reloaded das Fenster (klar - mit den alten Werten die es vorher gespeichert hatte)

        nein, das ist falsch.
        erst mal wird die onSubmit-aktion ausgeführt, und anschließend das formular abgeschickt.

        Also - was ich umständlich zu sagen versuche ist: könnte es sein, das s der Eventhandler erst _nach_ dem eigentlichen Event zuschlägt?

        natürlich, erst mal muss der event ausgelöst werden.
        dann wird das im zutreffenden eventhandler stehende ausgeführt, und anschließend die "normale HTML-aktion" (hier: versenden der formulardaten ans script).

        gruß,
        wahsaga

        --
        /voodoo.css:
        #GeorgeWBush { position:absolute; bottom:-6ft; }
        1. moin :)

          nein, das ist falsch.

          hmm schade - wäre ne erklärung gewesen...

          erst mal wird die onSubmit-aktion ausgeführt, und anschließend das formular abgeschickt.

          dann verstehe ich erst recht nicht warum die aktuellen Daten nicht verschickt werden, sondern die alten.

          liebe Grüße aus Berlin
          lina-

          --
          Self-Code: ie:% fl:( br:^ va:) ls:/ fo:| rl:( ss:) de:] js:| mo:)
          1. hi,

            dann verstehe ich erst recht nicht warum die aktuellen Daten nicht verschickt werden, sondern die alten.

            ein online-beispiel könnte vllt. hilfreich sein, um den sachverhalt nachvollziehen zu können.

            gruß,
            wahsaga

            --
            /voodoo.css:
            #GeorgeWBush { position:absolute; bottom:-6ft; }
            1. moin :)

              ein online-beispiel könnte vllt. hilfreich sein, um den sachverhalt nachvollziehen zu können.

              Weiss ich wohl.. und wenn das möglich wäre, hätte ich auch eines zur Verfügung gestellt. Leider hängt an diesem Projekt ein riesiger Rattenschwanz, was es quasi unmöglich macht das ganze "mal eben online zu stellen"... - sorry!

              liebe Grüße aus Berlin
              lina-

              --
              Self-Code: ie:% fl:( br:^ va:) ls:/ fo:| rl:( ss:) de:] js:| mo:)
              1. Hallo,

                ein online-beispiel könnte vllt. hilfreich sein, um den sachverhalt nachvollziehen zu können.
                Weiss ich wohl.. und wenn das möglich wäre, hätte ich auch eines zur Verfügung gestellt. Leider hängt an diesem Projekt ein riesiger Rattenschwanz, was es quasi unmöglich macht das ganze "mal eben online zu stellen"... - sorry!

                also mal ehrlich so einen quatsch habe ich schon lange nicht mehr gelesen.
                  wenn du wolltest würdest du, es geht nicht darum die applikation zu zeigen, sondern nur den relevanten teil, der diese update und formular geschichte betrifft, und das nicht als struts.

                gruss

                --
                no strict;
                no warnings;
                Ich weiss es nicht, aber ich bin mir nicht sicher.
                Craptastic.
                Wenn ich groß bin, werde ich eine nervige künstliche Intelligenz.
                1. moin :)

                  also mal ehrlich so einen quatsch habe ich schon lange nicht mehr gelesen.
                    wenn du wolltest würdest du, es geht nicht darum die applikation zu zeigen, sondern nur den relevanten teil, der diese update und formular geschichte betrifft, und das nicht als struts.

                  stimmt - ich haette das ganze natuerlich erstmal in HTML umbauen können  und _das_ dann online stellen - soweit hab ich dann nicht gedacht ;)
                  beherzige ich aber fürs nächste mal!

                  liebe Grüße aus Berlin
                  lina-

                  --
                  Self-Code: ie:% fl:( br:^ va:) ls:/ fo:| rl:( ss:) de:] js:| mo:)
  3. Hallo,

    warum eigentlich so kompliziert, ich wurde den umweg über
      document.getElementById('calText').blur() gar nicht gehen.
      du hast ein textfeld:
      <form .. onsubmit="return submitthiscrap()" ..>
      <.. id="textfeld" onblur="update(this)" ..>

    ~~~javascript

    function submitthiscrap(){
        update(document.getElementById('textfeld'));
        return true;
      }

    function update(me){
        //das ist deine funktion die den ganzen MUFF macht.
      }

      
    gruss
    
    -- 
    no strict;  
    no warnings;  
      
    Ich weiss es nicht, aber ich bin mir nicht sicher.  
    Craptastic.  
    Wenn ich groß bin, werde ich eine nervige künstliche Intelligenz.
    
    1. moin :)

      warum eigentlich so kompliziert, ich wurde den umweg über
        document.getElementById('calText').blur() gar nicht gehen.
        du hast ein textfeld:
        <form .. onsubmit="return submitthiscrap()" ..>
        <.. id="textfeld" onblur="update(this)" ..>

      ~~~javascript

      function submitthiscrap(){
          update(document.getElementById('textfeld'));
          return true;
        }

      function update(me){
          //das ist deine funktion die den ganzen MUFF macht.
        }

        
      Das ähnelt stark meinem ersten Ansatz - und hat den Effekt, dass die update-Methode zweimal ausgeführt wird.  
      Aber du hast recht, dass blur() eigentlich nur ein Umweg ist ;)  
      Nur weiss ich mir noch nicht anders zu helfen...  
        
        
      liebe Grüße aus Berlin  
      lina-
      
      -- 
      Self-Code: ie:% fl:( br:^ va:) ls:/ fo:| rl:( ss:) de:] js:| mo:) 
      
      1. Hallo,

        Das ähnelt stark meinem ersten Ansatz - und hat den Effekt, dass die update-Methode zweimal ausgeführt wird.
        Aber du hast recht, dass blur() eigentlich nur ein Umweg ist ;)
        Nur weiss ich mir noch nicht anders zu helfen...

        liebe Grüße aus Berlin
        lina-

        soweit ich mich erinnern kann gibt es noch einen onchange event handler, wie wärs mit dem und dir, vertragt ihr euch?

        gruss

        --
        no strict;
        no warnings;
        Ich weiss es nicht, aber ich bin mir nicht sicher.
        Craptastic.
        Wenn ich groß bin, werde ich eine nervige künstliche Intelligenz.
        1. moin :)

          soweit ich mich erinnern kann gibt es noch einen onchange event handler, wie wärs mit dem und dir, vertragt ihr euch?

          *lach* der verträgt sich leider schon mit meinem Kollegen - der auf alle Elemente ne onchange-Funktion hat ;)
          oder kann man onchange quasi "doppelt" belegen?
          liebe Grüße aus Berlin
          lina-

          --
          Self-Code: ie:% fl:( br:^ va:) ls:/ fo:| rl:( ss:) de:] js:| mo:)
          1. Hallo,

            onevent="macheDies;macheDas;"

            oder onevent="macheBeides;"

            funtion macheBeides(){
                macheDies;
                macheDas;
              }

            gruss

            --
            no strict;
            no warnings;
            Ich weiss es nicht, aber ich bin mir nicht sicher.
            Craptastic.
            Wenn ich groß bin, werde ich eine nervige künstliche Intelligenz.
            1. moin :)

              Hallo,

              onevent="macheDies;macheDas;"

              oder onevent="macheBeides;"

              funtion macheBeides(){
                  macheDies;
                  macheDas;
                }

              hmm wusste ich noch gar nicht!
              Das werde ich gleich morgen früh als erstes ausprobieren... jetzt mach ich aber erstmal Feierabend!
              Ich danke euch erstmal ganz herzlich!

              liebe Grüße aus Berlin
              lina-

              --
              Self-Code: ie:% fl:( br:^ va:) ls:/ fo:| rl:( ss:) de:] js:| mo:)
  4. moin :)

    Habs hinbekommen :) *freu*
    War im Endeffekta gar nicht sooo schwierig.
    Vor allem hat mir die Info geholfen, dass man onSubmit unterbrechen kann, in dem man ein false zurückgibt.

    Meine Lösung ist jetzt folgendermaßen:

    • die Form (bin zu faul das in HTML zu übersetzen - wichtig ist ja eh nur der onsubmit-Aufruf):
      <html:form target="tabContent"  onsubmit="return checkTextField('submit', 'calText')" action="/OrderQueryAction" >

    Hier übergebe ich jetzt neben der ID des Textfeldes auch den Kontext in dem die Funktion aufgerufen wird (in diesem Fall Submit)

    • das Textfeld:
      <html:text onchange="checkClear()" styleId="calText"  name="orderQueryForm" property="pubdate" onblur="checkTextField('blur', this.id)"/>

    Wichtig ist auch hier nur der onblur-Aufruf --> es ist die gleiche Funktion wie bei submit - nur eben mit dem Kontext "blur"

    • Die Funktion:
      function checkTextField(method, txtId){
         if(method!="submit"){
             updateTextField(txtId);
             return false;
          }
          else{
             window.setTimeout('document.forms[0].submit()', 100);
             return false;
          }
      }

    Hier prüfe ich aus welchem Kontext der Aufruf kommt - nur bei "blur" soll das Feld ein update bekommen. (weil ja jedes onsubmit ein blur hinter sich her zieht bzw. vor sich her schiebt - und zweimal muss nicht sein)
    Ist der Aufruf allerdings von submit soll ein Submit ausgeführt werden (klar *G*) - das allerdings zeitverzögert, damit das update Zeit hat, fertig zu werden und so das "neue" submit die aktuellen Werte übergibt. Das "eigentliche" submit breche ich ab, in dem ich false zurückgebe.

    Bissl umständlich - aber es funktioniert ;)
    Ich danke euch allen für eure Geduld und vor allem für eure Hilfe :)

    liebe Grüße aus Berlin
    lina-

    --
    Self-Code: ie:% fl:( br:^ va:) ls:/ fo:| rl:( ss:) de:] js:| mo:)