2016-11-10 1 views
-1

Ich bin neu in KnockoutJS. Ich habe ein Formular mit mehreren Steuerelementen - Kontrollkästchen, Optionsfelder, Textfelder, usw. Klicken Sie auf Speichern, anstatt Werte von einzelnen Steuerelementen zu lesen oder Modell anzuzeigen und Ajax-Aufruf zum Speichern von Daten zu machen, muss ich die eingegebenen Daten in einem Objekt speichern wandeln Sie das Objekt in JSON,Speichern Sie Daten in Objekt mit KnockoutJS

var x = ko.toJSON(ObjectwithData()); 

um, und rufen Sie dann mithilfe von ajax die Speicherroutine auf. Bitte führen Sie an, wie ich dies erreichen kann. Ich habe einen Beispielcode, der das macht, es wäre großartig.

+0

Der Beitrag liest derzeit eher wie ein generisches zu tun, als eine Frage. Könnten Sie ein [mcve] hinzufügen und uns sagen, wo das * spezifische * Problem oder die spezifische Frage liegt? – Jeroen

Antwort

0

Ihre Frage ist nicht klar, aber hier ist das, was ich verstanden habe.

Sie müssen alle Ihre Daten aus Ihrem Formular an ein Json-Objekt binden.

für zB:

in Html:

<div id="root"> 
    <p>Name</p> 
    <p> 
    <input type="text" data-bind="value:Name" /> 
    </p> 
    <p>Email</p> 
    <p> 
    <input type="text" data-bind="value:Email" /> 
    </p> 
    <p>Phone</p> 
    <p> 
    <input type="text" data-bind="value:Phone" /> 
    </p> 
    <p> 
    <button id="submit" data-bind="click:submit">Submit</button> 
    </p> 
</div> 

bei Script

$(document).ready(function() { 

    var viewModel = function viewModel() { 
    var self = this; 
    self.Name = ko.observable(""); 
    self.Email = ko.observable(""); 
    self.Phone = ko.observable(""); 

    self.submit = function(){ 
    var postData = self.koToJson(); 

    } 

    self.koToJson = function(){ 
    return { 
    Name : self.Name(), 
    Email: self.Email(), 
    Phone: self.Phone() 
    }; 
    } 

    } 
    ko.applyBindings(viewModel); 



}); 

Hier die self.koToJson Funktion verwendet wird KO Daten zu Json zu konvertieren.

für weitere Informationen besuchen Sie bitte diese jsFiddile https://jsfiddle.net/ninshidme/nk45Lvnv/4/

Wenn dies Sie es als Antwort zu markieren nicht hilft vergessen.

Glückliche Kodierung.

Verwandte Themen