JavaScript onClick function constructed in PHP does not work in the ajax response back

Question

I am sending an ajax request to load some information constructed in a div from PHP. There is an onClick function there. Ajax responds well, but the JavaScript function does not work in the HTML client.

This is the response from ajax written in PHP:

    $iscId = $row['instructorSemesterCourseId'];
    $year = $row['year'];
    $startDate = $row['startDate'];
    $endDate = $row['endDate'];
    $courseCredit = $row['courseCredit'];
    $pinned = $row['pinned'];
    $semesterName = $row['semesterName'];

    $date1 = date('F j, Y', strtotime($startDate)); 
    $date2 = date('F j, Y', strtotime($endDate));

    $div .= "<div id='SCid".$iscId."' class='schoolClass'>
                  <div class='schoolClassLeft'>
                    <div class='schoolCourseTitle'  onClick='classSessionEnter('SCid".$iscId."'); style='width:100%'>".$semesterName." ".$year." | ".$date1." &ndash; ".$date2."</div>
                  </div>
                </div>";
    echo('$div');

The function written in JavaScript and jQuery is:

function classSessionEnter(elm) {
    alert('elm');
    $('#' + elm).css({"background": "#E7F9CE"});
    $('#' + elm).css({"position": "absolute"});
    $('#' + elm).css({"top": "0px"});
    $('#' + elm).css({"color": "#006600"});
}

The alert does not work - it does not get into the function at all. Why?

You should scape some single quotes for this to work. Try: onClick='classSessionEnter(\'SCid".$iscId."\');' — ederpsampaio
– ederpsampaio, Commented Jul 5, 2014 at 5:16
Yes it is in the global space. It seems the error is coming from the function's variable. When I remove the variable from the function, it will enter into the function. — Ahad
– Ahad, Commented Jul 5, 2014 at 5:18

DWX · Accepted Answer · 2014-07-05 05:31:20Z

2

Replace this

$div .= "<div id='SCid".$iscId."' class='schoolClass'>
              <div class='schoolClassLeft'>
                <div class='schoolCourseTitle'  onClick='classSessionEnter('SCid".$iscId."'); style='width:100%'>".$semesterName." ".$year." | ".$date1." &ndash; ".$date2."</div>
              </div>
            </div>";
echo('$div');

with this

$div .= "<div id='SCid".$iscId."' class='schoolClass'>
                  <div class='schoolClassLeft'>
                    <div class='schoolCourseTitle'  onClick='classSessionEnter(SCid".$iscId.");' style='width:100%'>".$semesterName." ".$year." | ".$date1." &ndash; ".$date2."</div>
                  </div>
                </div>";
    echo($div);

answered Jul 5, 2014 at 5:31

DWX

2,3401 gold badge16 silver badges15 bronze badges

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

Comments

Parfait · Accepted Answer · 2014-07-05 05:22:50Z

1

$div .= "<div id='SCid".$iscId."' class='schoolClass'>
    <div class='schoolClassLeft'>
        <div class='schoolCourseTitle' onClick=\"classSessionEnter('SCid".$iscId."')\"; style='width:100%'>".$semesterName." ".$year." | ".$date1." &ndash; ".$date2."</div>
     </div>
</div>";

You should esacpe the quotes first 「onClick=\"」

answered Jul 5, 2014 at 5:22

Parfait

1,7501 gold badge11 silver badges12 bronze badges

1 Comment

Ahad Over a year ago

Thanks a lot. Works great right now. Couple of hours struggling with this.

Collectives™ on Stack Overflow

JavaScript onClick function constructed in PHP does not work in the ajax response back

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related