Muhammad Hamza
Muhammad Hamza

Reputation: 893

How to create search button that runs a jsp scriplet without refreshing?

I am trying to write a code which generates a list of products from a database, the goal is that when you click the search button, a list of products satisfying the search are displayed on a Specific DIV (i have given that div an id). I tried to use the mediocre approach of combining javascript and java (and failed). I want to run the second scriplet (i have marked it in the code) when the search button is clicked so that the contents in div1 are replaced by these, but i don't know how to redirect the result to div1, and for some reason it always shows empty input during run Here is my current code (connections etc are handled by a custom bean) sorry i am new to programming, but if possible please give concrete steps:

Search Product

    <br><br>
    <div class ="col-sm-4">
    <label> Search By ID </label>
    <br>
    <input name ="s1" id="e1" type ="text" class ="input-lg"  placeholder= "search ID"/>
</div>
<div id="div1">   
<%
        Set rs = Etn.execute("select * from products");
        while(rs.next()){
            %><div class="big"><label><%
        out.write(rs.value("id")+"<br>");
        out.write (rs.value("image_name")+"<br>");
        out.write(rs.value("image_actual_name")+"<br>");
        out.write(rs.value("product_type")+"<br><br>");
            %></label><br><input type="checkbox" /></div><%
        }

    %>       

</div>


<%  // this one-->>
    if(request.getParameter("b1")!=null){
    String abc=request.getParameter("s1");
    if(abc==null){}
    else{
    Set rs2 = Etn.execute("select * from products where id = '"+abc+"'");
        if(rs2.next()){
        out.write(rs2.value("id")+" ");
        out.write (rs2.value("image_name")+"<br>");
        out.write(rs2.value("image_actual_name")+" ");
        out.write
   (rs2.value("product_type")+"<br><br>");
        }  

 }
    }
 %>

Upvotes: 1

Views: 570

Answers (1)

kalsowerus
kalsowerus

Reputation: 1008

I would use a different approach to this. The scriptlet that generates the search results should be in a seperate JSP-File. Via AJAX you can then create a different request to the server, something like /searchProducts?q=<search-term> and modify the server to respond to this with the before created JSP. In this generated HTML there should only be the new content of your div1 which you can then insert directly into that <div>.

Upvotes: 1

Related Questions