2015-02-23 22 views
5

Çok basit olması gereken bir şeyin cevabı için SO soruları ile tedirgin ediyordum ama hayatım boyunca bunu anlayamıyorum.Meteor-AutoForm: Başka bir kontrole dayanarak seçim seçenekleri nasıl güncellenir

<template name="processFormTemplate"> 
    {{#autoForm id="processForm" collection="Processes" type=formAction doc=doc validation="blur"}} 
     <div class="col-md-12"> 
      {{> afQuickField name="elementId" options=elements}} 
      {{> afQuickField name="categoryId" options=categories}} 
      {{> afQuickField name="title"}} 
      {{> afQuickField name="desc" rows=4}} 
     </div> 
     {{>formButtons}} 
    {{/autoForm}} 
</template> 

Bunlar daha sonra seçenekleri doldurmak için yardımcıları vardır: Temel olarak

İki seçme kontrolleri ile meteor Otomatik Form sahip

Template.processFormTemplate.helpers({ 
    elements: function() { 
    return getFormElements(); 
    }, 
    categories: function(elementId) { 
    return getFormCategories(this.doc.elementId); 
    } 
}); 

lib/methods.js

getFormElements = function() { 

     var options = []; 

    Elements.find({}, {sort: {ref:1}}).forEach(function (element) { 
        options.push({ 
         label: element.title, value: element._id 
        }); 
       }); 

    return options; 

}; 

getFormCategories = function(elementId) { 

    var options = []; 
    var filter = {}; 

    if (!isBlank(elementId)) { 
     filter.elementId = elementId; 
    } 

    Categories.find(filter, {sort: {ref:1}}).forEach(function (d) { 
        options.push({ 
         label: d.title, value: d._id 
        }); 
       }); 

    return options; 

}; 

Şimdi bunun işe yaramadığını biliyorum çünkü yardımcı reaktif değil, ancak bu davranışı nasıl değiştireceğimi bilmiyorum r. Ben de 'değişim' olayı içine çengel denedim ama bu asla nedense basar:

Template.processFormTemplate.events({ 
'change #elementId': function(e) { 
    console.log($('[name="elementId"]').val() + ' is now selected'); 
} 
}); 

gerekli davranış olduğunu yeni elementID ilk listede, ikinci seçenekleri listesinde seçildiğinde Seçilen elemanın temel alınarak yenilenmelidir.

Herhangi bir yardım çok takdir edilmektedir.

sayesinde David

cevap

12

Aynı problemi çözmeden önce saatlerce sürdü.

Schemas.Store = new SimpleSchema({ 
center: { 
    type: String, 
    optional: true, 
    autoform: { 
     type: "select", 
     options: function() { 
      return Centers.find().map(function (c) { 
       return {label: c.name, value: c._id}; 
      }); 
     } 
    } 
}, 
region: { 
    type: String, 
    optional: true, 
    autoform: { 
     type: "select", 
     options: function() { 
      if (Meteor.isClient) { 
       var docId = ''; 

       docId = AutoForm.getFieldValue('storesForm', 'center'); 


       return Regions.find({center: docId}).map(function (c) { 
        return {label: c.name + ' (' + c.code + ')', value: c._id}; 
       }); 
      } 
     } 
    } 
}, 
store_name: { 
    type: String 
} 
}); 

BTW, hala [email protected] kullanıyorum nedeniyle Otomatik Form kullanırken karşılaşılan sorunlar: Bu kullanarak AutoForm'un api çağrısı Autoform.getFieldValue gibi seçilen seçeneğin değeri almak için basit bir şema kullanmak zorunda. GetFieldValue 5.0.3 yılında 5.0

Sayısında ben aldeed rapor ettik: https://github.com/aldeed/meteor-autoform/issues/785#issuecomment-84600515

+1

Bu çözüm benim için çok çalıştı. Teşekkürler! – Aaron

+2

merhaba - cevap için teşekkürler ... çözümünüzü aynı davranışı gerektiren birden çok biçimde nasıl kullanırdınız? – dsc

+0

@Woppi Bölge autoform seçenekleri işlevinizde neden (Meteor.isClient()) olup olmadığınızı merak ederek ...? – Wes

5

Ben bu çalışma almak başardınız - şeylerin çift yanlış:

  1. Ben ilk seçme kontrol yüzden olabilir bir 'kimlik' eklemek için gerekli 's değişim olayını yakalamak: sonra bir Reaktif Dict değişkeni kullanılan

    {{> afQuickField name="elementId" id="elementId" options=elements}} 
    

hangi sonra ler ve değiştirilen olayda. Bir oturum değişkeni muhtemelen aynı işi yapardı.

Template.processFormTemplate.events({ 
'change #elementId': function() { 
    dict.set('activeElementId', $('select#elementId').val()); 
} 
}); 

ve benim kategoriler yardımcı bir parametre olarak kullanmak:

categories: function(elementId) { 
    return getFormCategories(dict.get('activeElementId')); 
    } 

Umarım bu başkasının benzer bir sorun olan yardımcı olur.

İlgili konular