KnockoutJS:

Question

में प्रत्येक विकल्प पर लागू ईवेंट पर क्लिक करें, जब भी उपयोगकर्ता किसी SELECT तत्व में किसी विकल्प पर क्लिक करता है तो मैं किसी ईवेंट को कॉल करने के लिए नॉकआउट चाहता हूं।

यहाँ मेरी जावास्क्रिप्ट है:

function ReservationsViewModel() { 
    this.availableMeals = [ 
     { mealName: "Standard (sandwich)", price: 0 }, 
     { mealName: "Premium (lobster)", price: 34.95 }, 
     { mealName: "Ultimate (whole zebra)", price: 290 } 
    ]; 
} 

ko.applyBindings(new ReservationsViewModel()); 

यहाँ मेरी HTML है:

<select data-bind="foreach: availableMeals"> 
    <option data-bind="text: mealName, click: alert('hello')" /> 
</select> 

लेकिन जब मैं इस चलाने के लिए, आवेदन "हैलो" से पता चलता तीन बार भले ही कोई भी विकल्प वास्तव में क्लिक किया गया।

मैं क्या गलत कर रहा हूं?

Answer 1

आप change का उपयोग करना चाहिए click और optionsTextoption टैग के बजाय बंधन के बजाय बंधन और change में function का उपयोग करने के बजाय सिर्फ alert बुला के बंधन:

<select data-bind="options: availableMeals, optionsText: 'mealName', value: selectedMeal, event: {change: onChange}"> 
</select> 

function Meal(name, price){ 
    var self = this; 

    self.mealName = name; 
    self.price = price;  
} 

function ReservationsViewModel() { 
    var self = this; 
    self.availableMeals = ko.observableArray(
     [new Meal("Standard (sandwich)", 0), 
     new Meal("Premium (lobster)", 34.95), 
     new Meal("Ultimate (whole zebra)", 290)]); 


    self.selectedMeal = ko.observable(self.availableMeals()[0]); 

    self.onChange = function() { 
     alert("Hello"); 
    }; 
} 

ko.applyBindings(new ReservationsViewModel()); 

यहाँ काम कर रहा है उदाहरण: http://jsfiddle.net/Q8QLX/

Answer 2

" अलर्ट "को फ़ंक्शन में एम्बेड किया जाना चाहिए:

<select data-bind="foreach: availableMeals, event: {change: function() { alert('hello'); } }"> 
    <option data-bind="text: mealName " /> 
</select>