This is a migrated thread and some comments may be shown as answers.

How to pass string value to javascript function on grid using ClientTemplate? (MVC)

7 Answers 2518 Views
Grid
This is a migrated thread and some comments may be shown as answers.
koa
Top achievements
Rank 1
koa asked on 07 Dec 2012, 02:54 AM
I am attempting to use the code below to call a javascript function for each grid element, but i am having trouble rendering the required quotes to deal with the function parameters:

This code:
columns.Bound(p => p.OrderName).ClientTemplate(
    "<a onclick='showOrderDetail('#= OrderName #')' href='\\#'>#= OrderName #</a>"
).Title("Order Name").Width(150);
                                                


renders incorrectly as shown below with a mix of a double quote and single quote on the parameter

<a onclick="showOrderDetail(" OrderXYZ')'="" href="#">OrderXYZ</a>


Any ideas on how to get the proper single quotes around this variable?

7 Answers, 1 is accepted

Sort by
0
Accepted
Atanas Korchev
Telerik team
answered on 07 Dec 2012, 07:50 AM
Hi,

 Try using escaped double quotes instead:

"<a onclick=\"showOrderDetail('#= OrderName #')\" href='\\#'>#= OrderName #</a>"

Greetings,
Atanas Korchev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
VP
Top achievements
Rank 1
answered on 18 Nov 2014, 09:43 PM
Hi

This works perfectly fine when the string does not have any special characters.
Say for instance, the OrderName = D'Sample OrderName, it fails. How do we escape the special characters in this case so that it passes the actual values to the jQuery Function.

Thanks.
0
Atanas Korchev
Telerik team
answered on 20 Nov 2014, 10:37 AM
Hello,

In that case you will need a helper function to escape single and double quotes. Here is a demo: http://dojo.telerik.com/@korchev/oDIH

Regards,
Atanas Korchev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
VP
Top achievements
Rank 1
answered on 20 Nov 2014, 02:36 PM
Thanks Atanas. That works.

0
VP
Top achievements
Rank 1
answered on 20 Nov 2014, 02:37 PM
Thanks Atanas. That works.

0
Divya
Top achievements
Rank 1
answered on 18 Aug 2017, 02:01 AM

Hello, I have a similar situation and I'm using the code below:

columns.Bound(p => p.websiteUrl).Title("Website URL").ClientTemplate("<a onclick=\"Products_Read('#= websiteUrl #')\" href='\\#'>#= websiteUrl #</a>").;

But the link doesn't work. Can someone please tell me how to get a working url when clicked on it?  

It displays a hyperlink work which doesn't.

Thanks in advance! 

0
Viktor Tachev
Telerik team
answered on 21 Aug 2017, 01:36 PM
Hi Veda,

Please check out the article below that illustrates how you can add action link to the Grid ClientTemplate. 



Regards,
Viktor Tachev
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
Grid
Asked by
koa
Top achievements
Rank 1
Answers by
Atanas Korchev
Telerik team
VP
Top achievements
Rank 1
Divya
Top achievements
Rank 1
Viktor Tachev
Telerik team
Share this question
or