Question

I have this JQuery Code, Its in the DOM Ready, on click of .deleteCatFavs it runs this function. I want to add some If functionality to this but am having trouble.

// Delete a Favorite Category,
    $('.deleteCatFavs').live("click", function(){

    var actionRequested = "AJAX_delFavCat";
    var url = "index.php";
    var catId = $("input[name=FavCats]:checked").val();
    var rowId = $("input[name=FavCats]:checked").attr("id");

        $.post(url, {AJAX_Action: actionRequested, rowId: rowId},
        function(data){
            $("#favCats").html(data);
        });
    });

I want this to do something like this. I have used a isset() to show what I want to do in a PHP way, I just dont know how to do this in javascript.

// On DOM Ready, Hide .deleteCatFavs
$('.deleteCatFavs').hide();

// When the input radio button is checked [name=FavCats], 
   if(isset($("input[name=FavCats]:checked") // <-- if radio button is selected
         $(".deleteCatFavs").show();         // Then show the Delete class,

// And if the .deleteCatFavs class is clicked, then run the JQuery code above
   if (.deleteCatFavs.isClicked){
       Run Jquery Code here';
   }

So basically, When the radio button is checked, I want to show the .deleteCatFavs class, otherwise I want it hidden on DOM ready. And also, when the .deleteCatFavs is shown and clicked, It must run the above code.

Im sure this is so simple, I just dont know how to do isset queries in Javascript.

Also, lets keep it simple.

Answer 1

How about:

$("input[name='FavCats']").change(function () {
    /* Fired immediately after a radio button is clicked with name='FavCats' */
    $(".deleteCatFavs").show();
});

Which binds an event handler to the change event–I’m assuming that if any radio button with name FavCats is clicked, you want to show .deleteCatFavs.

And:

$(".deleteCatFavs").click(function () {
    /* Run jQuery code when element with class deleteCatFavs is clicked */
});