按下后保持内容

时间:2018-01-24 04:57:55

标签: jquery ajax laravel

我有两个下拉列表的视图,每个选项导航到不同的页面(不是ajax)。我正在使用laravel

<select onChange="window.location.href = this.value" id="selection" name="type" title="Document selection">
     <option value="/document/gup-accepted">-Choose Document Type-</option>
     <option selected value="/document/gup-accepted/fac">Faculty/option>
     <option value="/document/gup-accepted/univ">University</option>

这是我的一个控制器(彼此相似)

public function  getAcceptedGUPFaculty()
{

    $user = Auth::user();
    $roles = $user->showRoleSlug();
    $fac = new Document();

    $fac = $fac->getAcceptedFacultyGUP($roles)->paginate(5);

    if (request()->ajax()) {

        return response()->json(view('layouts.gup-fac', array('fac' => $fac))->render());
    }

    return view('accepted-gup-faculty',compact('fac'));
}

每个页面都有ajax请求的分页,ajax分页工作完美,当我按上一个和下一个仍然可以正常工作。 但是当我转到选项1并转到选项2.页面只显示我的部分刀片模板,它不显示整页内容。

这是我的javascript:

 <script>

    $(window).on('hashchange', function() {
        if (window.location.hash) {
            var page = window.location.hash.replace('#', '');
            if (isNaN(page) || page <= 0) {
                return false;
            }else{
                getData(page);
            }
        }
    });


    $(document).ready(function(){


    $.ajax(
        {
            url: 'fac',
            type: "GET",
            dataType: "json",
        })

        .done(function(data)
        {
            $("#results").empty().html(data);
        })
        .fail(function()
        {
            alert('No response from server');
        });


        $(document).on('click', '.pagination a',function(event)
        {
            $('li').removeClass('active');
            $(this).parent('li').addClass('active');
            event.preventDefault();
            page = $(this).attr('href').split('fac?page=')[1];
            getData(page);
            var url = $(this).attr('href');
            window.history.pushState("","", url);
        });
    });

    function getData(page){
        $.ajax(
            {
                url: 'fac?page=' + page,
                type: "get",
                dataType: "json",
            })
            .done(function(data)
            {
                $("#results").html(data);
            })
            .fail(function()
            {
                alert('No response from server');
            });
    }

</script>

0 个答案:

没有答案