javascript - 重置 AJAX/模态数据 (PHP Codeigniter)

Question

所以我克隆了一个表并用我使用 AJAX 获得的数据在这个 javascript 中填充它。问题是这个函数运行'onClick'并且数据没有被重置，而是将旧的克隆表附加到新克隆的表中。我怎样才能重置它？每次我点击。

这是“onClick”按钮/功能：

    <table class="table-hover table dashboard">
        <thead>
            <tr>
                <!-- <th id="request-id">ID</th> -->
                <th id="request-name">NAME</th>
                <th id="requestor-name">OWNER</th>
                <th id="urgency">URGENCY</th>
                <th id="request-date">EXPORTATION DATE</th>
                <th id="environment">ENVIRONMENT</th>
                <th id="status">STATUS</th>
                <!-- <th id="actions">ACTIONS</th> -->
            </tr>
        </thead>
        <tbody id="data">
            <?php foreach($shared_requests as $request){ ?>
                <tr onclick="this.onclick = view_project('<?php echo $request->projectID; ?>', '<?php echo $request->taskID; ?>', '<?php echo $request->requestID; ?>')" data-toggle="modal" data-target="#view_request">
                    <td class="txt-oflo" id="request-name">PROD_CR-csremail-au-wiscust-au-PO(B2BE#3893292)</td>
                    <td class="txt-oflo" id="requestor-name"><?php echo $request->owner ;?></td>
                    <td class="txt-oflo" id="urgency">NORMAL</td>
                    <td class="txt-oflo" id="request-date"><?php echo $request->requestDate ;?></td>
                    <td class="txt-oflo" id="environment"><?php echo $request->environment ;?></td>
                    <td class="txt-oflo" id="status"><?php echo $request->status ;?></td>
                </tr>
            <?php } ?>
        </tbody>
    </table>

这是我的 AJAX：

function view_project(projectID, taskID, requestID) {
        var projectID = projectID;
        var taskID = taskID;
        var requestID = requestID;
        var json = {'projectID':'" + projectID + "','taskID':'" + taskID + "','requestID':'" + requestID + "'};
        $.ajax({
            type:'POST',
            url:"<?php echo site_url('request/view_request'); ?>/" + projectID + "/" + taskID + "/" + requestID,
            dataType: 'json',
            data: json,
            success:function(data) {
                console.log(data.requests);
                console.log(data.curr_request);
                console.log(data.translation_changes);
                console.log(data.translations);

                //Project Details
                document.getElementById("projectID").innerHTML = data.curr_request[0]['projectID'];
                document.getElementById("taskID").innerHTML = data.curr_request[0]['taskID'];
                document.getElementById("projectOwner").innerHTML = data.curr_request[0]['projectOwner'];
                document.getElementById("docType").innerHTML = data.curr_request[0]['docType'];
                document.getElementById("sender").innerHTML = data.curr_request[0]['sender'];
                document.getElementById("receiver").innerHTML = data.curr_request[0]['receiver'];

                var requestsNum = Object.keys(data.requests).length;
                var translationNum = Object.keys(data.translations).length;

                //Translation Changes
                for(var i = 0; i < requestsNum; i++){
                    //Cloning (Per Revision)
                    if(i != 0){
                        var cloneRevision = $('#revisions').clone(true)
                        .insertAfter(".revisions:last")
                        .attr("id", "revisions" + i);

                        cloneRevision.find('[id]').each(function() {
                            var strNewId = $(this).attr('id').replace(/[0-9]/g, i);
                            $(this).attr('id', strNewId);
                            $(this).attr('name', strNewId);
                        });
                    }

                    //Mapping
                    document.getElementById("revisionNumber["+i+"]").innerHTML = data.requests[i]['revisionNumber'];
                    document.getElementById("requestDate["+i+"]").innerHTML = data.requests[i]['requestDate'];
                    document.getElementById("deployDate["+i+"]").innerHTML = data.requests[i]['deployDate']; 
                    document.getElementById("environment["+i+"]").innerHTML = data.requests[i]['environment'];
                    document.getElementById("status["+i+"]").innerHTML = data.requests[i]['status'];                   

                    for(var j = 0; j < translationNum; j++){
                        //Cloning (Per translation)
                        if(data.requests[i]['requestID'] + data.translations[j]['requestID']){
                            if(j != 0){
                                var cloneTranslation = $('#translations').clone(true)
                                .insertAfter(".translations:last")
                                .attr("id", "translations" + j);

                                cloneTranslation.find('[id]').each(function() {
                                    var NewID = $(this).attr('id').replace(/[0-9]/g, j);
                                    $(this).attr('id', NewID);
                                    $(this).attr('name', NewID);
                                });
                            }           

                            //Mapping              
                            document.getElementById("changes["+j+"]").innerHTML = data.translation_changes[j]['changes'];
                            document.getElementById("name["+j+"]").innerHTML = data.translations[j]['name'];
                            document.getElementById("internalID["+j+"]").innerHTML = data.translations[j]['internalID'];
                        }
                    }
                }
            }
        });
    };

这就是我克隆的内容：

<div class="container view-request">
<table class="revisions table table-bordered" id="revisions">
    <thead class="header">
        <tr class="header text-dark">
            <th colspan="4" class="text-center">
                REVISION <span id="revisionNumber[0]"></span>
                <span><span id="status[0]"></span> to <span id="environment[0]"></span></span>
            </th>
        <tr>
    </thead>

    <tbody class="translations" id="translations">
        <tr>
            <th>Request Date</th>
            <td id="requestDate[0]"></td>
            <th>Deployment Date</th>
            <td id="deployDate[0]"></td>
        </tr>
        <tr>
            <td><strong>Test Internal ID:</strong> </td>
            <td id="internalID[0]"></td>
            <th colspan="">Release as Document Type:</th>
            <td id="doctype[0]"></td>
        </tr>
        <tr>
            <th>Translation Name:</th>
            <td id="name[0]"></td>  
            <th>Translation Changes</th>
            <td id="changes[0]" colspan="3"></td>
        </tr>
        <tr class="spacer"><td colspan="4"></td></tr>   
    </tbody>
</table>

基本上我想做的是重置克隆。我似乎无法找到一种方法。有没有？:(

提前致谢！

标签： javascriptphp