0

I am creating html table using json data and my transform is giving for each record a separate table.

 var data=[{"name":"aa","mid":"12345","user":"a123","password":"a@123"},{"name":"bb","mid":"2345","user":"b123","password":"b@123"}]
var transform=[
    {"<>":"style","html":"table,th,td {border: 1px solid black;border-collapse: collapse;}th {text-align: left;}"},
    {"<>":"p","html":"Dear client"},
    {"<>":"p","html":"Please find below merchant users passwords are expired. Kindly take necessaray action immediately."},
    {"<>":"table","style":"width:100%","html":[
        {"<>":"tbody","html":[
            {"<>":"tr","html":[
                {"<>":"th","id":"name","html":"Client Name"},
                {"<>":"th","id":"mid","html":"MID Number"},
                {"<>":"th","id":"username","html":"Username"},
                {"<>":"th","id":"password","html":"Current Password"}
            ]},
        {"<>":"tbody","id":"json-body","html":[
            {"<>":"tr","html":[
                {"<>":"td","html":"${name}"},
                {"<>":"td","html":"${mid}"},
                {"<>":"td","html":"${user}"},
                {"<>":"td","html":"${password}"}
            ]},
        ]},
        ]},
    ]},
    {"<>":"p","html":"Thanks & Regards"},
    {"<>":"p","html":"[email protected]"}
]

How can I do this by getting all my data into a single html table?

1 Answer 1

3

You can change the data to a Object which has key users and then define a new transform and a new inline function to transform the data.users.

ps:I think the first tbody should be thead.

The code is below:

var data = {
    users: [{
        "name": "aa",
        "mid": "12345",
        "user": "a123",
        "password": "a@123"
    }, {
        "name": "bb",
        "mid": "2345",
        "user": "b123",
        "password": "b@123"
    }]
}
var transform2 = [{
    "<>": "tr",
    "html": [{
        "<>": "td",
        "html": "${name}"
    }, {
        "<>": "td",
        "html": "${mid}"
    }, {
        "<>": "td",
        "html": "${user}"
    }, {
        "<>": "td",
        "html": "${password}"
    }]
}];
var transform = [{
    "<>": "style",
    "html": "table,th,td {border: 1px solid black;border-collapse: collapse;}th {text-align: left;}"
}, {
    "<>": "p",
    "html": "Dear client"
}, {
    "<>": "p",
    "html": "Please find below merchant users passwords are expired. Kindly take necessaray action immediately."
}, {
    "<>": "table",
    "style": "width:100%",
    "html": [{
        "<>": "thead",
        "html": [{
            "<>": "tr",
            "html": [{
                "<>": "th",
                "id": "name",
                "html": "Client Name"
            }, {
                "<>": "th",
                "id": "mid",
                "html": "MID Number"
            }, {
                "<>": "th",
                "id": "username",
                "html": "Username"
            }, {
                "<>": "th",
                "id": "password",
                "html": "Current Password"
            }]
        }, {
            "<>": "tbody",
            "id": "json-body",
            "html": function(obj) {
                return (json2html.transform(obj.user, transform2));
            }
        }, ]
    }, ]
}, {
    "<>": "p",
    "html": "Thanks & Regards"
}, {
    "<>": "p",
    "html": "[email protected]"
}];
var html = json2html.transform(data, transform);

see this enter image description here

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

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.