what is wrong with this ajax/jsp code?

when i click search for the first 2 times it doesnt show anything, then for the 3rd time it shows results for the first search, so basically the results are delayed by 2 results. The tables are only flashed it doesnt stay visible. Why????

/this is the code for the servlet/

 case "/ViewArchive":
                        String line = "";
                        searchString = request.getParameter("searchString");
                        searchBy = request.getParameter("searchBy");
                        searchType = request.getParameter("searchType");
                        if(searchString.isEmpty()==false)
                        {
                            if(searchType.equalsIgnoreCase("major incident"))
                            {
                                mi = new DBManager().getArchiveMajorIncident(searchString, searchBy);
                                request.getSession().setAttribute("majorincident", mi);
                            }
                            else if(searchType.equalsIgnoreCase("elevated ticket"))
                            {
                                et = new DBManager().getArchiveElevatedTicket(searchString, searchBy);
                                request.getSession().setAttribute("elevatedticket", et);
                            }
                            else if(searchType.equalsIgnoreCase("open critical/high issue"))
                            {
                                oh = new DBManager().getArchiveOpenCriticalHighIssue(searchString, searchBy);
                                request.getSession().setAttribute("opencriticalhighissue", oh);
                            }
                        }
                    /*request.getSession().removeAttribute("searchType");
                    request.getSession().setAttribute("searchType",searchType);
                    request.getRequestDispatcher("viewhistory.jsp").forward(
                            request, response);*/

**JSP PAGE**


    <div class="center">
            <div class="search">
                <form>
                    Search: <input id="searchString" type="text"  name="searchString" >&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    Type: <select name="searchType" id="searchType"><option>Major Incident</option><option>Elevated Ticket</option><option>Open Critical/High Issues</option></select>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    By: <select name="searchBy" id="searchBy"><option>EM No.</option><option>IM No.</option></select>
                    <button class="myButton searchBtn" id="searchBtn" type="submit" value="submit">Search</button>
                </form>
            </div>
            <h3 style="display:none"></h3>
            <table style ="display:none" id = "MajorIncidentsTable" width="100%">
                    <colgroup> 
                        <col style="width:8%">
                        <col style="width:11%">
                        <col style="width:20%">
                        <col style="width:8%">
                        <col style="width:20%">
                        <col style="width:10%">
                        <col style="width:10%">
                        <col style="width:11%">
                    </colgroup>  
                    <tr>  
                        <th>EM#</th>
                        <th>Date Opened</th>
                        <th>Description</th>
                        <th>Current Status</th>
                        <th>Next Action Step/s</th>
                        <th>Technical Owner</th>
                        <th>Ownership</th>
                        <th>Checkpoint Schedule</th>
                    </tr>
                    <tbody>
                        <c:forEach var="c" items="${majorincident}" varStatus="counter">
                            <tr>
                                <td>${c.em_no}</td>
                                <td>${c.dateopened}</td>
                                <td>${c.description}</td>
                                <td>${c.current_status}</td>
                                <td>${c.next_action_steps}</td>
                                <td>${c.technical_ownership}</td>
                                <td>${c.owners}</td>
                                <td>${c.checkpoint_schedule}</td>
                            </tr>
                        </c:forEach>
                    </tbody>
            </table>
</div>

/this is in the JSP page too/

    <script type="text/javascript">
    $(document).ready(function(){
        /* if($majorincident!=null || $elevatedticket!=null || $opencriticalhighissue!=null){

        } */
        $("#searchBtn").click(function(){
            var name = $("#searchString").val();
            var type = $("#searchType>option:selected").text();
            var by = $("#searchBy>option:selected").text();
            if(type=="Major Incident"){
                $("h3").css('display', 'block');
                $("#MajorIncidentsTable").css('display', 'block');
                $("#ElevatedTicketsTable").css('display', 'none');
                $("#OpenCriticalHighIssuesTable").css('display', 'none');
                $('h3').replaceWith(type);
            }
            else if(type=="Elevated Ticket"){
                $("h3").css('display', 'block');
                $("#MajorIncidentsTable").css('display', 'none');
                $("#ElevatedTicketsTable").css('display', 'block');
                $("#OpenCriticalHighIssuesTable").css('display', 'none');
                $('h3').replaceWith(type);
            }
            else if(type=="Open Critical/High Issues"){
                $("h3").css('display', 'block');
                $("#MajorIncidentsTable").css('display', 'none');
                $("#ElevatedTicketsTable").css('display', 'none');
                $("#OpenCriticalHighIssuesTable").css('display', 'block');
                $('h3').replaceWith(type);
            }

            $.ajax({
                url : "ViewArchive",
                data : {"searchString" : name.toString(), "searchType" : type,"searchBy":by },
                type : "POST",
                success : function(msg) {
                }
            });
            name = "";
            type = "";
            by = "";    
        });
    });
    </script>
</html>


Source: jsp

Leave a Reply