CODEWITHSUNDEEP
jqueryjeditable
cristi _b
cristi _b

Reputation: 1813

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?

Upvotes: 0

Views: 840

Answers (2)

cristi _b
cristi _b

Reputation: 1813

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

Upvotes: 0

Niet the Dark Absol
Niet the Dark Absol

Reputation: 324810

I think the problem is caused by jQuery setting the display property to table-cell. IE 7 and 8 don't support that, so they'll act strange and throw errors.

My suggested fix is to put a <div> inside each cell and apply the editable stuff to that instead of to the cells.

Upvotes: 1

Related Questions