2010-09-06 15 views
5

मैं एक नियंत्रक कार्रवाई है जो एक आंशिक दृश्य renders है:ASP.NET MVC jQuery ajax के साथ आंशिक दृश्य प्रतिपादन

public ActionResult Details(int id) 
{ 
    DetailsViewModel model = 
     ModelBuilder.GetDetailsViewModel(id, _repository); 
    return PartialView("Details", model); 
} 

और मैं इस प्रकार एक गतिशील तत्व में लौटे सामग्री लोड कर रहा हूँ:

$container = appendContainer(); // adds a div to the dom with the correct id 
$container.load("MyController/Details", function(response, status, xhr) { 
    if (status != "success") { 
     $(container).html('an error has occured'); 
    } 
}); 

इसलिए यह एक div बनाता है, और फिर उस div में लौटाई गई सामग्री को लोड करता है।

मैं इसे थोड़ा बदलना चाहता हूं ताकि कंटेनर div केवल तभी बनाया जा सके जब नियंत्रक को कॉल सफल हो।

तो:

  1. jQuery नियंत्रक कार्रवाई
  2. नियंत्रक रिटर्न PartialView, या अशक्त यदि आईडी नहीं मिला
  3. PartialView लौटाया जाता है, कंटेनर बनाया है और लौटे सामग्री से भरा हुआ है कहते हैं।
  4. यदि नियंत्रक आईडी नहीं ढूंढता है, तो कोई सामग्री नहीं बनाई जाती है और एक चेतावनी प्रदर्शित होती है।

मैं किसी भी पॉइंटर्स की सराहना करता हूं कि मैं इसे कैसे प्राप्त कर सकता हूं।

उत्तर

11

सभी load सर्वर से एचटीएमएल वापस लौटाता है, तो क्यों न केवल एक अस्थायी div में संलग्न करें और फिर सफलता से HTML प्राप्त करें?

var $dummy = $("<div>"); 
$dummy.load("MyController/Details", function(response, status, xhr) { 
    var $container = appendContainer(); 
    if (status != "success") { 
     $container.html('an error has occured'); 
    } 
    else 
    { 
     $container.html($dummy.html()); 
    } 
    $dummy.remove(); 
}); 

अद्यतन:

आप तो आप इसे संभाल चाहिए एक अपवाद की उम्मीद कर रहे हैं। यदि आप मूल रूप से त्रुटि को status != "success" प्राप्त करने की अनुमति दे रहे हैं तो यह एक गंभीर कोड गंध है। आपको त्रुटि पकड़नी चाहिए और एक अलग PartialView वापस करना चाहिए।

public ActionResult Details(int id) 
{ 
    try 
    { 
     DetailsViewModel model = 
      ModelBuilder.GetDetailsViewModel(id, _repository); 
     return PartialView("Details", model); 
    } 
    catch (SomeException ex) 
    { 
     return PartialView("Error", ex.Message); 
    } 
} 

तो फिर तुम हमेशा एक वैध HTML प्रतिक्रिया की गारंटी कर रहे हैं और यदि आप नहीं करते हैं, तो अपने बुनियादी त्रुटि an error occured खेलने में आ जाएगा।

+0

इस के साथ मेरा आरक्षण यह है कि मैं अनिवार्य रूप से यूआई में एक शून्य/नहीं मिली स्थिति को वापस करने के लिए अपने दृश्य में एक अपरिचित अपवाद का उपयोग कर रहा हूं। यदि आइटम नहीं मिला है, तो मैं अपने नियंत्रक से एक नल वापस कर दूंगा, लेकिन मैं इस दृष्टिकोण को इसके साथ काम करने के लिए एक रास्ता नहीं देख सका। बस मुझे एक कोड गंध लगता है। – fearofawhackplanet

+0

@fearofawhackplanet - मेरा उत्तर अपडेट किया गया। – GenericTypeTea

11

आपके मामले में मैं अधिक प्रवाह + अधिक स्वच्छ

$.ajax({ 
url: "MyController/Details", 
    type: "GET", 
    success: function (response, status, xhr) 
    { 
     var jqContainer = appendContainer(); 
     jqContainer.html(response); 
    }, 
    error:function(XMLHttpRequest, textStatus, errorThrown) 
    { 
    //show the error somewhere - but this is a bad solution 
    } 
}); 

लगता है त्रुटि राज्य के विषय में आप अधिक नियंत्रण देता है $ .ajax बजाय .load() का प्रयोग करेंगे - मैं भी अपवाद पर निर्भर नफरत - templating समाधान के कुछ प्रकार का उपयोग कर दिए गए डेटा अपने विचारों से

  1. वापसी केवल JSON और बाँध इस तरह से आप एक विशिष्ट त्रुटि संदेश के साथ एक त्रुटि वस्तु लौट सकते हैं,: बदसूरत और अक्षम, आप इस संभाल करने के लिए कई तरीके हैं और सभी गलतियों को संभालें या तो वैसे ही (लगता है कि यह सबसे अच्छा समाधान है)।
  2. एक 204 सफलता स्थिति कोड लौटाएं- कोई प्रतिक्रिया नहीं जो आपकी क्रिया से शून्य को वापस करने की तरह है - फिर स्थिति कोड जांचें और त्रुटि संदेश पॉप अप करें।
  3. एक 278 सफलता स्थिति कोड (वास्तविक स्थिति कोड नहीं है लेकिन सफलता के लिए गिना जाता है और आपको डेटा भी भेजने देता है) - यहां आप त्रुटि संदेश के साथ एक जेसन ऑब्जेक्ट भेजते हैं जो छू सकता है और एक अच्छा त्रुटि संदेश बो सकता है (देखा कुछ समय पहले एसओ में यह 278 समाधान)।
  4. त्रुटि के लिए एक अलग दृश्य लौटाता है - लेकिन फिर आपको इसे कंटेनर या डमी कंटेनर में डालना होगा ताकि यह जांच सके कि क्या कोई त्रुटि है या नहीं, यदि आप अधिक कार्यवाही करना चाहते हैं।
मेरी कोड में

मैं $ (दस्तावेज़) .ajaxSend (..) का उपयोग 278 कोड के लिए सभी अजाक्स प्रतिक्रियाओं की जांच और विश्व स्तर पर त्रुटि संदेश दिखाते हैं जब किसी भी, या मूल शौकीन सफलता समारोह कॉल करने के लिए।

कार्रवाई मैं निम्नलिखित परिणाम का उपयोग से त्रुटि लौटने के लिए

public class AjaxErrorWithDetailsResult : JsonResult 
    { 
    public object ErrorResult { get; set; } 

    public AjaxErrorWithDetailsResult(object errorResult) 
    { 
     this.ErrorResult = errorResult; 
    } 


    public override void ExecuteResult(ControllerContext context) 
    { 
     if (context == null) 
     { 
      throw new ArgumentNullException("context"); 
     } 
     this.Data = ErrorResult; 
     context.HttpContext.Response.StatusCode = 278; 
     base.ExecuteResult(context); 
    } 
} 

जहां ErrorResult एक गुमनाम वस्तु या किसी वस्तु कि त्रुटिसंदेश की संपत्ति के साथ एक इंटरफ़ेस को लागू किया जा सकता है ताकि आप के लिए देखने के लिए क्या है पता चल जाएगा जेएस

+1

मैं आपसे सहमत हूं! $ AJAX प्रवाह पर अधिक नियंत्रण है। –

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