0

Javascript onChange not working

Hi, sorry for so many questions.
I just want to use onChange in select, but I found it's not working. but works for onClick.
Is onChange method not allowed in caja?

by
3 Replies
  • Hi Montgomerie,

    I ran a test on the full view and didn't run into any problems with the onChange event. Here's the code sample I have:

    CODE
    <div id='tabContent'></div>
    <select onChange='myFunc();return false;'>
    <option value='test1'>test 1</option>
    <option value='test2'>test 2</option>
    </select>

    <script>
    function myFunc(){
    document.getElementById('tabContent').innerHTML = 'test';
    }
    </script>


    There may be a few reasons for what you're experiencing:
    - Are you assigning strings as the event handler? (e.g. node.onChange = '...';). This will be stripped by Caja
    - I'm assuming that this code is in the full view? I just thought I'd check ;)Is onChange method not allowed in caja?
    0
  • QUOTE (Jon @ Nov 13 2008, 12:33 PM) <{POST_SNAPBACK}>
    Hi Montgomerie,

    I ran a test on the full view and didn't run into any problems with the onChange event. Here's the code sample I have:

    CODE
    <div id='tabContent'></div>
    <select onChange='myFunc();return false;'>
    <option value='test1'>test 1</option>
    <option value='test2'>test 2</option>
    </select>

    <script>
    function myFunc(){
    document.getElementById('tabContent').innerHTML = 'test';
    }
    </script>


    There may be a few reasons for what you're experiencing:
    - Are you assigning strings as the event handler? (e.g. node.onChange = '...';). This will be stripped by Caja
    - I'm assuming that this code is in the full view? I just thought I'd check ;)The value set is not successful but at least the form is submitted.
    0
  • I think I have a solution for your code block...it took a little bit of work to figure out what Caja didn't like but here's the code:

    CODE
    <form name="formlist" id="formlist" action="yap_12.php" method="post">
    <input id="NextAc" type="hidden" name="NextAc" value="">
    <select name="xballarea" onChange="DataSend('formlist','Select1');return false;">
    <option value='test1'>test 1</option>
    <option value='test2'>test 2</option>
    </select>
    <input name="image" type="image" onClick="DataSend('formlist','Select1')" src="http://www.golfly.com.tw/chinese/_img/03_admin/icon_ok.jpg">
    </form>
    <script>
    function DataSend(obj,FormData){
    if(FormData != ""){
    document.getElementById('NextAc').value = FormData;
    }
    document.getElementById(obj).submit();
    return true;
    }
    </script>


    Caja's still pretty new so you may run into similar issues along the way, but there were a few takeaways:
    - Cajoled code is a tame code model, and referencing document.formName seems to have some issues.
    - I switched some of the data to an id capture structure (getElementById) as it seems to work best currently against Caja

    Hopefully everything should be good with that block.

    Jonathan LeBlanc
    Senior Software Engineer
    Yahoo! Developer Network
    0
  • Recent Posts

    in YAP