如何发送JobId并在视图上追加值。阿贾克斯

时间:2016-10-03 12:35:15

标签: php jquery ajax append

enter image description here

这是从数据库r_job表中获取的lotal列表.. 当我单击查看详细信息按钮时,它必须通过ajax将作业值带到控制器页面,然后我将获取作业信息,在响应中我必须发送与作业相关的表格,并且必须在此页面上显示。

这是我的动态列表:

$Jobquery = $conn->query("SELECT * FROM r_job ");
while($JobResults = $Jobquery->fetch_assoc()){

<tr>
    <td id="hiringevent"><?php echo $JobResults['hiringevent']; ?></td>
    <td id="JobId"><?php echo $JobResults['id_job']; ?></td>
    <td><button id="ViewDetails" class="btn btn-primary text-center">View Details</button></td>
</tr>

这是我的ajax和jquery Call:

$("#ViewDetails").click(function() {
    $.ajax({
            url: "job-controller.php",
            method: "POST",
            data: {'action':'viewjob','JobId' : + $('#JobId').html()},
            dataType: "json",
            success: function (response) {
                $("#showMessage").html(response['message']);
            },
            error: function (request, status, error) {
                $("#showMessage").html("OOPS! Something Went Wrong Please Try After Sometime!");
            }
        }); 
        return false;
    });

最后我的控制器页面:

if($_POST['action']=='viewjob'){ 
        $jobSearch= $conn->query("SELECT * From r_job WHERE id_job='".$_POST['JobId']."'") or die(mysql_error());
        $ViewJob=$jobSearch->fetch_assoc();
        $hiringevent        =   $ViewJob['hiringevent'];
        $jobname            =   $ViewJob['jobname'];
        $jobdescription     =   $ViewJob['jobdescription'];
        $cutoff             =   $ViewJob['cutoff'];
        $joblocation        =   $ViewJob['joblocation'];
        $interviewlocation  =   $ViewJob['interviewlocation'];
        $jobexperience      =   $ViewJob['jobexperience'];
            $response['message'] = "Show Job Information";
            $response['success'] = true;
            }else{
            $response['message'] = "OOPS! Something Went Wrong Please Try After Sometime!";
            $response['success'] = false;
        }
        echo json_encode($response);
        exit;
    }
  

我当前的问题是,当我单击查看详细信息时,仅查看第一个详细信息   按钮工作仍然没有响应

2 个答案:

答案 0 :(得分:2)

注意每页应该有一个id。 您需要做的就是创建一个js函数并在单击按钮时调用它并将JobId作为参数发送。当你在Loop时,它可以正常工作。

<强> HTML

$Jobquery = $conn->query("SELECT * FROM r_job ");
while($JobResults = $Jobquery->fetch_assoc()){

<tr>
    <td id="hiringevent"><?php echo $JobResults['hiringevent']; ?></td>
    <td id="JobId"><?php echo $JobResults['id_job']; ?></td>
    <td><button class="btn btn-primary text-center" onClick="getDetails(<?php echo $JobResults['id_job']; ?>)">View Details</button></td>
</tr>
}

<强> JS

function getDetails(jobID){
// ajax Call Here
console.log(jobID)// you can see JobID Here.
// now set the values to by using id
$("#ViewJobId").val(response['jobData']['jobId']);
/* val is used to set aswell as get the values */



  /*in case of td you have to use text insted of val*/
   $("#ViewJobId").text(response['jobData']['jobId']);

}

答案 1 :(得分:1)

您的代码中存在查看问题。

<强> 1。 ID只能在HTML页面中使用一次

HTML-id是唯一的,只能在页面上一次使用。这是你的第一个设计错误,如果你在PHP循环中生成html,你需要使用类而不是id。

<强> 2。 ajax发送的id需要取决于你点击的位置

您目前始终向控制器发送相同的ID,因为$('#JobId').html()会独立返回第一个#JobId的html。您必须找出用户点击的按钮才能区分您的ID。

<强> 1。步骤 - 将html中的类替换为多次呈现的所有元素的id。我还为您的按钮添加了data-id属性,这样就可以非常简单地找到点击了哪个按钮:

<tr>
    <td class="hiringevent"><?php echo $JobResults['hiringevent']; ?></td>
    <td class="JobId"><?php echo $JobResults['id_job']; ?></td>
    <td><button class="ViewDetails" class="btn btn-primary text-center" data-id="<?php echo $JobResults['id_job']; ?>">View Details</button></td>
</tr>

<强> 2。步骤 - 在你的ajax请求中:找出用户实际点击的按钮 - 我在这里使用数据属性:

// ...
data: {'action':'viewjob','JobId' : $(this).data('id')},
// ...

解释:jquery中的$(this)总是指引发事件的当前元素。在你的情况下,它是由你的按钮触发的点击事件 - 所以$(this).data('id')正在读取数据属性&#34; id&#34;在你的按钮的HTML代码中。