2009-10-12 11 views
9

मैं खरीदारी की टोकरी जहां निम्न होना सत्य हैं:नेस्टेड रूपों

  • नहीं है एक "निकालें" बटन प्रत्येक उत्पाद के लिए खरीदारी की टोकरी में
  • एक संपादन योग्य मात्रा पाठ नहीं है खरीदारी की टोकरी में प्रत्येक उत्पाद के लिए बॉक्स
  • वहाँ पूरे खरीदारी की टोकरी के लिए एक "अपडेट" बटन है

विचार है कि उपयोगकर्ता की टोकरी में प्रत्येक उत्पाद के लिए मात्रा को संशोधित करने और क्लिक करें "अपडेट" कर सकते हैं सेवा मेरे परिवर्तन करें।

एमवीसी का उपयोग करके आप "अपडेट" बटन कैसे प्रोग्राम करेंगे? क्या आप पूरे शॉपिंग कार्ट को ऐसे फॉर्म में लपेटेंगे जो स्वयं को पोस्ट करता है और किसी भी तरह फॉर्मकोलेक्शन में मात्रा मानों का पता लगाता है? उस दृष्टिकोण के साथ समस्या यह है कि चूंकि प्रत्येक "निकालें" बटन अपने स्वयं के रूपों में रहते हैं, इसलिए अब मैं पृष्ठ पर नेस्टेड फॉर्म कर रहा हूं और मुझे यह भी सुनिश्चित नहीं है कि इसकी अनुमति है।

 <% using (Html.BeginForm("Index", "Cart")) { %> 
     <table> 
      <tr> 
       <th>&nbsp;</th> 
      </tr> 
     <% foreach (var item in Model) { %> 
      <tr> 
       <td> 
        <input name="qty" type="text" value="<%=item.Quantity%>" maxlength="2" /> 
        <% using (Html.BeginForm("RemoveOrderItem", "Cart")) { %>      
         <%= Html.Hidden("ShoppingCartItemID", item.ShoppingCartItemID) %> 
         <input name="add" type="submit" value="Remove" /> 
        <%} %> 
       </td> 
      </tr> 
     <% } %> 
     </table> 

     <input name="update" type="submit" value="Update" /> 
     <%} %> 

मैं इस फ़ॉर्म में नीचे इनपुट कैसे शामिल करूं?

उत्तर

4

हम निकालें के लिए एक व्यक्ति के रूप का उपयोग करके अपने परियोजना पर इस किया है, और अद्यतन के लिए एक पूरी तरह से अलग रूप । वे दोनों कार्टकंट्रोलर में अलग-अलग पोस्ट क्रियाओं पर जाते हैं।

अद्यतन: दिए गए उदाहरण (कच्चे HTML में):

<form action="/cart/updatequantity" method="post"> 
    <input type="hidden" name="ProductSku" value="ABC-123" /> 
    <input name="quantity" class="quantity" size="2" maxlength="2" type="text" value="1" /> 
    <input type="submit" value="Update" /> 
</form> 

<form action="/cart/removeitem" method="post"> 
    <input type="hidden" name="productSku" value="ABC-123" /> 
    <input type="submit" value="Remove" /> 
</form> 
+5

यदि यह स्पष्ट नहीं है ... घोंसला नहीं है, बस एक-दूसरे के बगल में। –

+0

क्या आप एक उदाहरण दे सकते हैं? मेरे पास पृष्ठ के निचले हिस्से में केवल एक अपडेट बटन है और मात्रा वाले टेक्स्टबॉक्स आइटम स्तर पर हैं। आप इसे सही तरीके से कैसे बनाते हैं? – Thomas

+0

मेरे लिए इस मुद्दे को हल करने के लिए लिंक करना: http://stackoverflow.com/questions/3102133/internet-explorer-nested-form-post/3102441#3102441 – KristianB

9

नेस्टेड फॉर्म स्पष्ट रूप से HTML में समर्थित नहीं हैं।

हालांकि आपके पास कई रूप हैं, इसकी अनुमति है। प्रत्येक उत्पाद को एक अलग रूप में लपेटें, प्रत्येक फॉर्म पोस्ट यूआरएल में एक उत्पाद-विशिष्ट पैरामीटर जोड़ें ताकि आप संबंधित नियंत्रक कार्रवाई में जान सकें जिसे उत्पाद को अद्यतन करने की आवश्यकता है।

