Quantcast
Channel: Ember.JS - Latest topics
Viewing all articles
Browse latest Browse all 4828

How to add and save additional row values from a template

$
0
0

@belgoros wrote:

I display 7 rows corresponding to 7 week days: Monday through Sunday with working hours for every day (see the attached screenshot). Some day can have split hours (with time break) when selecting Divided state in the select drop-down. In this case I display additional 2 input fields to enter the times. Here is the template code:

#templates/components/weekday-row.hbs

<div class="form-group row">
  <label for="state" class="col-sm-2 col-form-label">{{translatedWeekDay}}</label>
  <div class="col-sm-2">
    <select class="form-control" onchange={{action "selectState" value="target.value"}}>
      {{#each states as |state|}}
        <option value={{state.id}} selected={{eq state.id weekday.state}}>{{state.name}}</option>
      {{/each}}
    </select>
  </div>
  <div class="col-sm-2">
    {{input type="time"
      class="form-control"
      required=true
      min="06:00"
      max="22:00"
      disabled=isClosed
      pattern="[0-9]{2}:[0-9]{2}"
      value=weekday.opens
    }}
  </div>
  <label for="closes" class="col-form-label">{{t 'working.hours.labels.to'}}</label>
  <div class="col-sm-2">
    {{input type="time"
      class="form-control"
      required=true
      min="06:00"
      max="22:00"
      disabled=isClosed
      pattern="[0-9]{2}:[0-9]{2}"
      value=weekday.closes
    }}
  </div>
</div>
{{#if isDivided}}
  <div class="form-group row">
    <div class="col-sm-2 offset-sm-2">{{t 'working.hours.labels.and'}}</div>
    <div class="col-sm-2">
      {{input type="time"
        class="form-control"
        required=true
        min="06:00"
        max="22:00"
        disabled=isClosed
        pattern="[0-9]{2}:[0-9]{2}"
        value=weekday.opens
      }}
    </div>
    <label for="closes"class="col-form-label">{{t 'working.hours.labels.to'}}</label>
    <div class="col-sm-2">
      {{input type="time"
        class="form-control"
        required=true
        min="06:00"
        max="22:00"
        disabled=isClosed
        pattern="[0-9]{2}:[0-9]{2}"
        value=weekday.closes
      }}
    </div>
  </div>
{{/if}}

Every weekday corresponds to working-hour model item I get in the routersmodel` hook. The problem I can’t figure out how to solve is that when I enter a value in one of the time inputs for Divided status is auto-copied in the same field and I can’t just enter 9 -12 and 14 - 20 hours.

How to do that: separate the binding values ? Should I create a separate model (to trace divided status values) or another solution?

Posts: 1

Participants: 1

Read full topic


Viewing all articles
Browse latest Browse all 4828

Trending Articles