Reichen Sie mehrere Formulare mit einem submit-button

Ich habe den folgenden code, im Grunde ist es bei zwei Operationen. Erste Vorlage meine Formular-Daten an die google-Tabelle und die andere operation ist die übermittlung meiner zweiten form textbox-Wert-Daten zu einer anderen Seite textbox-Wert. Wie Sie dies tun?

<script type="text/javascript">

<!--
   function copy_data(val){
 var a = document.getElementById(val.id).value
 document.getElementById("copy_to").value=a
}
//-->
</SCRIPT>
<style type="text/css">
<!--
-->
</style>

</head>
<body >
<script type="text/javascript">var submitted=false;</script>           
 <iframe name="response_iframe" id="hidden_iframe" style="display:none;" onload="if(submitted){window.location='Thanks.asp';}"></iframe>            <form action="https://docs.google.com/spreadsheet/formResponse?formkey=dGtzZnBaYTh4Q1JfanlOUVZhZkVVUVE6MQ&ifq" method="post" target="response_iframe" id="commentForm" onSubmit="submitted=true;">

<!-- #include virtual="/sts/include/header.asp" -->
<!-- ABove this Header   YJC -->   
<table style="background-color: #FFC ;"  width="950"  align="center" border="0" summary="VanaBhojnaluBooking_Table">
<tr><td colspan="7"><p class="MsoNormal" align="center" style="text-align:center;"><strong><span style="line-height:115%; font-family:'Arial Rounded MT Bold','sans-serif'; font-size:16.0pt; color:#76923C; ">Karthika Masa Vanabhojanalu &ndash; Participation Booking</span></strong></p>
<p class="MsoNormal" align="center" style="text-align:center;"><strong><em><span style="line-height:115%; font-size:20.0pt; color:#7030A0; ">13<sup>th</sup> Nov  2011 - @ West Coast Park - Singapore</span></em></strong></p>
  <p class="MsoNormal" align="center" style="text-align:center;"><strong><span style="color:#7030A0; ">Reserve your participation and avail </span><span style="color:red; "> <a  target="_blank" href="/STS/programs/VB_2011_info.asp"> DISCOUNT </a></span><span style="color:#7030A0; "> on the ticket</span></strong></p></td> </tr>
    <tr>
    <th width="37" scope="col">&nbsp;</th>
    <th width="109" rowspan="5" valign="top" class="YJCRED" scope="col"><div align="left"><font size="2"> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;* Required</font></div></th>
    <td width="68" scope="col"><div align="right"><font size="2.5px">Name</font><span class="yj"><span class="yjcred">*</span></span></div></td>
    <th colspan="3" scope="col"><label for="Name"></label>
      <div align="left">
        <input  name="entry.0.single" class="required" style="width:487px; height:25px; vertical-align:middle;"  type="text" id="entry_0" title="Enter your name" >
      </div></th>
    <th width="223" scope="col">&nbsp;</th>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td><div align="right"><font size="2.5px">Phone</font><span class="yj"><span class="yjcred">*</span></span></div></td>
    <td width="107"><input  name="entry.1.single" class="required" title="Handphone Number with out +65" maxlength="8" style="width:100px;height:25px;" type="text" onkeyup="copy_data(this)"  onKeyPress="return numbersonly(this, event)" id="entry_1" ></td>
    <td width="170"><div align="right"><font size="2.5px">Email</font><span class="yj"><span class="yjcred1">*</span></span></div></td>
    <td width="206"><input name="entry.2.single" type="text" style="width:190px;height:25px;" id="required" title="Enter your email address"  class="required email" ></td>
  </tr>


  <tr>
    <td>&nbsp;</td>
    <td><div align="right"><font size="2.5px">Home Phone</font></div></td>
    <td width="107"><input  name="entry.1.single"  title="Handphone Number with out +65" maxlength="8" style="width:100px;height:25px;" type="text" onKeyPress="return numbersonly(this, event)" id="entry_100" ></td>

  </tr>


  <tr>
    <td align="center" colspan="7"><p>&nbsp;
      </p>
      <p>
        <input type="submit" name="submit" onMouseOver="Window.status='You can not see anything';return true"  onMouseOut="window.status='Press SUBMIT only after proper inforatmion entering then you are Done'" onClick="jQuery.Watermark.HideAll();"   value="Submit">
    </p>
    <p>&nbsp;</p></td>
  </tr>
  <p>&nbsp;</p>
  <tr>
    <td colspan="25"></td>
  </tr>
</table>

</form>
<form method="Link" Action="Sankranthi_Reserv2.asp">
<input disabled   name="copy of hp" maxlength="8" style="width:100px;height:25px;" type="text" id="copy_to" >

</form>


<p><!-- #include virtual="/sts/include/footer.asp" -->

  <input type="hidden" name="pageNumber" value="0">
  <input type="hidden" name="backupCache" value="">
