CODEWITHSUNDEEP
javascriptajaxlaravel
Suyesh Bhatta
Suyesh Bhatta

Reputation: 151

refresh tab after ajax form submit without refreshing the view

Refresh tab and data in the tab without refreshing the view on ajax form submit

 $(document).off('click','.updatepro');
 $(document).on('click','.updatepro',function(){
    $('#user-update').ajaxSubmit({
        // dataType:'json',
        success:function(response){
            $('#userupdate').modal('hide');
            //$('#tab3').tabs('refresh');
            //document.location.reload(true)
            //$("#userupdate").html(response);
            window.location.href += "#tab2";
            location.reload();
        }
    })
 });

When I submit the popup form the form closes and the view is refreshed but what I want is only for the tab and data inside to refresh without refreshing the whole view

Upvotes: 0

Views: 1154

Answers (2)

Suyesh Bhatta
Suyesh Bhatta

Reputation: 151

here is how i did it

$(document).off('click','.updatepro');
 $(document).on('click','.updatepro',function(){
    $('#user-update').ajaxSubmit({ 
        dataType:'json',
        success:function(response){
            if(response.type == 'success'){
                $('#userupdate').modal('hide');
                $('#tab2').trigger('click');
                $('.modal-backdrop').remove();
            }else{
                alert(response.message);
            }
            alert("Detail Updated");
            console.log(response);

        }
    })

 });

sent a success type from the controller and used trigger to reload the tab when the type is success.

Upvotes: 0

Ricky
Ricky

Reputation: 498

function click()
{
location.href();
$("#divID").load(location.href +"#divID");
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="divID">
div is loadedsadsadsafdas
dfdaf

</div>
<div id="DONOTLOADED">
something which is not loaded
</div>
<input type="button" onclick="click()" value="Load Only first Div"/>

Upvotes: 1

Related Questions