JQuery संवाद

Question

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

var viewModel = { 
    Fields: ko.observableArray([new Field(2, "First Name", 1), new Field(3, "Last Name", 2)]), 
    AvailableTranslations: ko.observableArray([new Translation(1, "Prefixes"), new Translation(2, "Suffixes")]), 
    remove: function(item) { 
     ko.utils.arrayRemoveItem(this.Fields, item) 
    }, 
    add: function() { 
     this.Fields.push(new Field(0, "", "")); 
    } 
}; 

var Translation = function(id, name) { 
    this.ID = id; 
    this.Name = name; 
}; 

var Field = function(id, name, translationID){ 
    this.ID = ko.observable(id); 
    this.Name = ko.observable(name); 
    this.TranslationID = ko.observable(translationID); 
}; 

टेम्पलेट में अनुवाद चयन सूची के बगल में, मैं एक नया अनुवाद जो मौजूद नहीं है जोड़ने के लिए विकल्प चाहते हैं। जब बटन क्लिक किया जाता है, तो मैं एक jquery UI संवाद बॉक्स खोलना चाहता हूं जिसमें आंशिक दृश्य होता है जो नॉकआउट का उपयोग करता है। आंशिक दृश्य में एक अनुवाद नाम के साथ-साथ पुराना मान और एक नया मान (दोनों टेक्स्ट फ़ील्ड्स) होगा। पुराने और नए मान एक अवलोकन योग्य सरणी हैं।

var viewModelPartialDialog = { 
    TranslationName: ko.observable(), 
    Values: ko.observableArray([]), 
}; 

var Value = function(id, oldVal, newVal) { 
    this.ID = id; 
    this.OldVal = oldVal; 
    this.NewVal = newVal; 
}; 

उपयोगकर्ता आंशिक दृश्य के फार्म सबमिट करता है, मैं इसे एक को बचाने के फोन के साथ-साथ AvailableTranslations अद्यतन नमूदार सरणी बनाने के लिए करना चाहते हैं।

क्या कोई मेरी मदद कर सकता है या इसे पूरा करने के लिए सही दिशा में मुझे इंगित कर सकता है?

---

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

मेरे मूल उदाहरण पर वापस जाकर, मैं मॉड्यूलए में नए फ़ील्ड जोड़ना चाहता हूं, जैसा कि आपके पास उत्पाद सूची है। हालांकि, संवाद में फ़ील्ड को संपादित करने के बजाय, मैं एक नया अनुवाद जोड़ने के लिए एक संवाद खोलना चाहता हूं। संवाद में खुलने वाला नया अनुवाद एक अलग दृश्य मॉडल (viewModelB) होगा। एक बार अनुवाद नाम और मूल्य जोड़े जाने के बाद, संवाद असीमित रूप से पोस्ट करेगा और उसके बाद मूल दृश्य मॉडल (viewModelA) उपलब्ध ट्रान्सलेशन अवलोकन योग्य सरणी अपडेट करेगा।

क्या आप इस कार्यक्षमता का एक उदाहरण प्रदान कर सकते हैं? http://jsfiddle.net/rniemeyer/WpnTU/

यह पृष्ठ लोड होने संवाद सेट है, लेकिन यह नहीं खोलता है:

Answer 1

यहां नमूने के समान हो सकता है तुम क्या कर रहे है। फिर, एक कस्टम बाध्यकारी हैंडलर होता है जिसे जब भी "चयनित इटिम" देखा जा सकता है (जिसे मौजूदा आइटम या एक नई वस्तु के साथ हो सकता है) कहा जाता है।

//custom binding handler that opens the jQuery dialog, if the selectedProduct is populated 
ko.bindingHandlers.openDialog = { 
    update: function(element, valueAccessor) { 
     var value = ko.utils.unwrapObservable(valueAccessor()); 
     if (value) { 
      $(element).dialog("open"); 
     } 
    } 
}