कुछ इस तरह:

<form action="/update/21342345"> 
</form> 

मैं इस रूप में नीचे इनपुट शामिल हैं?

दो विकल्प:

  1. दें प्रत्येक का अपना सबमिट बटन के रूप में। इसे "इस उत्पाद को अपडेट करें" जैसे कुछ कॉल करें। आप निर्दिष्ट करेंगे कि यूआरएल पैरामीटर में कौन सा अपडेट करना है।
  2. सबमिट बटन के साथ एक ही रूप में पूर्ण जेनरेट की गई तालिका को लपेटें। सबमिट किए जाने पर, आपको फॉर्म में निहित सभी उत्पादों को अपडेट करना होगा। या किसी भी तरह से पता चलता है कि कौन से परिवर्तन हुए थे और केवल उनको अपडेट करें।

सलाह दोनों बटनों पर लागू होती है, सबमिट और हटाती है। आप की तरह, पोस्ट यूआरएल में कार्य निर्दिष्ट कर सकते हैं:

action="/update/21342345" 

या

action="/delete/21342345" 
2

मैं ऐसी ही स्थिति में jQuery का उपयोग कर रहा हूँ।हटाएं बटन कॉल() विधि को हटाएं और यदि यह सफल होता है, तो इस उत्पाद का div तत्व पृष्ठ से हटा दिया जाता है (निकालें() विधि)। अद्यतन सामान्य रूप से जमा किया जा सकता है। आप एजेक्स अपडेट विधि प्रोग्राम करने के लिए jQuery का भी उपयोग कर सकते हैं और उसके बाद पूरे पृष्ठ को फिर से लोड किए बिना शॉपिंग कार्ट को गतिशील रूप से लोड कर सकते हैं ($() (।)। html() विधि() के कॉलबैक में कॉल की गई विधि)।

निकालें दिखाई दे सकता है जैसे:

onclick = "अगर (इस बात की पुष्टि ('कृपया पुष्टि करें।')) $ .post ('/ गाड़ी// 63 निकालें', {}, समारोह (डेटा) { अगर (डेटा == 'ठीक') {$ ('# कार्ट-एलिमेंट -63')। हटाएं()) ";

1

मैं एक ही टिप की तलाश में था, और यह पोस्ट मिला। मैंने अभी हटाए गए बटन के लिए सबमिट बटनों का उपयोग करके और अद्वितीय मात्रा टेक्स्ट फ़ील्ड नामों का उपयोग करके यह किया है।

एक ही फॉर्म पूरे कार्ट को लपेटता है। प्राथमिक सबमिट बटन अपडेट कार्ट बटन होगा। प्रत्येक हटाए गए आइटम बटन को उस कार्ट आइटम की अनूठी कुंजी पर एक मान सेट के साथ "निकालें" नाम दिया गया है।

<input class="btnRemove" name="remove" type="image" value="@item.ProductId" /> 

प्रत्येक मात्रा पाठ फ़ील्ड गाड़ी आइटम के लिए अद्वितीय कुंजी लगी होती है "qnty-"।

<input id="[email protected]" name="[email protected]" type="text" value="@item.Quantity" class="cartListQty" /> 

एक बार फॉर्म क्रिया चयन के माध्यम से मेरी क्रिया लूप सबमिट कर दिया। अगर नाम "हटाएं" है, तो मैं कार्ट से उस अनूठी कुंजी को हटा देता हूं। यदि नाम "qnty-" से शुरू होता है तो मुझे शेष नाम (अद्वितीय कार्ट आइटम कुंजी) मिलता है और उस आइटम को टेक्स्ट फ़ील्ड के मान में समायोजित करता है।

[HttpPost] 
public ActionResult Index(FormCollection collection) 
{ 
Cart myCart = cartRepo.LoadCart(); 
foreach (string item in collection.AllKeys) 
{ 
    if (item.StartsWith("qnty-")) 
    { 
    int productId = Convert.ToInt32(item.Substring(5)); 
    // Adjust quantity 
    } 
    if (item == "remove") // Remove item from cart 
} 
cartRepo.Save(); 
return RedirectToAction("Index"); 
} 
संबंधित मुद्दे