2013-04-26 12 views
7

नॉकआउट में न्यूबी, एक फ्रंट एंड डिज़ाइनर का उपयोग करके किसी फ़ॉर्म से डेटा प्राप्त करना या भेजना, इसलिए मुझे सादे बात की ज़रूरत है।knockout.js

मेरे पास एक ऐसा फॉर्म है जिसे मुझे डेटाबेस में भेजने और बाद में डेटाबेस से पुनर्प्राप्त करने की आवश्यकता है।

कृपया एक सरल उदाहरण में बताएं कि एक फॉर्म को सहेजने और पोस्ट करने के लिए एक उदाहरण उदाहरण कैसे तैयार किया जाए?

नॉकआउट ट्यूटोरियल से: http://knockoutjs.com/documentation/json-data.html मैं जेसन डेटा प्राप्त करने और भेजने के बारे में समझता हूं। जेसन डेटा को फ़ॉर्म से कैसे मेल किया जा रहा है? मैपिंग क्या है और क्या मेरे प्लगइन पर जेसन डेटा को मैप करने का तरीका प्लगइन या आसान उदाहरण है? असल में, मैं नीचे दिए गए नॉकआउट कोड उदाहरणों के अंदर क्या टिप्पणी करता हूं?

लायें डाटा:

$.getJSON("/some/url", function(data) { 
    // Now use this data to update your view models, 
    // and Knockout will update your UI automatically 
}) 

संदेश डाटा:

var data = /* Your data in JSON format - see below */; 
$.post("/some/url", data, function(returnedData) { 
    // This callback is executed if the post was successful  
}) 
+0

इसे पढ़ने पर विचार करें - http://knockoutjs.com/documentation/submit-binding.html - और यह - http://knockoutjs.com/documentation/value-binding.html - सबसे अच्छा तरीका है। –

उत्तर

13

साधारण से फ़ॉर्म

<form data-bind="submit: onSubmit"> 
    <input data-bind="value : firstName"/> 
    <input data-bind="value : lastName"/> 
    <input type="submit" text="Submit!"/> 
</form> 
Response: <span data-bind="text : response"></span> 

साधारण दृश्य मॉडल

var viewModel = new function() 
{ 
    var self = this; 
    self.firstName = ko.observable("default first"); 
    self.lastName = ko.observable("default last"); 
    self.responseJSON = ko.observable(null); 
    self.onSubmit = function() 
    { 
     var data = JSON.stringify(
      { 
       first : self.firstName(), last : self.lastName()   
      }); // prepare request data 
     $.post("/echo/json", data, function(response) // sends 'post' request 
     { 
      // on success callback 
      self.responseJSON(response); 
     }) 
    } 
} 

ko.applyBindings(viewModel); 

JSFiddle DEMO

+0

@llya कूल budy – Developerzzz