CODEWITHSUNDEEP
jspservletshtml-table
Dilukshan Mahendra
Dilukshan Mahendra

Reputation: 3398

Delete a table row by an ID which is inside hidden field

I have a table which generates its rows in a while loop as follows in JSP, (I use a hidden field in each row to get the specific ID and POST it to the servlet)

<tr>
    <td><center><%  out.print(rs1.getString("teamid"));%></center><input name="tid" type="hidden" value="<%out.print(rs1.getString("teamid"));%>"/></td>
    <td><center><%  out.print(rs1.getString("teamname"));%></center></td>
    <td><center><%  out.print(rs1.getString("teaminitials"));%></center></td>
    <td><center><%  out.print(rs1.getString("teamdesc"));%></center></td>  
    <td><center><input type="submit" class="greenbutton" name="delete" value="Delete"/></center></td>
</tr>

In the servlet,

String buttondelete = request.getParameter("delete");
    if(buttondelete!=null){
    String tid = request.getParameter("tid");

        try {
            clmmodel_database.updateQuery("delete from clm_team where teamid = '"+tid+"'");
            response.sendRedirect("clmview_teamlist.jsp");
        } catch (Exception e) {
        }

    }

But this deletes always the first row of the table, not the row I need to delete. Please show me where I have done the mistake or suggest me a way.

Upvotes: 2

Views: 11477

Answers (5)

SharmaG
SharmaG

Reputation: 1

use this code to diplay List in the table form:

<tr>
    <td>
        <input type="submit" name="data" value=<%=rs.getString(5)%> />
    </td>
</tr>

Here "rs.getString(5)" is the id. id is a field name/5 is a column index in a table.

In SERVLET/JSP page

String id = request.getParameter("data"); //Store clicked 'submit' value.

Out.println(id);//Use the variable for your SQL.

It worked for me.

Upvotes: 0

Alan Hay
Alan Hay

Reputation: 23226

The simplest solution would seem to be to create a form for each element:

<tr>
<td>
Item X
</td>
<td>
<form><input type="hidden" name="id" value="x"/><input type="submit"/></form>
</td>
</tr>

<tr>
<td>
Item Y
</td>
<td>
<form><input type="hidden" name="id" value="y"/><input type="submit"/></form>
</td>
</tr>

Upvotes: 1

Vinoth Krishnan
Vinoth Krishnan

Reputation: 2949

@Dilukshan Mahendra You can try like this, Which is worked for me. All you need to do is enter your table id and anchor tag class(Every row has anchor tag for row, hence use class)

$("#table_name tr td anchor_class").click(function(e) {
// e.preventDefault();
var row = $(this).closest('tr');
var rowid = row.attr('id');
var url = $(this).attr('href');
var ajaxUrl = url.substring(url.lastIndexOf("/") + 1, url.length);
input_box = confirm("Are you sure you want to delete this Record?");
if (input_box == true) {
    // Output when OK is clicked
    // Here you are sending your servlet URL to ajax.
    $.ajax({
        url : ajaxUrl,
        type : "POST",
        async : false,
        success : function() {
            $('#'+rowid).remove();
            alert('Record Deleted');
        }
    });

    return false;
} else {
    // Output when Cancel is clicked
    // alert("Delete cancelled");
    return false;
}
});

And my html table row looks like,

<tr>
   <td>
     <input type="text">
   </td>
   <td>
     <textarea ></textarea>
   </td>
   <td>
     <input class="file1" type="file" value="">
   </td>
   <td>
      <a id="deleteFile2" class="del" href="ur_servlet_url&id=2">Delete</a>
   </td>
</tr>

Hope this helps..

Upvotes: 0

Uooo
Uooo

Reputation: 6334

In your rendered HTML table, you will have multiple hidden fields with the same id-attribute:

<form>
    <table>
        <tr>
            <td> <input type="hidden" value="ID_1" id="tid" ... > </td>
            <td> ... </td>
        <tr>
        <tr>
            <td> <input type="hidden" value="ID_2" id="tid" ... > </td>
            <td> ... </td>
        <tr>
        ...
    </table>
</form>

That's valid. When sending the form, all values of tid fields will be sent to the server, as an array. Like: tid = [ "ID_1", "ID_2", ... ]

request.getParameter("tid") will return you the first value of this list. Hence, always the first row will be deleted.

One possible solution is to remove the hidden input field and give your submit buttons, which you have in each row, a different value:

<td> <input type="submit" name="delete" value="<%out.print(rs1.getString("teamid"));%>"/> </td>

Then, the browser will see: 

<form>
    <table>
        <tr>
            <td> ... </td>
            <td> <input type="submit" name="delete" value="ID_1"/> </td>
        <tr>
        <tr>
            <td> ... </td>
            <td> <input type="submit" name="delete" value="ID_2"/> </td>
        <tr>
        ...
    </table>
</form>

And, in your servlet, use:

String tid = request.getParameter("delete");

This will give you the right ID.

Upvotes: 0

Aniket Kulkarni
Aniket Kulkarni

Reputation: 12983

Problem is

1)delete button name on form is common for all rows. 

String buttondelete = request.getParameter("delete"); //button name on form

How do you know which delete button is clicked? There is no identifier.

Solution
I am not providing complete code, but giving you the direction.

There is no need of hidden field.

You can use AJAX and write one javascript function which gets the id and pass to servlet 

<input type="button" class="greenbutton" name="delete" value="Delete" id="<%rs1.getString("teamid");%>" onclick="deleteRow(this.id)"/>

Javascript 

function deleteRow(clickedId)
{
   //AJAX call here
  //pass this clickedId to Servlet and delete the row , show response back to user 
}

Related link

Upvotes: 0

Related Questions