Home/ Questions/Q 9082269
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-16T20:31:08+00:00

I’ve got a simple Ajax call using jquery: jQuery(.deletebutton).on(click, function() { if (confirm(Are you

  • 0

I’ve got a simple Ajax call using jquery:

jQuery(".deletebutton").on("click", function() {
    if (confirm("Are you sure you want to delete?"))
    {
        jQuery.ajax({
            url: 'index.php?option=com_recordings&task=deletevideos&format=raw',
            type: "POST",
            success: function(data){
                console.log("anything?"); //never get here with FF and Chrome
                if (data == 'blah')
                {
                    alert("success"); //only with IE
                }
            }
        });
    }
});

The url is strange because I’m using Joomla component development. It essentially points to a file that has echo "blah";. The html is just a button with class deletebutton.

On IE this code works fine and the alert is fired. On FF and Chrome it doesn’t work. Checking the jqXHR.status shows that it returns 0. I don’t see anything in Firebug that points me to an issue here. Any idea what is going on?

EDIT: I noticed that it has something to do with my html button. The current button is inside a form:

        <form name="myform" action="">
        <table id="webcam-table" class="pretty">
            <thead>
            <tr>
                <th>Camera Name</th>
                <th>Date Created</th>
                <th>Video Size</th>
                <th>Video Length</th>
                <th>
                    <input type="checkbox" name="checkboxselectall" title="Select All" />
                    <button class="deletebutton" title="Delete the selected videos" >Delete</button>
... //a table with checkboxes (for the form) and other stuff
</form>

But if I create a simple button outside this form my ajax call works as expected. What is going on here?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I successfully ran your code after updating my version of jQuery. The on() function was introduced in version 1.7. The following code worked. I passed the variables to blah.php, passed them back and echoed them out in the alert.

    $(document).ready(function(){
    jQuery(".deletebutton").on("click", function(event) {
        if (confirm("Are you sure you want to delete?")){
            jQuery.ajax({
                url: 'blah.php?option=com_recordings&task=deletevideos&format=raw',
                type: "POST",
                success: function(data){
                    alert(data);
                }
            });
        }
    });
});

    Here’s blah.php:

    <?php
echo $_GET['option'].' '.$_GET['task'].' '.$_GET['format'];

    Here’s the contents of the body tags:

    <body>
    <form name="myform" action="">
        <table id="webcam-table" class="pretty">
            <thead>
            <tr>
                <th>Camera Name</th>
                <th>Date Created</th>
                <th>Video Size</th>
                <th>Video Length</th>
                <th>
                    <input type="checkbox" name="checkboxselectall" title="Select All" />
                    <button class="deletebutton" title="Delete the selected videos" >Delete</button>
                </th>
             </tr>
             </thead>
         </table>
    </form>
</body>
    • 0