When passing two parameters on Client Template javascript function i get this error Uncaught SyntaxError: missing ) after argument list

2 posts, 0 answers
  1. Keletso
    Keletso avatar
    2 posts
    Member since:
    Jan 2017

    Posted 05 May 2017 Link to this post

    This is my code on my Client Template 

            column.Bound(c => c.DeclarationsSigned)
                .ClientTemplate(
                    "# if(DeclarationsSigned) { #" +
                         "# if(DeclarationsSignedByAssessor) { #" +
                            "<label style='color:red;'>Yes</label>" +
                            "# }else {#" +
                            "<label style='color:green;'>Yes</label>" +
                            "# } #"+
                    "# } else { #" +
                        "<label style='color:red;' >No</label>" +
                    //"< a href = 'javascript: void(0)' title = 'Signed Declaration' class = 'grid-action-inline' onclick =\" signOffDeclaration(<#=ProgramAssignmentId#>,<#=LearnerFullName#>)\"><span class='glyphicons glyphicons-pencil'></span></a>" +
                    "<a href='javascript: void(0)' class = 'grid-action-inline' title = 'Signed Declaration' onclick = 'signOffDeclaration(#= ProgramAssignmentId # , #= LearnerFullName #)'><span class = 'glyphicons glyphicons-pencil' ></span></a>" +
                    "# } #").Width(50);

    And this is my function 

        function signOffDeclaration(AssignentId,LearnerFullName) {
            if (!confirm("I declare that I have a hard-copy of the declaration document signed by {learner name} for {programme}. I will upload this into the POE folder.")) {
                return;
            }

            $.ajax({
                type: "POST",
                url : "/Home/AssessorHome/SignDeclarationOff",
                data: { assignmentId: AssignentId },
                datatype: "json",
                sucess: function (data) {
                    console.log(data);
                },
                error: function (xhr, ajaxOptions, thrownError) {
                    console.log(xhr.responseText);
                }
            })

            $("#LearnerListGrid").data("kendoGrid").dataSource.read();
        }
    i am getting this error when clicking a pencil Uncaught SyntaxError: missing ) after argument list

    how do i solve this error

  2. Dimiter Topalov
    Admin
    Dimiter Topalov avatar
    1266 posts

    Posted 08 May 2017 Link to this post

    Hi Keletso,

    The issue seems to be caused by the fact that the values, passed to the onclick handler have to be strings, but are not wrapped accordingly, and some of the values contains parenthesis.

    I tried to replicate the scenario, and you can check out the working version:

    .Columns(columns => {
            columns.Bound(p => p.OrderID).Filterable(false);
            columns.Bound(p => p.Freight);
            columns.Bound(p => p.OrderDate).Format("{0:MM/dd/yyyy}");
            columns.Bound(p => p.ShipName).Title("Some Custom Title");
            columns.Bound(p => p.ShipCity).ClientTemplate(
                    "# if(false) { #" +
                         "# if(true) { #" +
                            "<label style='color:red;'>Yes</label>" +
                            "# }else {#" +
                            "<label style='color:green;'>Yes</label>" +
                            "# } #" +
                    "# } else { #" +
                        "<label style='color:red;' >No</label>" +
                    //"< a href = 'javascript: void(0)' title = 'Signed Declaration' class = 'grid-action-inline' onclick =\" signOffDeclaration(<#=ProgramAssignmentId#>,<#=LearnerFullName#>)\"><span class='glyphicons glyphicons-pencil'></span></a>" +
                    "<a href='javascript: void(0)' class = 'grid-action-inline' title = 'Signed Declaration' onclick = 'signOffDeclaration(#= OrderID #, \"#= ShipCity #\")'><span class = 'glyphicons glyphicons-pencil' >CLICK</span></a>" +
                    "# } #").Width(250); ;
        })

    OrderID is passed fine as it is, because it is a number, while ShipCity must be wrapped in quotes:

    https://www.screencast.com/t/Bdz2CxKD4Pmx

    I hope this helps.

    Regards,
    Dimiter Topalov
    Telerik by Progress
    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.
Back to Top