<script type="text/javascript">

      (function() {
var divs = document.getElementById('ss-form').
getElementsByTagName('div');
var numDivs = divs.length;
for (var j = 0; j < numDivs; j++) {
if (divs[j].className == 'errorbox-bad') {
divs[j].lastChild.firstChild.lastChild.focus();
return;
}
}
for (var i = 0; i < numDivs; i++) {
var div = divs[i];
if (div.className == 'ss-form-entry' &&
div.firstChild &&
div.firstChild.className == 'ss-q-title') {
div.lastChild.focus();
return;
}
}

Wie Sie sehen können von oben, ist dies die erste Seite und die zweite Seite, wo ich bezog Sankranthi_Reserv2.asp in der zweiten form. Möchte ich weitergeben das textbox-Wert über es, das problem ist also die erste form ist die Vorlage zu google docs und der Speicherung der Daten, aber die zweite form übergeben zu müssen, die schützen-Nummer textbox Wert auf die nextpage textbox Wert, aber es gibt nur einen SUBMIT-button.

Könnte man vereinfachen Sie Ihre Beispiel-code durch das entfernen von unwichtigen details? Es ist schwer, dies zu verstehen.
sorry Mann, du gehst kürzeren code, aber zur info alles ist in Ordnung, außer das problem, das habe ich erwähnt, über die Schaltfläche "senden" für zwei Formen und das zweite Formular senden Werte zur anderen Seite, während das erste Formular sendet die Werte der Textfelder zu den google-Tabellen..tks
Ich sehe immer noch viele irrelevante Informationen. Könnten Sie es 10-15 Zeilen kurz?

InformationsquelleAutor JackyBoi | 2011-12-19

7

Für die Abgabe der beiden Formulare, die Sie haben, um Ajax verwenden. Als nach der Verwendung von form.submit() Seite wird geladen, action-URL für das Formular. so dass Sie wird zu tun haben, dass asynchron.

So kannst du beide Anfrage asynchron-oder senden Sie eine Anfrage asynchron und nach seiner Erfolg reichen zweiten form.
```
function submitTwoForms() {
var dataObject = {"form1 Data with name as key and value "};
    $.ajax({
      url: "test.html",
      data : dataObject,
      type : "GET",
      success: function(){
        $("#form2").submit();   //assuming id of second form  is form2
      }
    });
    return false;   //to prevent submit
}
```
Können Sie binden diese submitTwoForms() - Funktion auf Ihrem Sie, dass die Schaltfläche "senden". Mit
```
$('#form1').submit(function() {
    submitTwoForms();
    return false;
});
```
Aber, wenn Sie nicht wollen, um all dies zu tun, können Sie Jquery form plugin , senden Sie das Formular per Ajax.

Ich würde vorschlagen, mit "event.preventDefault();" über "return false;". Aber kein argument um es richtig funktioniert 🙂
Pradeep wunderte ich mich dieser Linie zu ändern", {"form1 Daten, die mit Namen als Schlüssel und Wert "};" richtige "Dokument.getobjectbyname("form1")...? Aber da bin ich nicht sicher, ob Sie gesehen haben, meinen code in den ersten post, weil meine zwei Formulare verwenden unterschiedliche Methoden, eine ist, der andere BEITRAG ist der LINK. also das zweite Formular wie ist es mit der LINK-Methode, damit Sie es senden werden die Daten in der html-link (ich weiß, es ist ausgesetzt, es ist ok) also ich bin nicht sicher, was zu ersetzen Sie Ihre code-Zeile mit..werfen Sie bitte einen Blick auf meinen code von oben und Ratschläge weiter.Tks
Benutzt habe ich diese Zeile als "Platzhalter". Wie haben Sie den code schreiben, für die Erstellung, die variable (wenn es zwei input-dann wird jeder name jedes Eingangs wird key und deren Wert wird mit dem Wert für den entsprechenden Schlüssel). Für viele Variablen es wird mühsam sein, so viele plugin verwenden. aber in Ihrem Fall kann man direkt erstellen, das Objekt als { inputname : "value"} indem Sie, dass die Eingänge name und dessen Wert durch document.getELementByID
Ok, pradeep, die ich bei der Arbeit bin, jetzt werde ich Sie aktualisieren, sobald ich nach Hause kommen, aber ich habe noch Zweifel, wie Sie diese Funktion aktivieren? wie in der submit-buttons onclick-event-handler kann ich nur diese Funktion und es funktioniert?
Ja, Sie binden können, die Funktion mit jquery .submit() Funktion doc

InformationsquelleAutor Pradeep
8

Etwas wie dies funktionieren würde:
```
$('#form1_submit_button').click(function(){
    $('form').each(function(){
        $(this).submit();
    });
});
```
Alternative:
```
$('#form1_submit_button').click(function(){
    $('#form1 #form2 #form3').submit();
});
```
bitte siehe unten im letzten Kommentar entsprechen sollten um die gleiche Zeit wie dieser Kommentar. Ich bin mit zwei verschiedenen Methoden für die beiden Formen

InformationsquelleAutor Gustav
-2

die einfachste Möglichkeit, die ich gefunden habe, ist so etwas wie das
```
<form method='post' action='whatever?whatever1=blah&whatever2=blah'>
<?php
header ("Location: http://example.com/whatever.html");
?>
```
Wird dies tun, wird die Aktion von der form (ohne Anzeige im browser), dann redirect auf die Seite der Kopfzeile.

InformationsquelleAutor Degar007

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.