Search code examples
jqueryjeditable

Jeditable not working on IE tables, but works in FF, Chrome


<html>

    <head>

        <script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
        <script type="text/javascript" src="js/jquery.jeditable.min.js"></script>
        <script type="text/javascript" src="js/jquery.jeditable.checkbox.js"></script>

        <script>

            $(function () {
                $(".editable").click(function (event) {
                    $(this).editable('ajax_save.php',{
                        submit      : 'Save',
                        cancel      : 'Cancel',
                        tooltip     : ''
                    });
                });
            });

        </script>

    </head>

    <body>

        <table>

            <tr>

                <td class='editable' id='id-1234'>value of 1234</td>
                <td class='editable' id='id-1235'>value of 1235</td>                

            </tr>

            <tr>

                <td class='editable' id='id-1236'>value of 1236</td>
                <td class='editable' id='id-1237'>value of 1237</td>                

            </tr>

        </table>

    </body>

</html>

The code below works fine in FF/Chrome but fails in IE, when I click on the td element, it vanishes... on dev console it shows an error on a certain line but that error doesn't show in FF/Chrome.

Any ideas?


Solution

  • It seems like not all options work on IE 7/8 ...

    This code works

    $(document).ready(function() {
        $(".editable").editable("ajax.php",{
            type: "text"
        });
    });
    

    This doesnt on IE8 at least...

    $(document).ready(function() {
        $(".editable").editable("ajax.php",{
            type: "text", submit:"OK",cancel:"Cancel"
        });
    });
    

    Maybe it's a bug with jeditable handling elements