CODEWITHSUNDEEP
javascriptjqueryhtmlcssajax
Hardik Gondalia
Hardik Gondalia

Reputation: 3717

How to Hide multiple div on Ajax Success

I am trying to hide 2 div on Ajax Success by following code

 $(".editButton").click(function () {
        var self = this;
        var membershipid = $(this).attr('id');
        $.ajax({
            type: 'POST',
            url: '@Url.Action("GetMembershipDetail","User")',
            data: { "MembershipID": membershipid },
            success: function (data) {
                $('#ddlStoreUpdate').val(data["fk_Store_ID"]);
                $('#TxtTitleUpdate').val(data["MembershipTitle"]);
                $('#TxtDescriptionUpdate').val(data["MembershipDescription"]);
                $('#TxtTimeFrameUpdate').val(data["MembershipTimeFrame"]);
                $('#TxtMembershipMinUpdate').val(data["MembershipMinVisit"]);
                $('#chkUpdate').prop('checked', data["MembershipGroundLevel"]);
                $('#HiddenMembershipID').val(membershipid);

                if (data["MembershipGroundLevel"] == true)
                {
                    alert("True");
                    $("#TxtTimeFrameUpdate").val(0);
                    $(self).closest("#RowTimeFrameUp").hide()
                    $("#TxtMembershipMinUp").val(0);
                    $(self).closest("#RowMinFrameUp").hide()
                }
                else
                {
                    alert("false");
                    $("#RowTimeFrame").show("slow");
                    $("#RowMinFrame").show("slow");
                    var storeid = $("#ddlStore").val();
                    $.ajax({
                        type: 'POST',
                        dataType: 'json',
                        url: '@Url.Action("GetTimeFrame","User")',
                        data: { 'StoreID': storeid },
                        success: function (data) {
                            $("#TxtTimeFrame").val(data);
                        },
                        error: function (error) {
                            alert(JSON.stringify(error));
                        }
                    });
                }
            },
            error: function (data) {
                alert(JSON.stringify(data));
            }
        })
        $("#myModalUpdate").modal('show');
    });

If condition is working well, but Div(s) doesn't hide If I remove $(self).closest() from second div, first div hides all well, Issue is with multiple div

Upvotes: 1

Views: 153

Answers (2)

Neil Villareal
Neil Villareal

Reputation: 637

You might want to try this:

Replace this code:

$("#TxtTimeFrameUpdate").val(0);
$(self).closest("#RowTimeFrameUp").hide()
$("#TxtMembershipMinUp").val(0);
$(self).closest("#RowMinFrameUp").hide()

To this:

$("#TxtTimeFrameUpdate").val(0);
$(self).closest("#RowTimeFrameUp").each(function(){
   $(this).hide();
});
$("#TxtMembershipMinUp").val(0);
$(self).closest("#RowMinFrameUp").each(function(){
   $(this).hide();
});

Upvotes: 0

Radonirina Maminiaina
Radonirina Maminiaina

Reputation: 7004

You can use class to hide it, like this:

$(".resetValueTo0").val(0); 
$(".divToHide").hide();

Therefor, you don't need to do this:

$("#TxtTimeFrameUpdate").val(0);
$(self).closest("#RowTimeFrameUp").hide()
$("#TxtMembershipMinUp").val(0);
$(self).closest("#RowMinFrameUp").hide()

Upvotes: 2

Related Questions