对于骨干嵌套属性模板(Templates for nested attributes with Ba

2019-10-16 23:45发布

我有一个Appointment模式,每个实例,其中有一个Client 。 这里是我的编辑预约模板:

<form id="edit-appointment" name="appointment" class="mobile_friendly">
  <div class="field">
    <input type="text" name="start_time_ymd" id="start_time_ymd" value="<%= start_time_ymd %>" placeholder="Start Date">
    <input type="text" name="start_time_time" id="start_time_time" value="<%= start_time_time %>" placeholder="Start Time">
  </div>

  <div class="field">
    <input type="text" name="client_name" id="client_name" value="<%= client.name %>" placeholder="Client">
    <input type="hidden" name="client_id" id="client_id" value="<%= client.id %>" placeholder="Client ID">
  </div>

  <div class="field">
    <input type="text" name="client_phone" id="client_phone" value="<%= client.phone %>" placeholder="Phone">
  </div>

  <div class="field">
    <input type="text" name="notes" id="notes" value="<%= notes %>" placeholder="Notes">
  </div>

  <div class="actions">
    <input type="submit" value="Update Appointment" />
  </div>

</form>

<a href="#/index/<%= stylist_id %>">Back</a>

我的问题是,我的Client属性没有被传递到服务器正确。 获取传递到保存服务器的JSON对象看起来像下面这样。 让我们假设我有电话号码的客户555-555-5555 ,但我将其更改为555-555-1234 ,然后提交表格:

{"appointment":
  {"start_time_ymd":"1/1/2000",
   "client_phone":"555-555-1234",
   "client":{"phone":"555-555-5555"}}

我省略了很多不相关的领域,但我希望你明白我的意思。 我已经改变了client_phone555-555-5555555-555-1234 ,但client的JSON对象对象有其电话号码不变。 我需要以某种方式更改电话号码。

如何使这些领域-如电话号码字段-实际上是“取”,让他们得到传递给服务器的部分client下的对象appointment ,而不是直接下appointment ? 我使用的骨干关系,如果有差别。

Answer 1:

如果你改变你的模型不被更新,那么这个表单文本之后,你需要明确更新数据

SampleView = Backbone.View.extend({
el: '#formEl',
events : {
    "change input" :"changed",
    "change select" :"changed"
},

initialize: function () {
    _.bindAll(this, "changed");
},
changed:function(evt) {
   var changed = evt.currentTarget;
   var value = $("#"+changed.id).val();
   var obj = "{\""+changed.id +"\":\""+value+"\"";

   // Add Logic to change the client phone
   if (changed.id === 'client_phone') {
          obj = obj + "client\":{\"phone\":\""+value+"\""};
   }
   obj = obj + "}";
   var objInst = JSON.parse(obj);
   this.model.set(objInst);            
}
});

参考文献: 我可以绑定表单输入到Backbone.js的机型,而无需手动跟踪模糊事件?

您也可以绑定到变化的事件模型

    model.on('change:client_phone', 
       function () { 
           //Set client value here  
       });


Answer 2:

我能得到像这样的工作:

class Snip.Views.Appointments.EditView extends Backbone.View
  template : JST["backbone/templates/appointments/edit"]

  events :
    "submit #edit-appointment" : "update"

  update : (e) ->
    e.preventDefault()
    e.stopPropagation()

    # THE ONLY CHANGE I MADE WAS TO ADD THIS LINE
    @model.attributes.client.phone = $("#client_phone").val()

    @model.save(null,
      success : (appointment) =>
        @model = appointment
        window.location.hash = "/#index/" + @model.attributes.stylist_id
    )   


文章来源: Templates for nested attributes with Backbone