标题导航栏的下拉列表不适用于页面选项卡

Posted 2023-05-09

【中文标题】标题导航栏的下拉列表不适用于页面选项卡

【英文标题】：drop down list at header navbar not working well with page tabs

【发布时间】：2020-10-04 04:51:22

【问题描述】：

我编写了在页面上显示选项卡的代码，它工作正常，但问题是当我按下一些选项卡时，我在布局页面上看不到主导航栏的下拉列表，它看起来像空闲然后我应该按两次选项卡出现这种情况，我该如何解决这个问题

感谢您的帮助

谢谢

这是标签的代码

 <ul class="nav nav-tabs">
                <li class="active"><a data-toggle="tab" class="nav_link" data_id="1" href="#home">Home</a></li>
                <li><a data-toggle="tab" class="nav_link" data_id="2" href="#menu1">Menu 1</a></li>
                <li><a data-toggle="tab" class="nav_link" data_id="3" href="#menu2">Menu 2</a></li>
            </ul>




            <div class="tab-content">
                <div id="home" class="tab-pane fade in active">


                    <div id="ProductsDiv1">
                    </div>
                </div>
                <div id="menu1" class="tab-pane fade">

                    <div id="ProductsDiv2">
                    </div>
                </div>
                <div id="menu2" class="tab-pane fade">

                    <div id="ProductsDiv3">
                    </div>
                </div>
            </div>

这是jquery

 <script type="text/javascript">
$(function () 
        $(".nav_link").click(function () 
            //Custom attribute data_id is used to store the ID
            //Get the ID
            var id = $(this).attr("data_id");
            $.ajax(
                url: '@Url.Action("View_All_SupportTickets_tab1", "etraining")',
                type: "get",
                dataType: "html",
                contentType: 'application/json; charset=utf-8',
                data: JSON.stringify( id: id ), //add parameter
                success: function (data) 
                    //success
                    $('#ProductsDiv'+id).html(data); //populate the tab content.
                ,
                error: function () 
                    alert("error");
                
            );
        );
    );

    </script>

这是动作控制器

 public PartialViewResult View_All_SupportTickets_tab1()


    

        var query = (from st in Db.Support_Teckets
                     join pr in Db.Technical_problem on st.Technical_problem_Id equals pr.Technical_problem_Id
                     where st.Status==null || st.Status==""
                     join x in

                     from rp in Db.Ticket_Reply.GroupBy(m =>
       m.Support_Tecket_Id).Select(m => m.OrderByDescending(x => x.Date).FirstOrDefault())
                     join tr in Db.trainers on rp.trainer_id equals tr.trainer_id
                     select new  rp, tr 


       on st.Support_Tecket_Id equals x.rp.Support_Tecket_Id into g

                     from gx in g.DefaultIfEmpty()



                     select new SupportTicketsDetails
                     
                         Support_Tecket_Id = st.Support_Tecket_Id,
                         Created_Date = st.Created_Date,
                         //Created_Time = st.Created_Time,
                         Order_by = Db.trainers.Where(b => b.trainer_id == st.trainer_id).FirstOrDefault().trainer_name,

                         Technical_problem_name = pr.Technical_problem_name,
                         Created_details = st.Created_details,
                         Location = st.Location,

                         Technician = Db.trainers.Where(b => b.trainer_id == st.Current_Technician_Id).FirstOrDefault().trainer_name,
                         Status = string.IsNullOrEmpty(gx.rp.Status) ? "بلاغ جديد" : gx.rp.Status,

                         //Closing_Date = st.Closing_Date ,

                         Last_replier = Db.trainers.FirstOrDefault(a => a.trainer_id == gx.rp.trainer_id).trainer_name.ToString(),


                         Last_reply_Date = gx.rp.Date,

                         //Last_reply_Time = gx.rp.Time,


                         //points = st.points



                     ).ToList().OrderByDescending(a => a.Created_Date);




        return PartialView("View_All_SupportTickets_tab1" ,query);



    

【参考方案1】：

您的代码有两个问题。第一个问题是您需要在 View_All_SupportTickets_tab1() 中添加 id 作为参数，以便使用 id 过滤数据。其次，您不需要使用JSON.stringify，因为在这种情况下，您无法正确发送数据，您只需使用data: id: id

控制器

public PartialViewResult View_All_SupportTickets_tab1(int id)

Javascript

data:  id: id , //add parameter

【讨论】：

感谢您的回复我已经解决了这个问题，因为我忘记为标签视图页面设置空值:) 再次感谢我感谢您的帮助