2011-12-19 24 views
11

मेरे पास निम्न कोड है, मूल रूप से यह दो संचालन कर रहा है। सबसे पहले मेरा फॉर्म डेटा Google स्प्रेडशीट में सबमिट कर रहा है और दूसरा ऑपरेशन मेरा दूसरा फॉर्म टेक्स्टबॉक्स वैल्यू डेटा दूसरे पेज टेक्स्टबॉक्स वैल्यू पर सबमिट कर रहा है। यह कैसे करना है?एक सबमिट बटन के साथ कई रूपों को सबमिट करें

<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; 
} 
} 

आप ऊपर से देख सकते हैं, यह पहली पेज है और दूसरे पृष्ठ में जहाँ मैं दूसरा रूप में Sankranthi_Reserv2.asp की चर्चा करते हुए किया गया था। मैं वहां टेक्स्टबॉक्स मान पास करना चाहता हूं, इसलिए समस्या यह है कि पहला फॉर्म Google डॉक्स को सबमिट कर रहा है और डेटा संग्रहीत कर रहा है, लेकिन दूसरे फॉर्म को हैंडफोन नंबर टेक्स्टबॉक्स मान को अगले पृष्ठ टेक्स्टबॉक्स मान में पास करने की आवश्यकता है, लेकिन केवल वहां है एक सबमिट बटन।

+2

क्या आप अप्रासंगिक विवरण निकाल कर अपने नमूना कोड को सरल बना सकते हैं? इसे समझना मुश्किल है। –

+0

खेद है कि आप वहां छोटे कोड पर जाते हैं, लेकिन एफवाईआई सबकुछ ठीक काम कर रहा है, इस समस्या को छोड़कर मैंने दो फॉर्मों के लिए एक सबमिट बटन के बारे में बताया और दूसरा फॉर्म दूसरे पृष्ठ पर मूल्य भेज रहा है जबकि पहला फॉर्म टेक्स्टबॉक्स के मानों को Google पर भेज रहा है स्प्रेडशीट्स..टीक्स – JackyBoi

+1

मुझे अभी भी बहुत सारी अप्रासंगिक जानकारी दिखाई देती है। क्या आप इसे 10-15 लाइनों को कम कर सकते हैं? –

उत्तर

7

दो रूपों को प्रस्तुत करने के लिए आप अजाक्स का उपयोग करना होगा। Form.submit() पृष्ठ का उपयोग करने के बाद उस फॉर्म के लिए एक्शन यूआरएल लोड होगा। तो आपको असीमित रूप से ऐसा करना होगा।

तो आप दोनों अनुरोध अतुल्यकालिक रूप से भेज सकते हैं या एक अनुरोध को असीमित रूप से भेज सकते हैं और इसकी सफलता के बाद दूसरा फॉर्म जमा कर सकते हैं।

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 
} 

आप अपने उस एक सबमिट बटन पर इस submitTwoForms() समारोह बाध्य कर सकते हैं। ,

$('#form1').submit(function() { 
    submitTwoForms(); 
    return false; 
}); 

का उपयोग लेकिन अगर आप यह सब नहीं करना चाहते हैं, तो आप Jquery form plugin का उपयोग अजाक्स का उपयोग प्रपत्र सबमिट कर सकते हैं।

+0

मैं "event.preventDefault();" का उपयोग करने का सुझाव दूंगा "झूठी वापसी" पर। लेकिन इसके बारे में कोई तर्क सही तरीके से काम नहीं कर रहा है :-) – Flater

+0

प्रदीप मैं इस पंक्ति को "{" फॉर्म 1 डेटा को नाम और मूल्य के रूप में बदलने के लिए सोच रहा था "};" इस अधिकार के लिए "document.getobjectbyname (" form1 ") ...? लेकिन जैसा कि मुझे यकीन नहीं है कि आपने पहले कोड में अपना कोड देखा है क्योंकि मेरे दो रूप अलग-अलग तरीकों का उपयोग करते हैं, एक पोस्ट है दूसरा दूसरा लिंक है। तो दूसरा फॉर्म के रूप में यह लिंक विधि का उपयोग कर रहा है, इसलिए यह एचटीएमएल लिंक में डेटा भेज देगा (मुझे पता है कि यह खुलासा हुआ है यह ठीक है) इसलिए मुझे यकीन है कि कोड की अपनी लाइन को प्रतिस्थापित करने के लिए क्या है .. कृपया मेरे कोड को देखें ऊपर और सलाह आगे। – JackyBoi

+1

@JackyBoi मैंने प्लेसहोल्डर के रूप में उस पंक्ति का उपयोग किया है। जैसा कि, आपको उस चर को बनाने के लिए कोड लिखना होगा (यदि दो इनपुट हैं तो प्रत्येक इनपुट का प्रत्येक नाम 'कुंजी' होगा और उनका मूल्य इसी कुंजी के लिए मूल्य होगा)। कई चर के लिए यह बहुत ही उपयोगी प्लगइन होगा। लेकिन आपके मामले में आप सीधे उस वस्तु को 'इनपुट नाम: "मान"}' के रूप में उस इनपुट नाम और उसके मान को ' दस्तावेज़।getELementByID' – Pradeep

8

इस तरह काम करेगा:

$('#form1_submit_button').click(function(){ 
    $('form').each(function(){ 
     $(this).submit(); 
    }); 
}); 

वैकल्पिक:

$('#form1_submit_button').click(function(){ 
    $('#form1 #form2 #form3').submit(); 
}); 
+0

कृपया नीचे नवीनतम टिप्पणी ही समय के आसपास अनुरूप होना चाहिए देखने के हल मिल गया इस टिप्पणी के रूप में। मैं दोनों रूपों के लिए दो अलग-अलग तरीकों का उपयोग कर रहा हूं – JackyBoi

-2

सबसे आसान तरीका मैं पाया है इस

<form method='post' action='whatever?whatever1=blah&whatever2=blah'> 
<?php 
header ("Location: http://example.com/whatever.html"); 
?> 

की तरह कुछ इस की कार्रवाई कर देगा फॉर्म (इसे अपने ब्राउज़र में दिखाए बिना), फिर शीर्षलेख के पृष्ठ पर रीडायरेक्ट करें।

संबंधित मुद्दे