Comment implémenter une requête JQueryMiniUI en fonction du temps

Cet article vous apporte principalement une méthode d'implémentation des requêtes JQueryMiniUI en fonction du temps. L'éditeur le trouve plutôt bon, je vais donc le partager avec vous maintenant et le donner comme référence pour tout le monde. Suivons l'éditeur et jetons un œil. J'espère que cela pourra aider tout le monde.

La question de l'évaluation a changé par rapport à l'année dernière. À cette époque, je voulais construire un système de gestion de bibliothèque. Cependant, lors de la recherche en fonction du temps, les données front-end ne pouvaient pas être transférées vers le back-end. , donc une partie a été perdue, en le revoyant maintenant, ce n'est en fait que médiocre, mais j'ai le sentiment que c'était juste en vain à l'époque. D'accord, alors comment transférer les données temporelles du premier plan vers l'arrière-plan ? En fait, peu importe s'il s'agit d'un transfert normal, car il existe des fonctions spéciales qui sont implémentées lors de la recherche

Donc, pour transmettre des données lors du chargement de la page, comment jQuery-MINI UI l'implémente :

En fait, ce que nous voulons faire, c'est afficher les données dans le tableau, puis nous Cela dépend de la façon dont cela est mis en œuvre au début :

La réception est la même :

<p id="datagrid1" class="mini-datagrid" style="width: 1000px; height: 280px;"  
    url="../index?method=listAll" idField="id" multiSelect="true" sizeList="[5,10,15]" pageSize="10" 
    > 
    <p property="columns"> 
      <p type="checkcolumn"></p> 
      <p type="indexcolumn">序号</p> 
      <p field="bookGuid" width="60" headerAlign="center" allowSort="true">图书编号</p> 
      <p field="bookName" width="60" headerAlign="center" allowSort="true">图书名称</p> 
      <p field="bookType" class="mini-combobox" width="60" renderer="onTypeRenderer">图书类别</p> 
      <p field="suitable" width="60" renderer="onSuitRenderer">适合人群</p> 
      <p field="buyDate" width="150" headerAlign="center" dateFormat="yyyy-MM-dd HH:mm:ss" allowSort="true">入库日期</p> 
      <p field="count" width="60" style="color:red">借阅次数</p> 
      <p field="remark" width="60" style="color:red">备注</p> 
      <p name="action" width="120" headerAlign="center" align="center" renderer="onActionRenderer" cellStyle="padding:0;">操作</p> 
    </p> 
  </p>

Ce qui précède est ce que montre notre tableau, mini-ui initialisera le tableau lorsque la page sera chargée, donc dans p nous avons un attribut url, qui nous indique la source des données

url="../index?method=listAll"

in La méthode listAll est appelée lors du chargement de la page. Nous appellerons également cette méthode lors de la recherche, mais nous passerons les données en arrière-plan

Alors, comment devrions-nous écrire. en js ? Jetons d'abord un coup d'œil Il n'est pas nécessaire de transférer les données en arrière-plan. Comment charger ce formulaire

var grid = mini.get("datagrid1"); 
    grid.load();

Ensuite, lorsque nous cliquons sur Rechercher, faisons-le. nous devons transférer les données en arrière-plan :

function search() { 
      var type1 = mini.get("type1").getValue(); 
      var date1=mini.get("date1").getValue(); 
      var timestamp = Date.parse(date1); 
      grid.load({ 
        type1:type1, 
        timestmp:timestamp 
       
      }); 
    }

Selon ce qui précède, nous pouvons juger les données reçues dans la listeTout en arrière-plan, puis afficher le correspondant données

Cet endroit a une fonctionnalité L'heure n'est pas transférée au format aaaa-MM-jj, mais est transférée en arrière-plan à l'aide de l'horodatage, ce qui signifie qu'un type de données long est transféré. un aperçu de la façon dont l'arrière-plan le reçoit

public void listAll(HttpServletRequest request, HttpServletResponse response) throws Exception{ 
  String type=request.getParameter("type1"); 
    String lstr=request.getParameter("timestmp"); 
  long time=0; 
  if(lstr!=null && isNumeric(lstr)){ 
    time=Long.parseLong(lstr); 
  } 
  Date date1=new Date(); 
  date1.setTime(time); 
  Date date2=new Date(); 
  date2.setTime(time+24*60*60*1000); 
  SimpleDateFormat sdf=new SimpleDateFormat("yyyy-MM-dd"); 
  String sql="select * from bookinfo"; 
  if(type!= null && type.length()>0 && time==0) 
  { 
    sql="select * from bookinfo where booktype="+Integer.parseInt(type); 
  } 
  else if(time!=0 && type.length()==0) 
  { 
    sql ="select * from bookinfo where buydate between \""+ sdf.format(date1) +"\" and \""+sdf.format(date2)+"\""; 
  } 
  else if(time!=0 && type.length()>0) 
  { 
    sql ="select * from bookinfo where booktype="+Integer.parseInt(type)+" and buydate between \""+ sdf.format(date1) +"\" and \""+sdf.format(date2)+"\""; 
  } 
  else 
  { 
    sql ="select * from bookinfo"; 
  } 
  System.out.println(sql); 
  //要知道的是联合查询中需要得到的List也是显示出来的 
  List list=mdao.getList(sql); 
    //实现的是分页 
    int pageSize=Integer.parseInt(request.getParameter("pageSize")); 
    int pageIndex=Integer.parseInt(request.getParameter("pageIndex")); 
    List sub_list=new ArrayList<>(); 
    int start=pageIndex*pageSize; 
    for(int i=start;i<list.size() && i<start+pageSize;i++) 
    { 
      sub_list.add(list.get(i)); 
    } 
    String json=JsonUtil.listToJson(sub_list, "yyyy-MM-dd hh:mm:ss"); 
    System.out.println(json); 
    json=JsonData.modifyJson(json); 
    json=json.replaceFirst("null", list.size()+""); 
    response.getWriter().write(json); 
 
  }

Ensuite, l'horodatage est converti dans un certain format en arrière-plan, et nous pouvons rechercher dans la base de données certaines instructions SQL. besoin d'ajouter des caractères doubles des deux côtés des guillemets.

En bref , nous utilisons JQuerymini-ui lors du transfert de données temporelles, si si nous seulement passer une heure, le format de l'heure n'est pas aussi satisfaisant que nous le souhaitons, et nous devons faire divers jugements en arrière-plan. Maintenant, nous passons l'horodatage, ce qui réduira certains jugements, et le format de l'heure peut également l'être. facilement modifié. Effectuez la conversion.

Recommandations associées :

thinkphp+Jquery MiniUI système de gestion de développement

thinkphp+Jquery MiniUI système de gestion de développement, thinkphpjquery

Tutoriel jquery miniui contrôle de table cellule fusionnée application_jquery

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!