Cant get js to work in cakephp3

1

Hi,

I cant get javascript code to work in cakephp3. Originally I want to hide/show a div section from clicking an option. The project works fine apart from this js function. I have the js function in a file (webroot/js/myjs.js) and I call the file in the layout as below. I click an option button to invoke this function to test it and I get no output. I cant see what else I need to do as I am stuck.

Here is the example
crm5.aptutoring.com.au/lessons/cancelledlessontest

<?php 

     $options=array(0=>'Student',1=>'Tutor');
echo $this->Form->input('cancelledBy',
       [ 'label'=>false,  'style'=>"margin:10px;",  'type' => 'radio',   'options' => $options,
                    'onclick'=>'hide()', 'value'=>0]);

            ?>

  <div id="cancel" style="display: none;">Hello hidden content</div>


  //myjs.js
   <script type="text/javascript">
  function hide()
   {
     alert('asd');



   var e = document.getElementById("cancel");

    if(e.style.display == 'block')
      e.style.display = 'none';
   else
      e.style.display = 'block';



}
  </script>[crm5.aptutoring.com.au/lessons/cancelledlessontest ](http://crm5.aptutoring.com.au/lessons/cancelledlessontest )
2

Why you added <script type="text/javascript"> in myjs.js? Just have a look in console.

3

crm5.aptutoring.com.au/lessons/cancelledlessontest

it makes no difference that I have the tags. I removed them and look, no difference.

4

Add a class to cancelledBy input field and then add this code in your myjs.js

$('.cancelledByClass').change(function(){
  alert('Here');
  //your code.
});
5

nothing again. Something isnt set up correctly

6

Please show the code that you tried?

7

same as what you had

$(’.cancelledByClass’).change(function(){
alert(‘Here’);
//your code.
});

8 
        echo $this->Form->input('cancelledBy',
              [ 'class'=>'cancelledByClass','label'=>false,  'style'=>"margin:10px;",  'type' => 'radio',   'options' => $options,
                         'value'=>0]);
9

Basically you syntax not adding the class so try the following code. Tested it’s working

$('input[name="cancelledBy"]').change(function(){
  alert('Here');
  //your code.
});
10

ok that worked so well done (that wasnt easy!)

$(‘input[name=“cancelledBy”]’).change(function(){
alert(‘Here’);
var e = document.getElementById(“cancel”);

  if(e.style.display == 'block')
      e.style.display = 'none';
   else
      e.style.display = 'block';

});