DecodeForHTML während document.GetElementByID ('input'). Value = 'data [0]', mit dynamischen Array-Daten

Question

Guten Nachmittag.

So erfuhr ich heute, dass eine Webanwendung, die ich für mein Büro entwickelt habe, um einige Sicherheitsberichtdaten zu verfolgen, unter der Fähigkeit leidet, HTML-Tags in das Mitigationsfeld einzufügen. Diese werden in der Datenbank als varchar gespeichert, was perfekt ist. Wenn die Seite jedoch neu geladen wird und erneut zur Anzeige gelesen wird, tritt ein Fehler auf, da ColdFusion diese Tags liest und verhindert, dass meine DataTable ordnungsgemäß initialisiert wird.

Nach einigen Spielen habe ich mich auf für die DataTable-Initialisierung festgelegt, die es ermöglicht, sichtbar zu sein. Der nächste Schritt besteht jedoch darin, diese Zeilendaten aus der DataTable beim Klicken in die Popup-Eingaben zu bekommen, die ich für die zu decodierenden Zeilenänderungen verwende. Wenn ich es so belasse, wie es jetzt ist, was unten ist, öffnet es das Popup mit den codierten Daten und ist sehr schwer zu lesen. Ich habe versucht, DecodeForHTML(data[#]), mit und ohne Ausgänge zu verwenden. Innerhalb der Ausgaben bekomme ich einen Fehler, dass Daten beim Laden der Seite undefiniert sind, weil das Array nicht erstellt wird, bis Sie auf eine Zeile klicken, und ohne Ausgaben bekomme ich einen Syntaxfehler.

Um es klarer zu machen, meine Frage ist, wie kann ich diese Zeichenfolge decodieren, wenn ich es in der <textarea> in meinem Popup anzeigen?

Datatable Creation Code:

<div id="allFindings" style="max-height:50%"> 
     <table id="dt_table_findings" class="display" style="table-layout:fixed; width:100%; font:calibri; font-size:11px; text-align:left;"> 
      <thead> 
       <tr> 
        <th style="width:4%">Task Num</th> 
        <th style="width:5%">App</th> 
        <th style="width:5%">Priority</th> 
        <th style="width:5%">Vuln ID</th> 
        <th style="width:7%">Task</th> 
        <th style="width:5%">Status</th> 
        <th style="width:5%">Category</th> 
        <th>Document</th> 
        <th>Reasoning</th> 
        <th>Mitigation</th> 
        <th>Resources</th> 
        <th>Comments</th> 
        <th style="width:5%">Milestone Date</th> 
        <th style="width:5%">Follow-Up Date</th> 
        <th style="width:6%">Planned Completion</th> 
        <th style="width:5%">Closed</th> 
        <th style="width:5%">Last User</th> 
       </tr> 
      </thead> 
      <tbody> 
       <!---Fill datatable with Findings---> 
       <cfloop query="#findingsQuery#"> 
        <tr style=""> 
         <td>#TASK_NUM#</td> 
         <td>#APPLICATION#</td> 
         <td>#PRIORITY#</td> 
         <td>#VULN_ID#</td> 
         <td>#TASK#</td> 
         <td>#STATUS#</td> 
         <td>#TASK_CATEGORY#</td> 
         <td>#DOCUMENT#</td> 
         <td>#REASONING#</td> 
         <td>#EncodeForHTML(MITIGATION)#</td> 
         <td>#RESOURCES#</td> 
         <td>#COMMENTS#</td> 
         <td>#MILESTONE_DATE#</td> 
         <td>#FOLLOWUP_DATE#</td> 
         <td>#PLANNED_COMPLETION#</td> 
         <td>#CLOSED#</td> 
         <td>#LAST_USER#</td> 
        </tr> 
       </cfloop> 
      </tbody> 
     </table> 
    </div> 

Popup Div:

<div id="edit_findings" class="modal" style="min-width:550px;"> 
     <cfform id="form_updateFindings"> 
      <!---Hidden Popup Identifier for Submit Page---> 
      <cfinput type="hidden" name="view" id="view" value="findings"> 
      <!--- Hidden Task Num ---> 
      <cfinput type="hidden" name="h_taskNum" id="h_taskNum" /> 
      <!---Shown Task Number---> 
      <p><label>Task Num: </label>&nbsp; 
      <cfinput type="text" name="taskNum" id="taskNum" disabled="disabled" /></p> 
      <!---Shown Application Name---> 
      <p><label>App: </label>&nbsp; 
      <cfinput type="text" name="app" id="app" /></p> 
      <!---Shown Priority---> 
      <p><label>Priority: </label>&nbsp; 
      <cfinput type="text" name="priority" id="priority" /></p> 
      <!---Shown Vulnerability ID---> 
      <p><label>Vuln ID: </label>&nbsp; 
      <cfinput type="text" name="vuln_id" id="vuln_id" /></p> 
      <!---Shown Task---> 
      <p><label>Task: </label>&nbsp; 
      <cfinput type="text" name="task" id="task" size="45" /></p> 
      <!---Shown Status---> 
      <p><label>Status: </label>&nbsp; 
      <cfinput type="text" name="status" id="status" /></p> 
      <!---Shown Category---> 
      <p><label>Category: </label>&nbsp; 
      <cfinput type="text" name="category" id="category" /></p> 
      <!---Shown Document Location---> 
      <p><label>Document: </label>&nbsp; 
      <cfinput type="text" name="document" id="document" size="45" /></p> 
      <!---Shown Resources---> 
      <p><label>Resources: </label>&nbsp; 
      <cfinput type="text" name="resources" id="resources" size="45" /></p> 
      <!---Shown Reasoning Box---> 
      <p><label>Reasoning: </label>&nbsp; 
      <textarea name="reasoning" id="reasoning" cols="35" rows="5"></textarea></p> 
      <!---Shown Mitigation Box---> 
      <p><label>Mitigation: </label>&nbsp; 
      <textarea name="mitigation" id="mitigation" cols="35" rows="5"></textarea></p> 
      <!---Shown Milestone Date Box---> 
      <p><label>Milestone Date: </label>&nbsp; 
      <textarea name="milestone" id="milestone" cols="35" rows="5"></textarea></p> 
      <!---Shown Comments Box---> 
      <p><label>Comments: </label>&nbsp; 
      <textarea name="comments" id="comments" cols="35" rows="5"></textarea></p> 
      <!---Shown Follow Up Date---> 
      <p><label>Follow-Up Date: </label>&nbsp; 
      <cfinput type="text" name="followup" id="followup" /></p> 
      <!---Shown Planned Completion---> 
      <p><label>Planned Completion: </label>&nbsp; 
      <cfinput type="text" name="plannedcomplete" id="plannedcomplete" /></p> 
      <!---Shown Closed---> 
      <p><label>Closed: </label>&nbsp; 
      <cfinput type="text" name="closed" id="closed" /></p> 
      <!---Shown Last User---> 
      <p><label>Last User: </label>&nbsp; 
      <cfinput type="text" name="lastuser" id="lastuser" disabled="disabled"/></p> 
      <br /> 
      <!---Submit Button for Update Query---> 
      <cfinput type="button" class="btn" id="submitEditFindings" name="submitEditFindings" value="Submit" onClick="fn_updFindings();"> 

     </cfform> 
    </div> 

Datatable Initialisierungsskripts und Row Klicken Sie auf Aktion:

$(document).ready(function() { 
     var table = $('#dt_table_findings').DataTable({ 
     "bLengthChange": false, 
     "pageLength": 10, 
     "dom": 'frti<"toolbar">p', 
     initComplete: function(){ 
      $("div.toolbar").html('<input type="button" name="addButton" class="add-new-button" onclick="fn_OpenModal()"><input type="submit" name="downButton" class="download-button">'); 

     } 
    });  

     <!--- Actions on Datatable Row Click ---> 
     $('#dt_table_findings tbody').on('dblclick', 'tr', function() { 
      var data = table.row(this).data(); 
      <!--- Set hidden variables for popup 
      alert(data);---> 
      document.getElementById('h_taskNum').value = data[0]; 
      document.getElementById('taskNum').value = data[0]; 
      document.getElementById('app').value = data[1]; 
      document.getElementById('priority').value = data[2]; 
      document.getElementById('vuln_id').value = data[3]; 
      document.getElementById('task').value = data[4]; 
      document.getElementById('status').value = data[5]; 
      document.getElementById('category').value = data[6]; 
      document.getElementById('document').value = data[7]; 
      document.getElementById('comments').value = data[11]; 
      document.getElementById('reasoning').value = data[8]; 
      document.getElementById('mitigation').value = data[9]; 
      document.getElementById('resources').value = data[10]; 
      document.getElementById('milestone').value = data[12]; 
      document.getElementById('followup').value = data[13]; 
      document.getElementById('plannedcomplete').value = data[14]; 
      document.getElementById('closed').value = data[15]; 
      document.getElementById('lastuser').value = data[16]; 
      <!--- Show popup ---> 
      $('#edit_findings').modal(); 
     }); 
    }); 

Answer 1

Wenn ich Ihre Frage und Code-Lese richtig , Sie erhalten HTML-Tags im Feld "Mitigation" und dann Probleme beim Anzeigen sie in der Form, die aufgetaucht ist. Wenn Sie die Ausgabe für HTML codieren, dann sieht es schlecht aus und ist möglicherweise nicht lesbar, weil das, was ein HTML-Tag wäre, in etwas wie %lt;b%gt;something%lt;/b%gt; verwandelt wird. Ich denke, dass Sie ein paar Alternativen haben hier ...

1. Streifen aus alle HTML-Tags oder
2. Verwenden Sie eine Steuer/WYSIWYG-Editor, der die HTML interpretieren können.

Der einfachste dieser beiden ist Option 1. Wenn Sie den Text durch etwas wie folgt ausführen:

REReplaceNoCase(text, "<[^[:space:]][^>]*>", "", "ALL"); 

die mit allen von HTML-Tags Streifen aus und ermöglichen es Ihnen, die Basisinformationen anzuzeigen, ohne jedes Styling für die Benutzer. Option Nummer 2, Sie müssten sehen, ob Sie installieren können und CKEditor als Teil des Popups funktioniert (schwieriger, aber wahrscheinlich nicht unmöglich).

bearbeiten Da Sie angegeben, dass Sie die HTML-Tags in der Zeichenfolge vorhanden behalten möchten, dann, wie Sie die beste Art und Weise gesagt, wäre zu gehen, um die < > Werte zu nehmen, so wird der Text machen.

REReplaceNoCase(text, "<|>", "", "ALL"); 

eine Sache zu beachten ist aber, dass dies alles entfernen wird> und < Werte durch den Strang.Wenn also jemand diese Werte außerhalb der Zeichenkette verwendet, verpasst man diese Werte am Ende. dh x> = 34 wäre am Ende x = 34.