Angular x-editable show some form control onchange

Question

I have an angular x-editable sample here where i am trying to show / hide a form control based on the status value like,

  <div ng-show="user.status == '1'">
      <span class="title">Show: </span>
      <span editable-text="user.showfield" e-name="showfield">{{ user.showfield || 'empty' }}</span>
    </div>

It will be shown only when i save the form. How can I make it show when changing the control field itself?

Yin Gang · Accepted Answer · 2016-05-22 05:25:12Z

1

Fixed demo here.

You can get there by directive e-ng-change.

Sample codes:

    <div>
      <!-- editable status (select-local) -->
      <span class="title">Status: </span>

      <!-- by e-ng-change, get result before save, and asign to user.showstatus -->
      <span editable-select="user.status" e-ng-change="user.showstatus=$data;" e-name="status" e-ng-options="s.value as s.text for s in statuses">
        {{ (statuses | filter:{value: user.status})[0].text || 'Not set' }}
      </span>
    </div>  

     <!-- toggle display by user.showstatus -->
     <div ng-show="user.showstatus == '1'">
      <span class="title">Show: </span>
      <span editable-text="user.showfield" e-name="showfield">{{ user.showfield || 'empty' }}</span>
    </div>

Credit: Angular x-editable github issue #105

edited May 22, 2016 at 5:25

answered May 22, 2016 at 5:19

Yin Gang

1,4431 gold badge10 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

mpsbhat Over a year ago

What about upon cancel? i mean hiding if cancel clicked?

mpsbhat Over a year ago

figured out. can be achieved by oncancel event

Collectives™ on Stack Overflow

Angular x-editable show some form control onchange

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related