आप एमवीसी और jQuery AJAX के साथ ऑब्जेक्ट्स कैसे पास करेंगे?

Question

मैं आखिरकार एएसपीनेट के वर्षों के बाद एमवीसी सीखने और कोशिश करने की कोशिश कर रहा हूं।
मैं asp.net AJAX PageMethods का उपयोग कर जहां एक वस्तु है कि स्वतः जो कुछ भी प्रकार पैरामीटर है कि विधि में है पर पार्स हो जाता है पारित कर सकते हैं करने के लिए इस्तेमाल कर रहा हूँ।

जावास्क्रिप्ट:

PageMethods.AddPerson({First:"John",Last:"Doe"}); 

कोड-पीछे:

[WebMethod] 
public static Result AddPerson(Person objPerson) 
{ 
    return Person.Save(); 
} 

इस MVC और jQuery का उपयोग कर कैसे करना होगा?
सिर्फ तार भेजने के लिए और पार्स JSON ऑब्जेक्ट के लिए करने के लिए किया है?

Answer 1

यह इस बात पर निर्भर करता है कि आपका फॉर्म डेटा कितना जटिल होगा। चलो एक jQuery उदाहरण देखें:

$.ajax({ 
    url: '\Persons\AddPerson', // PersonsController, AddPerson Action 
    data: { First: "John", Last: "Doe" }, 
    type: 'POST', 
    success: function(data, status) 
    { 
     alert('Method called successfully!'); 
    } 
}); 

तो हम डेटा के दो टुकड़े पोस्ट। यदि व्यक्ति वर्ग में 'फर्स्ट' और 'लास्ट' नामक दो गुण होते हैं, तो डिफ़ॉल्ट एएसपी.नेट एमवीसी मॉडल बाइंडर को इस फॉर्म डेटा को उन गुणों में डालने में कोई समस्या नहीं होनी चाहिए (बाकी सब कुछ डिफॉल्ट हो जाएगा)।

बेशक, आप हमेशा व्यक्ति के प्रकार के लिए कस्टम मॉडल बाइंडर बना सकते हैं, और फिर आप जो भी फॉर्म वैल्यू चाहते हैं उसे ले सकते हैं और उन्हें किसी भी संपत्ति में डाल सकते हैं, या किसी अन्य प्रकार के तर्क को कॉल कर सकते हैं।

Answer 2

जब आप अपने नियंत्रक पर एक कार्रवाई विधि के लिए ajax के माध्यम से फ़ॉर्म पोस्ट, ModelBinder वास्तुकला में लात मारता है आप के लिए व्यापार वस्तुओं में तैनात प्रपत्र मूल्यों पार्स करने के लिए। आप कुछ अलग तरीकों से मॉडलबाइंडिंग का लाभ उठा सकते हैं।

public ActionResult MyAction(MyObject obj) 
{ 
} 

उपरोक्त उदाहरण में, modelbinder परोक्ष जानकारी अनुरोध में प्राप्त से एक MyObject बनाने के लिए कोशिश करता है।

public ActionResult MyAction(FormCollection stuff) 
{ 
    MyObject obj = new MyObject(); 
    TryUpdateModel(obj); 
} 

यहां हम स्पष्ट रूप से पोस्ट किए गए फॉर्म डेटा को उस ऑब्जेक्ट में बांधने की कोशिश कर रहे हैं जिसे हमने बनाया है। मॉडलबिंडर पोस्ट मानों को ऑब्जेक्ट के गुणों से मिलान करने का प्रयास करेगा।

इनमें से किसी भी मामले में, आप ModelState ऑब्जेक्ट से यह पूछने के लिए क्वेरी कर सकते हैं कि ऑब्जेक्ट पर पोस्ट किए गए मानों के अनुवाद के दौरान कोई त्रुटि हुई थी या नहीं।

एक परिचय बंधन मॉडल करने के लिए के लिए, see here।

सूचियों और शब्दकोशों, see Phil Haack's post करने के लिए उन्नत modelbinding लिए

। अपने व्यवस्थापक नियंत्रक पर

var person = {}; 
person["First"] = $("#FirstName").val(); 
person["Last"] = $("#LastName").val(); 

$.ajax({ 
     type: "POST", 
     contentType: "application/json; charset=utf-8", 
     url: "/Admin/AddPerson", 
     data: JSON.stringify(person), 
     dataType: "json", 
     success: function(result) { 

     }, 
     error: function(result) { 

     } 
}); 

और उसके बाद:

Answer 3

आप कुछ इस तरह कर सकता है

[AcceptVerbs(HttpVerbs.Post)] 
public ActionResult AddRelease(Person p) 
{ 
    // Code to add person    

} 

JSON.stringify विधि here से उपलब्ध है। आप व्यक्ति ऑब्जेक्ट के बजाय एक पैरामीटर के रूप में मॉडल का उपयोग भी कर सकते हैं जिस तरह से आप अपने सभी सत्यापन को संभाल सकते हैं।

Answer 4

मेरे पास एक पोस्ट है जिसमें AJAX कॉल को एएसपी.नेट एमवीसी एक्शन विधियों में शामिल किया गया है। यह निम्न संयोजन को शामिल किया गया:

• HTTP GET, पोस्ट
• jQuery तरीकों $ .Get, $ .getJSON, $ .post
• कार्रवाई तरीकों
• रिटर्निंग मानकों (तार और JSON में पैरामीटर भेजा जा रहा है) कार्रवाई तरीकों
• पोस्टिंग प्रपत्र डेटा
• AJAX
के माध्यम से

एक MVC आंशिक दृश्य लोड हो रहा है से

AJAX calls to ASP.NET MVC action methods using jQuery

Answer 5

मुझे लगता है मैं एक धोखेबाज़ हूँ और निम्न करें:

 $("#ProgressDialog").dialog({ 
      autoOpen: false, 
      draggable: false, 
      modal: true, 
      resizable: false, 
      title: "Loading", 
      closeOnEscape: false//, 

      // open: function() { $(".ui-dialog-titlebar-close").hide(); } // Hide close button 
     }); 
     $("form").live("submit", function (event) { 
       event.preventDefault(); 
       var form = $(this); 
       $("#ProgressDialog").dialog("open"); 
       $.ajax({ 
        url: form.attr('action'), 
        type: "POST", 
        data: form.serialize(),//USE THIS to autoserialize! 
        success: function (data) { 
         $("#dialog").dialog({height:0}); 
        }, 
        error: function (jqXhr, textStatus, errorThrown) { 
         alert("Error '" + jqXhr.status + "' (textStatus: '" + textStatus + "', errorThrown: '" + errorThrown + "')"); 
        }, 
        complete: function() { 
         $("#ProgressDialog").dialog("close"); 

        } 
       }); 
      }); 
     }); 

<div id="ProgressDialog" style="text-align: center; padding: 50px;"> 
    <img src="@Url.Content("~/Content/ajax-loader.gif")" width="128" height="15" alt="Loading" /> 
</div>