How to add a pop-up dialog in ember.js

  ember.js, javascript

I have to print the user data stored in Database with edit option. So I need to get the data from user. I thought that using pop-up window will make it easy But i don’t know how.

app/components/print-user.hbs

<input5  {{on "keyup" (fn this.searchuser search )}}> 
    {{input type="text" value=search placeholder="Enter Text to Search" }}
</input5>
    <table class="styled-table">
        <thead>
            <tr><th>User Id</th>
                <th>Firstname</th>
                <th>Lastname</th>
                <th>Mailid</th>
                <th>Delete</th>
            </tr>
        </thead>
        {{#each this.dummyresponse.Users_data as |user|}}
            <tbody>
                <tr>
                    <td>{{user.id}}</td>
                    <td>{{user.firstname}}</td>
                    <td>{{user.lastname}}</td>
                    <td>{{user.mailid}}</td>
                    <button>Edit</button>
                </tr>
            </tbody>
        {{/each}}
    </table>

app/components/print-user.js

import Component from '@glimmer/component';
import {action} from "@ember/object";
import {tracked} from "@glimmer/tracking";
import EditUserComponent from './edit-user';
export default class PrintUserComponent extends Component {
    constructor() {
        super(...arguments);
        this.searchuser("");
      }
    @tracked dummyresponse="";
    @action 
    async searchuser (searchtext){
        let response=await fetch("/UserManagement/SearchServlet",
        {   method: "POST",
            body: JSON.stringify({
                "type": "search",
                "searchtext": searchtext
            })
        });
        this.dummyresponse=await response.json();
    }
}

Help me to implement edit option in this.

This is how the print user looks like

Source: Ask Javascript Questions

LEAVE A COMMENT