If a value is set in controller , perform an Ajax command(written in template),

Ember CLI
1

I have given a rough code to understand what I need to perform,

/ app / route1 / controller.js

export default Controller.extend({
    test: function(id) {
        $.ajax({
            .....
            .....
            .....
        }).then(() => {
           set('message','successfully added');
        });
    }
});

/app/route1/template.hbs

<div class="ui container">
  <div class="ui segment"
    <button class="ui button" {{action "test" model.id}}>Submit</button>
  </div>
</div>
<div class="ui container">
  <div class="ui modal">
    <div class="header"
      Message
    </div>
    <div class="content"
      {{message}}
    </div>
    <div class="actions">
      <div class="ui ok button">OK</button>
    </div>
  </div>
</div>
<script type="text/javascript">
  $.ajax({
    if(message) {
      $('.ui.modal').modal('show');   
    }
  })
</script>

If I set a message in controller then, I have to show this message in the MODAL. The Ajax command that I’ve written is not correct., Please help to solve this issue. Thanks in advance

2

I’m not quite sure what you’re trying to accomplish, but I recommend keeping data-fetching in the route’s model hook.

3

No data is fetching from here. Actually I didn’t get what you actually mean. I guess you are telling about the Ajax command I have given in the controller, and that’s just a post request to perform some task in backend. In the question I was mentioned about the Ajax command that given in the template.hbs ,

4

A little confused here but if you placing script tags in your templates why are you using Ember? Having script tags like that in an Ember template is a level Voodoo that I can’t even imagine working right.

If you remove the script tag and instead handle the needed logic in your routes/controllers/components I don’t think you would run into issue like this.

5

Looking at the HTML it looks like you’re attempting to use semantic-ui. If so why do this manually? Their Ember plugin has fantastic (Ember native) support for modals and does not require any jQuery code of your own.

1 Like