2017-10-17 103 views
2

在我的jsp页面中我必须在控制器类中传入开始日期和到期日期,然后使用该日期我在Impl类中过滤数据。但事情是在传递日期到控制器还我需要显示在引导模式如何在MVC控制器类中调用bootstrap模式

这是页我的JSP表单按钮后,该数据点击这些日期跳转显示控制器类

<table id="default-datatable" data-plugin="DataTable" 
                   class="table table-striped" cellspacing="0" 
                   width="100%"> 
                   <thead> 
                    <tr> 
                     <th>Season</th> 
                     <th>Start date</th> 
                     <th>End date</th> 
                     <th>Activate Season</th> 

                    </tr> 
                   </thead> 

                   <tbody> 
                   <c:forEach var="element" items="${seasons}"> 
                   <tr> 
                   <form action="season.create" method="POST"> 




                      <td>${element.seasonName}</td> 
                      <td>${element.startDate}</td> 
                      <td>${element.endDate}</td> 

                      <%-- <td><a data-toggle="modal" 
                       data-id="${element.seasonId}" title="Add this item" 
                       class="open-AddBookDialog btn btn-info" 
                       href="#myModal">Select Offer</a></td> --%> 


                       <td> 
                       <input type="hidden" name="startDate" 
                        id="startDate" value="${element.startDate}"></input> 
                       <input type="hidden" name="expiryDate" 
                        id="expiryDate" value="${element.endDate}"></input><input type="submit" class="btn btn-primary" 
               style="width: 90%; margin-top: 10px;" 
              name="action" value="Add" onclick="showDiv()"></td> 

和我的控制器类方法在波纹管

@RequestMapping(value = "/season.create", method = RequestMethod.POST) 
    public String createSeason(@ModelAttribute("Offer") Offer offer, BindingResult result,@RequestParam String action,@RequestParam("startDate") String startDate, 
    @RequestParam("expiryDate") String expiryDate, Map<String, Object> map, HttpServletRequest request, Model model) { 
     System.out.println("testing -----------"); 
     int merchantId = 11; 
     switch (action.toLowerCase()) { 
     case "add": 
      offerservice.getAlloffers(merchantId,startDate,expiryDate); 
      System.out.println("inside season.create test strat date "+startDate+"enddate"+expiryDate); 
      System.out.println("exDate"+expiryDate); 
     //map.put("offerFilterd", offerservice.getAlloffers(merchantId)); 
      //map.put("offers", offerservice.getAlloffers(merchantId)); 
      map.put("offers", offerservice.getAlloffers(merchantId,startDate,expiryDate)); 

      map.put("seasons", offerservice.getAllSeasons(merchantId)); 
      map.put("Offer", new Offer()); 
      map.put("SeasonTypes", new SeasonTypes()); 

      map.put("editSingleImage", false); 
      map.put("imageGalary", false); 
      map.put("video", false); 

      break; 
     case "edit": 

      break; 
     case "delete": 

      break; 
     case "search": 

      break; 
     } 

     //map.put("offers", offerservice.getAlloffers(merchantId)); 
     map.put("offers", offerservice.getAlloffers(merchantId,startDate,expiryDate)); 
     map.put("seasons", offerservice.getAllSeasons(merchantId)); 
     map.put("Offer", new Offer()); 


     map.put("editSingleImage", false); 
     map.put("imageGalary", false); 
     map.put("video", false); 

     return "create-offer"; 
    } 

这是我的boostrap模式,它包含在jsp页面中。

<div id="myModal" class="modal fade" role="dialog" style="display:none;"> 
      <div class="modal-dialog modal-lg"> 

       <!-- Modal content--> 
       <div class="modal-content"> 
        <div class="modal-header"> 
         <button type="button" class="close" data-dismiss="modal">&times;</button> 
         <h4 class="modal-title">Select Offer</h4> 
        </div> 
        <div class="modal-body"> 

         <div class="table-responsive"> 
          <table id="default-datatable" data-plugin="DataTable" 
           class="table table-striped" cellspacing="0" width="100%"> 
          <p>form has submitted</p> 
           <thead> 
            <tr> 

             <th>Offer Heading</th> 
             <th>Offer Description</th> 
             <th>Issue Date</th> 
             <th>Expiration date</th> 
             <th>Offer Discount </th> 
             <th>Offer Price </th> 
             <th>Allocated Points </th> 
             <th>OfferClaim LImit</th> 
            </tr> 
           </thead> 

           <tbody> 

            <c:forEach var="element" items="${offers}"> 
              <form:form action="offer.bind" method="POST" commandName="SeasonTypes" id="formID"> 
          <tr> 

           <form:hidden path="seasonId" id="bookId" class="form-control normtxtin"/> 
          <%-- <td><form:input path="offerId" name="offerid" value="${element.offerid}" class="form-control normtxtin"/></td> --%> 

           <td>${element.offerSubheading}</td> 
           <td>${element.offerDescription}</td>  
           <td>${element.issueDateTime}</td> 
           <td>${element.expiryDate}</td> 
           <td>${element.offerDiscount}</td> 
           <td>${element.offerPrice}</td> 
           <td>${element.pointsAllocated}</td> 
           <td>${element.offerClaimLimit}</td> 
           <td><input type="hidden" id="offerId" name="offerid" type="text" value="${element.offerid}"/></td> 
           <td><button type="submit" class="btn btn-primary" style="width:100%;font-size:16px;padding:10px;" name="action" value="Add">Select Offer</button></td> 
          </tr> 
         </form:form> 
            </c:forEach> 
           </tbody> 
          </table> 
         </div> 
        </div> 
        <div class="modal-footer"> 
         <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
        </div> 
       </div> 

      </div> 
     </div> 
</div> 

,这是我的Java脚本代码

<script> function showDiv() {  $('#myModal').modal('show') } 
</script> 

这里是我的DAOIMPL methord

public List <Offer> getAlloffers(int merchantId,String sDate,String ExDate){ 
     System.out.println("sDate"+sDate+ "EndDate"+ExDate); 
     Long merchantIdLng = (long) merchantId; 
     List<Offer> offers= sessionfactory.openSession().createQuery("From Offer where merchant ="+merchantIdLng+"and issueDateTime BETWEEN '"+sDate+"' AND'"+ ExDate+"'").list(); 

     return offers; 

    } 

但按钮后,单击它并没有表现出引导模式。如果有人能说出为什么我的代码不工作。我需要通过日期并过滤数据,并在按钮单击时显示模式

+0

什么是你确切的问题?难道你不能打开你的模式或什么? –

+0

是的,我无法打开我的模式,当按钮单击,没有表单提交,是否有任何选项喜欢ajax.I想知道如何通过使用ajax – kaushi

+0

做到这一点不需要ajax打开你的模态。使用ajax是为了从服务器端获取数据。 –

回答

0

这里的代码与您使用的代码相同。除了我加引导和jQuery:

function showDiv(){ 
 
$('#myModal').modal(); 
 

 
} 
 

 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 

 
<!-- jQuery library --> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 

 
<!-- Latest compiled JavaScript --> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 

 
<input type="submit" class="btn btn-primary" id="showDivBtn" 
 
style="width: 90%; margin-top: 10px;" name="action" value="Add" onclick="showDiv()"> 
 
               
 
<div id="myModal" class="modal fade" role="dialog" style="display:none;"> 
 
      <div class="modal-dialog modal-lg"> 
 
<!- your modal contain -!> 
 
     </div> 
 
</div>

相关问题