webentwicklung-frage-antwort-db.com.de

Rufen Sie Daten aus der Datenbank ab und zeigen Sie sie mithilfe von Textfeldern dynamisch in den Zeilen der Tabelle an

Ich arbeite zurzeit an einem Inventory Management-Projekt. Ich arbeite mit JSP und MySQL auf der Netbeans-Plattform. In meinem Projekt zum Abfragen muss ich Werte aus der Datenbank abrufen und in einer Tabelle anzeigen. Die anzuzeigenden Zeilen sollten auf meiner Seite dynamisch sein. Sie sollten in beliebiger Anzahl angezeigt werden. Angenommen, ich möchte Werte basierend auf einer bestimmten Auswahl abrufen, die ich auswähle, und ich sollte in der Lage sein, alle Daten basierend auf der Auswahl anzuzeigen und in den Zeilen der Tabelle anzuzeigen. Ich kann es nicht in mehreren Zeilen meiner Tabelle anzeigen, da ich Textfelder zur Anzeige der Werte verwende. Hier ist der Code-Ausschnitt:

<table>
    <tr>
        <td>
            <select name="choice_type">
            <option>select</option>
            <option value="part_type">part_type</option>
            <option value="category">category</option>
            <option value="names">names</option>
            </select>    
        </td>
    </tr> 
    <tr>
        <th>VAL</th>
        <th>VAL DESC</th>
    </tr>
    <tr>
        <td> <input type="text" name="val"  id="val" size="15" /></td>
        <td> <input type="text" name="val_desc"  id="val_desc" size="15" /></td>
    </tr>
</table>   

<input type="submit" name="Query" value="Query" onClick="getData();"/>

Die getData () - Funktion sieht wie folgt aus:

function getData(){ 
    xmlHttp=GetXmlHttpObject()
    var id=document.getElementById("choice_type").value;
    var url="choice_retrieval.jsp";//The code for this file is defined below 
    url=url+"?choice_type="+id;
    xmlHttp.onreadystatechange=stateChanged 
    xmlHttp.open("GET",url,true)
    xmlHttp.send(null);
}

function stateChanged(){ 
    if(xmlHttp.readyState==4 || xmlHttp.readyState=="complete"){ 
    var showdata = xmlHttp.responseText; 
    var strar = showdata.split(":");
    if(strar.length>1){
    var strname = strar[1];
    document.getElementById("val").value= strar[1];
    document.getElementById("val_desc").value= strar[2];
   }
} 

Der Code-Ausschnitt für choice_retrieval.jsp lautet wie folgt:

<%
    String ch = request.getParameter("choice_type").toString();
    System.out.println(ch);
    String data ="";
    try{
        Class.forName("com.mysql.jdbc.Driver");
        Connection con = DriverManager.getConnection("jdbc:mysql://", "", "");
        Statement st=con.createStatement();
        ResultSet rs=st.executeQuery("select * from master_panel where choice_type='"+ch+"'");
        while(rs.next())
        {
            data = ":" + rs.getString("val") + ": " + rs.getString("val_desc");
        }
        out.println(data);
        System.out.println(data);
    }
    catch(Exception e) {
        System.out.println(e);
    }
%>

Die hier verwendete Datenbanktabelle ist master_panel (choice_type varchar, val varchar, val_desc varchar). Ich habe bis jetzt keine Einschränkungen auferlegt. Basierend auf dem Wert für choice_type muss ich die entsprechenden Daten (val und val_desc) aus der Datenbank abrufen und in dynamischen Zeilen anzeigen.

7
Neal

Unter der Annahme, dass die Daten zurückgegeben werden (Ihre stateChanged-Methode wird aufgerufen), müssen Sie die Tabellenzeilen (und deren Inhalt sowie die Textfelder) in Ihrer stateChanged-Methode dynamisch erstellen, indem Sie das DOM ändern.

Um das DOM zu ändern, um die Tabellenstruktur zu erstellen, sollte der Code wie folgt gelesen werden (vorausgesetzt, Sie haben die zuvor angezeigten Zeilen bereits entfernt):

var table = document.getElementById('tableId');
var data = xmlHttp.responseText.split(":");

for (int i = 0; i < data.length; i + 2) 
{
  var valueText = document.createElement('input');
  valueText.type = 'text';
  valueText.name = 'value' + i;
  valueText.value = data[i];

  var valueCell = document.createElement('td');
  valueCell.appendChild(valueText);

  var descriptionText = document.createElement('input');
  descriptionText.type = 'text';
  descriptionText.name = 'value' + i;
  descriptionText.value = data[i + 1];

  var descriptionCell = document.createElement('td');
  descriptionCell.appendChild(descriptionText);

  var tableRow = document.createElement('tr');
  tableRow.appendChild(valueCell);
  tableRow.appendChild(descriptionCell);

  table.tBodies[0].appendChild(tableRow);
}

Wie auch @TrueDub gesagt hat, ist das Setzen von SQL in JSPs aus verschiedenen Gründen schlecht. Schlimmer ist das Erstellen von SQL-Abfragen mit Zeichenfolgenverkettung. Dadurch werden SQL-Injection-Angriffe möglich, insbesondere wenn die verkettete Zeichenfolge eine im Browser erfasste Zeichenfolge enthält.

4
Nick Holt

Sie machen dort einiges falsch, vor allem, wenn Sie Datenbankcode in einer JSP haben. Um Ihre spezifische Frage zu beantworten, sollten Sie Ihr Resultset in eine Liste schreiben und diese Liste mit einer bestimmten ID in den Anforderungsbereich setzen. Sie können dann mit dem JSTL-Tag darüber iterieren und die Ausgabe mit der {} -Notation anzeigen.

0
TrueDub