如何基于表中的用户链接点击生成新的HTML页面?

问题描述 投票:0回答:2

只是给我一个提示,我如何开始使用锚点单击中的ID显示用户个人资料。

我的主页URL为localhost/CRM/dashobard.html

并且我想在localhost/CRM/dashboard.html/17/John-doelocalhost/CRM/dashboard.html/lead/17/中显示用户配置文件>

我的表中的列值带有Lead Name。我想允许用户单击Lead Name,并在新选项卡中向用户显示一个单独的页面,其中包含除表中未存在的其他列之外的所有其他详细信息,这可以通过动态创建配置文件页面来完成但由于我不知道访问用户单击了哪个Lead Name。我认为我缺乏URL转发的概念。

下面是前端的屏幕截图。

enter image description here

enter image description here

enter image description here

我正在使用AJAX动态生成上述表,并且该表的行具有锚标记Lead Name,用户可以在其中单击并访问个人资料页面。但是我认为这需要动态生成HTML页面,但是我不知道该怎么做。

例如,在下面的代码文件loadtable.js中。

$(document).ready(function() {

    var delay = 1000;

    // Campaign Submit Info
    $('[name="search_submit"]').click(function(e) {

        e.preventDefault();

        var lead_status = $('#filterformpost').find('#lead_status_select option:selected').val();
        var campaign_status = $('#filterformpost').find('#campaign_status_select option:selected').val();
        var company_name = $('#filterformpost').find('#company_name_select option:selected').val();
        var tech_area = $('#filterformpost').find('#tech_area_select option:selected').val();
        var firm_size = $('#filterformpost').find('#firm_size_select option:selected').val();
        var firm_type = $('#filterformpost').find('#firm_type_select option:selected').val();
        var country_name = $('#filterformpost').find('#country_name_select option:selected').val();
        var state_name = $('#filterformpost').find('#state_name_select option:selected').val();
        var start_date = $('#filterformpost').find('#start_date_search').val();
        var end_date = $('#filterformpost').find('#end_date_search').val();        

        $.ajax({
            type: "POST",            
            url: "./server/search.php",
            data: {
                "lead_status": lead_status,
                "campaign_status": campaign_status,
                "company_name": company_name,
                "tech_area": tech_area,
                "firm_size": firm_size,
                "firm_type": firm_type,
                "country_name": country_name,
                "state_name": state_name,
                "start_date": start_date,
                "end_date": end_date
            },
            beforeSend: function() {
                $('.message_box').html(
                    '<img src="tenor.gif" width="40" height="40"/>'
                );
            },

            success:function(data){

                var result = $.parseJSON(data);

                console.log(result);

                $("#filterRecords").empty();

                var table='';

                table = $("<table></table>");

                table.append('<thead><th>#</th><th>Lead Name</th><th>Company</th><th>Email</th><th>Phone</th><th>Lead Owner</th><th>Details</th></thead>'); 

                table.append('<tbody></tbody>'); 

                var i = 1;

                $.each(result, function(key, value) {

                    table.last().append("<tr><td>" + i + "</td><td><a target='_blank' class='lead-name' href="+value['Lead_Id']+">" + value['FirstName'] + ' ' + value['LastName'] + "</a></td><td>" + value['Company'] + "</td><td><a href=mailto:" + value['Email'] + ">" + value['Email'] + "</a></td><td>" + value['Phone'] + "</td><td><a target='_blank' class='lead-owner' href=" + value['LeadAddedBy'] +">" + value['LeadAddedBy'] + "</td><td>" + "<form action='' method='POST'><button id=" + value['Lead_Id'] + " name=''>View</button></form>"+"</td></tr>");

                    i = i + 1;                

                });

                $("#filterRecords").html(table);
                $('.message_box').html('');
            }           

        });

    });

});

在运行SQL查询并返回JSON对象的PHP文件中。

<?php 

// send a JSON encoded array to client

include('connection.php');

$selectSQL = "SELECT * FROM tbl_main_lead_info ";

$result_array = array();

$result = $conn -> query ($selectSQL);

// If there are results from database push to result array

if(mysqli_num_rows($result) > 0){

    while ($row = mysqli_fetch_array($result)) {

        array_push($result_array, $row);

    }

}

echo json_encode($result_array);

$conn->close();


?>

在显示表的文件中dashboard.html

<!-- Filter section with Main Lead Table  -->
<section class="operation" id="view_lead_info" style="display: block;">

<div class="row">
      <div class="col">
                        <div style="overflow-x:auto;">
                           <div id="filterRecords"></div> 
                        </div>                        
                    </div>                    
                </div> 

</section>

只是给我一个提示,我如何开始使用锚点单击中的ID显示用户个人资料。我的主页URL是localhost / CRM / dashobard.html,我想在localhost / CRM / ...中显示用户配置文件。] >>

-您首先需要拥有一个配置文件页面,您可以在其中加载特定配置文件的详细信息。-您需要将记录的ID作为查询字符串传递给您的URL,例如:www.your-domain.com/?profileId=xxx-在个人资料页面中,您需要检索profileId并发出获取请求,以从您的数据存储中获取特定的个人资料记录并动态填充标签

•第一个选项是使div看起来像窗口。如果您已经获取了所有数据,则通过单击元素索引,在数组中找到相应的数据,并将其放入新模板中,以便显示它们。•否则,基于-a-标记中生成的URL(应该类似于example.com?client=2

),您必须进行查询,获取客户端详细信息,或者在前面或后端制作一个模板。

您也可以查看此How to get parameters from a URL string in PHP?

javascript jquery html
2个回答
0
投票

-您首先需要拥有一个配置文件页面,您可以在其中加载特定配置文件的详细信息。-您需要将记录的ID作为查询字符串传递给您的URL,例如:www.your-domain.com/?profileId=xxx-在个人资料页面中,您需要检索profileId并发出获取请求,以从您的数据存储中获取特定的个人资料记录并动态填充标签


0
投票

•第一个选项是使div看起来像窗口。如果您已经获取了所有数据,则通过单击元素索引,在数组中找到相应的数据,并将其放入新模板中,以便显示它们。•否则,基于-a-标记中生成的URL(应该类似于example.com?client=2

© www.soinside.com 2019 - 2024. All rights reserved.