0

Problem

In my dandelion datatable I have added a column at the end of the table that contains two buttons: edit and disable/enable user.

Table as below

<c:url var="allUsersDatasource" value="/users-all" />
<datatables:table id="allUsersTable" url="${allUsersDatasource}" serverSide="true" row="user" >
    <datatables:column title="Username" property="username" />
    <datatables:column title="Email" property="email" renderFunction="users#userEmails"/>
    <datatables:column title="First Name" property="firstName"/>
    <datatables:column title="Last Name" property="lastName"/>
    <datatables:column title="Registred" property="registred" searchable="false" renderFunction="users#registredDate"/>
    <datatables:column title="Role" property="authority" searchable="false" renderFunction="users#userRole"/>
    <datatables:column title="Enabled" property="enabled" searchable="false" cssCellClass="enable-disable-icon" renderFunction="users#userEnabled"/>
    <datatables:column title="Action" property="enabled" sortable="false" searchable="false" renderFunction="users#userEnableDisable"/>
</datatables:table>

The javascript function render the button using the function below

function userEnableDisable(data, type, full) {
    if (data == "1") {
         return '<a type="button" class="btn btn-default btn-block">Edit</a>'+'<a type="button" class="btn btn-danger btn-block">Disable</a>';
    } else{
         return '<a type="button" class="btn btn-default btn-block">Edit</a>'+'<a type="button" class="btn btn-success btn-block">Disable</a>';
    }
}   

I need to pass a parameter to the function (username) so when I click the button a specific function will be triggered that will contact the controller and update the field accordingly. Notice users do not have URI

I am using spring mvc

What I have attempted so far

function userEnableDisable(data, type, full) {
    if (data == "1") {
         return '<a type="button" class="btn btn-default btn-block" onclick="return editUser('+full.username+');">Edit</a>'+'<a type="button" class="btn btn-danger btn-block" onclick="return disableUser('+full.username+');">Disable</a>';
    } else{
         return '<a type="button" class="btn btn-default btn-block" onclick="return editUser('+full.username+');">Edit</a>'+'<a type="button" class="btn btn-success btn-block" onclick="return enableUser('+full.username+');">Enable</a>';
    }
}   

function editUser(data) {
    alert(data);
}   

function disableUser(data) {
    alert(data);
}   
function enableUser(data) {
    alert(data);
}   

When I click the button I get

Uncaught ReferenceError: "myusername" is not defined

Thanks

QGA
  • 3,114
  • 7
  • 39
  • 62

1 Answers1

0

Easy solution, was a quote issue.

I changed this:

('+full.username+')

to:

(\''+full.username+'\')

The reason is explained here

Community
  • 1
  • 1
QGA
  • 3,114
  • 7
  • 39
  • 62