0

I'm working on a web app with java play! framework, in a specific view I'm using DataTable for displaying a list of customers, I need to make the name column as a link, on click it should display the customer sheet.

My problem is this snippet:

"fnRowCallback": function( nRow, aData, iDisplayIndex ) {
    $('td:eq(0)', nRow).html(
   '<a href="@routes.Dashboard.dettagliCliente("'+aData[3]+'")">'+aData[0] + '</a>'); 
      return nRow;
 }

When the app is running, and I click on a given customer, the view reach the controller but it doesn't pass the value of aData[3] to method, instead it pass literally the string "aData[3]"

This is the specific route:

GET  /dashboard/dettagli_cliente/:idCliente controllers.Dashboard.dettagliCliente(idCliente:String)

And this is the controller:

public static Result dettagliCliente(String id){
        Logger.info("CUSTOMER ID "+id);
        final Cliente cliente = Cliente.findById(id);
        Form<Cliente> formCliente = Form.form(Cliente.class).bindFromRequest();     
        Form<Cliente> filledForm = formCliente.fill(cliente);
        return ok(registra_utente_form.render(User.findByEmail(request().username()),filledForm,cliente));
    }

Update: This is the complete dataTable call on the view:

$(document).ready(function() {
$('#clienti_table').DataTable( {
     "processing": true,
     "serverSide": true,
  "ajax": "@routes.Dashboard.testList()",
  "fnRowCallback": function( nRow, aData, iDisplayIndex ) {      
      $('td:eq(0)', nRow).html('<a href="@routes.Dashboard.dettagliCliente("'+aData[3]+'")">'+aData[0] + '</a>');   
   return nRow;
  },
  });  
 });

If I wrote a sample customer id instead of aData[3], inside the href attribute, it works: on click on one of the customer list element it open the details for that given customer(id) this is an example:

$(document).ready(function() {
$('#clienti_table').DataTable( {
     "processing": true,
     "serverSide": true,
  "ajax": "@routes.Dashboard.testList()",
  "fnRowCallback": function( nRow, aData, iDisplayIndex ) {      
      $('td:eq(0)', nRow).html('<a href="@routes.Dashboard.dettagliCliente("c0ed22dc-6c92-4a70-ad30-ea73e8b0c314")">'+aData[0] + '</a>');   
   return nRow;
  },
    });  

 });

Thank you everyone

singhakash
  • 7,891
  • 6
  • 31
  • 65

2 Answers2

0

It can't work like this, as Play's routes are rendered long, long before it arrives to client...

To handle it properly you would need use JavaScript routes as described in other answer and/or in the docs, or just create proper URLs as a string

var url = '<a href="/dashboard/dettagli_cliente/'+aData[3]+'">'+aData[0]+'</a>';

Some more details:

@routes are always rendered during the view's rendering, that means on the server side so it's distant machine wchich formats the template and sens it to you, JavaScript is client side - your browser.

If during rendering of the view there's no param given, it will be rendered with null value. Server doesn't know nothing about your client's script: it doesn't read anything from your browser window.

It can be compared to the common - paper newspaper, when it's printed in print house it has only these data that they know at the moment, if you'll buy the newspaper and bring it to your home, you can of course take a pencil and change some text in it, but print house has no possibility to change it remotely...

Finally good news is that the above solutions I gave you at the beginning allows you to workaround the problem, just mentioned JavaScript routes technique prepares "JavaScript version" of your routes, so you can prepare valid links on the client side as well...

Community
  • 1
  • 1
biesior
  • 55,576
  • 10
  • 125
  • 182
  • Thank you for the answer! Could you explain me why if I replace 'aData[3]' in my code with an actual customer id it works (it opens the same customer detail for each customer, the one whom I specified the ID) but I'm not able to retrieve the id dinamically...essentially in my DataTable that aData[3] column contains the customer id. Thank you – Vincent Arthur van Schop Mar 10 '15 at 17:30
  • SHow me the second case – biesior Mar 10 '15 at 18:00
  • Hi, I have edited the question, the last example is regard of the second case. Thank you – Vincent Arthur van Schop Mar 10 '15 at 18:44
  • Check my edit, BTW you should inspect your HTML code in the browser, to realize why it's `null` – biesior Mar 10 '15 at 19:44
0

You need to use Javascript Routing in this case

As scala templates are compiled first before any document.ready js function is called and generate a url in place of @routes.Dashboard.dettagliCliente() in the final generated view so whatever you put in parameter while using @routes.Dashboard.dettagliCliente() will be taken as it is.Therefore in

Case 1: For passing javascript variable

@routes.Dashboard.dettagliCliente("'+aData[3]+'")

generate url

/dashboard/dettagli_cliente/'+aData[3]+'

Case 2: For passing variable directly

@routes.Dashboard.dettagliCliente("data")

generate url

/dashboard/dettagli_cliente/data

So in your case 2 the url generated is correct so it worked.

And ufcorse you can use direct link /dashboard/dettagli_cliente/data in place of @routes... so that the link is generated directly without any conversion.

Also check Similar

Community
  • 1
  • 1
singhakash
  • 7,891
  • 6
  • 31
  • 65