CODEWITHSUNDEEP
javascriptjsp
Priya
Priya

Reputation: 7

Retrieve data from table to jquery modal box

I am doing a Point of Sale project in using JSP and i it has a product page where the items are added using a modal form and then it is added to the mysql and it is showed in a data table. I have used Reveal modal to design my form. This is the Interface i made.

The add function works just fine and i have the problem in Edit when i click on the edit(Pencil icon) the modal box just loads, how can i get the relevant item details into the modal form with respect of its item code using jsp or javascript.

The code i have used to show the table is as below

<tbody>

                            <%Product dbObj = new Product();
                                ResultSet rs = dbObj.captureItem();
                                while (rs.next()) {

                            %>
                            <tr id="">
                                <td><a href="" data-reveal-id="editModal"><i class="icon-pencil" name="btnEdit" style="color:black;"</a></i> | <a href=""><i class="icon-remove" style="color:black;"></i></a></td>
                                <td><% out.print(rs.getString("itemCode"));%></td>
                                <td><% out.print(rs.getString("packNo"));%></td>
                                <td><% out.print(rs.getString("itemName"));%></td>
                                <td><% out.print(rs.getString("material"));%></td>
                                <td><% out.print(rs.getString("category"));%></td>
                                <td><% out.print(rs.getString("size"));%></td>
                                <td><% out.print(rs.getString("supplierId"));%></td>
                                <td><% out.print(rs.getString("supplierName"));%></td>
                                <td><% out.print(rs.getDate("purchaseDate"));%></td>
                                <td><% out.print(rs.getInt("quantity"));%></td>
                                <td><% out.print(rs.getDouble("unitPrice"));%></td>
                                <td><% out.print(rs.getDouble("totalPrice"));%></td>
                                <td><% out.print(rs.getDouble("localRate"));%></td>
                                <td><% out.print(rs.getDouble("foreignRate"));%></td>
                                <td><% out.print(rs.getInt("reOrderLevel"));%></td>
                                <td><% out.print(rs.getString("location"));%></td>
                                <td><% out.print(rs.getString("description"));%></td>
                            </tr>
                            <%
                                }
                            %>
                        </tbody>

Please help me to get the item code to the edit modal box . Thanks

Upvotes: 0

Views: 776

Answers (2)

YogeshWaran
YogeshWaran

Reputation: 2281

I hope you have maintained column names in array. Use below code to access item code based on edit click

 columns =["itemCode","packNo","itemName","material","category","size"];
 a={};
 $("td a").click(function(e){
      e.preventDefault(); 
      $(this).parent().nextAll().each(function(index,val){
      a[columns[index]]= $(val).text();
   });
  alert(a.itemCode);
 });

demo

Upvotes: 1

Suresh Atta
Suresh Atta

Reputation: 121998

You can assign the jsp values only while page loading ..

assign values to javascript variables while loading and use them later while editing

ex : while loading the page declare the js global variables and assign the values.

var itemcode=<%= rs.getString("itemCode")%>;
var packNo= '<%= rs.getString("packNo") %>';
var material=<%= rs.getString("material") %>;  etc..

then use these values on edit button click .

Upvotes: 0

Related Questions