有 Java 编程相关的问题?

你可以在下面搜索框中键入要查询的问题!

从Java创建HTML表,检查TD是否已经在它的右边有一个TD

我正在使用Gagawa(https://code.google.com/archive/p/gagawa/)库动态创建一个HTML表,以显示学校每周的课程安排。问题是,因为我使用rowspan根据课程的持续时间来增加单元格的大小,所以当我尝试(例如)添加在MWF上相遇的课程时,该行的典型布局是

<td>...content...</td> <td></td> <td>...content...</td> <td></td> <td>...content...</td>

<>但是,如果2个过程在时间上重叠但在不同的日子,插入空白{{< CD2>}元素被迫向右,因为在下一列中已经存在另一个进程的^ {CD2>}。请参阅附带的屏幕截图以获得更多说明(我在其上绘制了红色箭头,以显示正确的布局;ANT210.101应该位于MWF上,但我试图在第一个ANT220.102的下半部分阻止它的位置插入一个空白<td>,因此它被放在它的右侧)

Screenshot

我需要一种方法来动态地检测是否放入空白^ {< CD2>},或者使之成为正确的方法,而不是向右移动,它会向下移动(也许在CSS中有这样的方法?)p>

下面是我动态生成HTML表的代码:

public String generateHTMLScheduleTable(Schedule s){
        Table scheduleTable=new Table();
        scheduleTable.setCSSClass("scheduleTable");
        Tr dayRow=new Tr();
        Th time=new Th(); time.appendText("Time");
        Th mon=new Th(); mon.appendText("Monday");
        Th tue=new Th(); tue.appendText("Tuesday");
        Th wed=new Th(); wed.appendText("Wednesday");
        Th th=new Th(); th.appendText("Thursday");
        Th fri=new Th(); th.appendText("Friday");
        dayRow.appendChild(time, mon, tue, wed, th, fri);       
        TreeMap<Integer, String> colors=mapCoursesToColors(s);

        String[] days={"m", "t", "w", "r", "f"};

        for(int j=8; j<=22; j++){
            int timeInt=j%12;
            if(timeInt==0){
                timeInt=12;
            }
            String timeHr="" + timeInt;

            //System.out.println(timeHr);

            String amPm;
            if(j>11){
                amPm="PM";
            }
            else{
                amPm="AM";
            }
            for(int k=0; k<2; k++){
                String timeMin="";
                if(k==0){
                    timeMin="00";

                }
                else{
                    timeMin="30";
                }
                Tr currRow=new Tr();
                Td currCell=new Td();
                currCell.appendText(timeHr + ":" + timeMin + amPm);
                currRow.appendChild(currCell);

                for(int i=0; i<days.length; i++){
                    Td newCell=new Td();
                    for(Course c : s.getCourses()){
                        if((c.getTime().substring(0, c.getTime().indexOf(':')).equals(timeHr) || c.getTime().substring(0, c.getTime().indexOf(':')).equals("0" + timeHr)) && c.getTime().substring(0, c.getTime().indexOf('-')).contains(timeMin) && c.getTime().substring(0, c.getTime().indexOf('-')).contains(amPm)){
                            if(c.getDays().toLowerCase().contains(days[i])){
                                String currentColor=colors.get(c.getCRN());
                                String timeLastHalf=c.getTime().substring(c.getTime().indexOf('-')+1);
                                int startHr=Integer.parseInt(timeHr);
                                int endHr=Integer.parseInt(timeLastHalf.substring(0, timeLastHalf.indexOf(':')));
                                int numCells=endHr-startHr;
                                numCells=numCells*2;
                                if(!c.getTime().substring(0, c.getTime().indexOf('-')).contains("00")){
                                    if(timeLastHalf.contains("00")){
                                        numCells=numCells-1;
                                    }
                                }
                                else{
                                    if(!timeLastHalf.contains("00")){
                                        numCells=numCells+1;
                                    }
                                }
                                if(numCells<2){
                                    numCells=2;
                                }
                                newCell.setBgcolor(currentColor);
                                newCell.setRowspan("" + numCells);
                                newCell.appendText(c.getTitle());
                                newCell.appendChild(new Br());
                                newCell.appendText(c.getCourseAndSection());
                                newCell.appendChild(new Br());
                                newCell.appendText(c.getTime());
                                Input submit=new Input();
                                submit.setType("submit");
                                submit.setCSSClass("btn");
                                submit.setName("" + c.getCRN());
                                submit.setValue("Remove");
                                Input moreInfo=new Input();
                                moreInfo.setType("submit");
                                moreInfo.setCSSClass("btn");
                                moreInfo.setName(c.getCRN() + "View");
                                moreInfo.setValue("More Info");
                                newCell.appendChild(new Br());
                                newCell.appendChild(submit);
                                newCell.appendChild(moreInfo);
                            }
                        }
                    }
                    currRow.appendChild(newCell);
                }
                scheduleTable.appendChild(currRow);
            }
        }
        String html=scheduleTable.write();
        System.out.println(html);

        return html;
    }

共 (2) 个答案

  1. # 1 楼答案

    我不认为我真的理解你的问题,但我的建议是:

    Please see HTML DOM Parser

    您可以从这些建议的代码中选择要使用的代码。将它/它们插入代码中您认为应该放置的位置,可以是在表格显示之后或期间

    搜索单个/集合或集合元素,将返回一个对象/数组

    $td = $html->find("td", 0);
    
    if (is_object($td)) {
        //code here
    }
    

    同上,但方式不同

    if($html->find("td", 0)) {
        //code here
    }else{
        //code here
    }
    

    或者你也可以看看这个foreach方法给定的here

  2. # 2 楼答案

    逻辑(询问OP是否可以,他只需要伪代码)

    It is wrong approach to check if TD already has a TD to the right of it

    Right Approach is to prevent a empty td where there is a rowspan occupation above it so preventing the pushing out of next inserted td. "To simply put always keep the number td always correct"

    你的编码很好,你需要做的就是每天添加一个计数器,如果有五个计数器(因为你在Q的例子中说过),然后使用这个计数器遍历由于上面的行间距分配而占用的空间,并在结束时跟踪它,然后在该列下应用一个空的td

    Column_count是一个变量,用于跟踪行中列的当前位置

    接下来是5个超低指示器,用于指示5列及其溢出状态。既然你说每一行都意味着30分钟,那么你的逻辑是,如果开始时间等于每一行变化导致30分钟增量的时间,那么你就可以在tr中找到一个小时是否必须开始

    在解释中,溢出_X用于每个单独的变量名

    1. 首先,我们需要事先知道外部for循环将有多少行,找到它是留给u的
    2. 现在,首先使用逻辑,我们每天使用switch语句
    3. 现在,我们首先在案例中检查溢出_X计数是否大于零,这是为了了解是否需要插入类详细信息,或者大于零意味着它是由上面的行span分配的,其默认值将为-1。我会解释为什么
    4. 溢出变量的默认值设置为-1,因为每次添加行跨度2或其倍数(取决于)时,都会添加一个td,其值会增加2。所以在下一次的迭代中,它被检查,如果小于零 它不会插入新的td,而是转到else case并减小该值
    5. 通过这种方式,我们绕过了添加空白td并导致td向右推进的机会
    6. 所以这里我们只在上面没有行间距分配的情况下插入一个空白的td
    7. 检查下面的_X是否为零,然后将其设置为-1,因为2n-1行跨度已被覆盖

    Overflow variables use so during an iteration if it shows that say thursday has Overflow_Th is incremented by 2.So while inserting next row when switch enters case 4 that is for tuesday it checks to see if there was overflow if yes then Overflow_Th is decremented .So here the blank td insertion is avoided which in future will prevent the td from breaking the flow Demo here

    td{
      
      border:1px solid black;
    
    }
    .pushedOut{
      background:red;
      
    }
    .bully{
      background:blue;
        color:white
    }
    <label>Here the value of Overlow_Col2=1(-1+2)</label>
    <table>
    <tr>
      <td>Data</td>
      <td class="bully " rowspan="2">Pushing</td>
    </tr>
    
    <tr>
      <td>Data</td>
     
    </tr>
    </table>
    <label>Here the value of Overlow_Col2=- after decrementing and finding it zero there for resseting to -1 so back to normal but if was no such variable for tracking it then it would have resulted in this following  <span style="color:red">situation</span> </label>
    <table>
    <tr>
      <td>Data</td>
      <td class="bully " rowspan="2">Pushing</td>
    </tr>
    
    <tr>
      <td>Data</td>
       <td class="pushedOut">pushed out becuase of no means of tracking td of previous row</td>
    </tr>
    </table>

    伪码

    var column_count=0
    Overflow_M=-1,Overflow_Tu=-1,Overflow_W=-1,Overflow_Th=-1,Overflow_Fri=-1
    
    For each number of rows 
    
    for (int column_count=0 ;column_count<5;column_count++)
        {
                switch(column_count){
    
                      case 0: 
                      if(Overflow_M<0)  {
                             if (content needs to be inserted)
                                 {
                                 add td and insert content 
                                 Overflow_M=Overflow_M+2;
                    }else{
    
                                         Add Blank td
    
                         }else{
    
                               Overflow_M=Overflow_M-1;
                               if (Overflow_M==0){
                                         Overflow_M=-1
                                               }
    
                         }
    
                      }   
    
                     case 1: 
                          if(Overflow_Tu<0)  {
                                 if (content needs to be inserted)
                                     {
                                     add td and insert content 
                                     Overflow_M=Overflow_M+2;
    
                                  }else{
    
                                             Add Blank td
    
                             }else{
    
                                   Overflow_Tu=Overflow_Tu-1;
                                         if (Overflow_M==0){
                                             Overflow_M=-1
                                               }
    
                             }
    
                          }  
    
    
                         ....
                         ....
                     similarly 2 cases for wed and thurday
    
    
    
    
      case 4: 
                              if(Overflow_F<0)  {
                                     if (content needs to be inserted)
                                         {
                                         add td and insert content 
                                         Overflow_M=Overflow_M+2;
    
    
    
                                      }else{
    
                                                 Add Blank td
    
                                 }else{
    
                                       Overflow_F=Overflow_F-1;
                                            if (Overflow_M==0){
                                                Overflow_M=-1
                                               }
    
                                 }
    
                              } 
    
    
                    }
             }
    

    如果您事先不知道有多少个类,那么您应该首先遍历这些类,并使用相关数据构建数据库或csv文件或json文件

    td {
      border: 1px solid black;
      width:20%;
    }
    table,tr{width:100%;}
    
    .pushedOut {
      background: red;
    }
    .head{
      background:magenta;
    }
    
    .bully {
      background: blue;
      color: white
    }
    <label>Here the value of Overlow_Col2=1(-1+2)</label>
    <table>
      <tr class="head">
        <th>Monday</th>
        <th>Tuesday</th>
        <th>Wednesday</th>
        <th>Thursday</th>a
        <th>Friday</th>
      </tr><tr>
        <td>Overlow_M</td>
         <td>Overlow_TU</td>
          <td>Overlow_W</td>
           <td>Overlow_Th</td>
           <td>Overlow_F</td>
           </tr>
     
     
       
    
      <tr>
       <td class="bully " rowspan="2">Pushing</td>
    
          <td>Data</td>
        <td class="bully " rowspan="4">Pushing</td>
          <td>Data</td>
           <td>Data</td>
           
             
    
      </tr>
      
        <tr>
         
        
          <td>Data</td>
           <td>Data</td>
        <td class="bully " rowspan="2">Pushing</td>
      </tr>
          <tr>
         
         <td>Data</td>
          <td>Data</td>
    
          <td>Data</td>
      </tr>
            <tr>
         
         <td>Data</td>
          <td>Data</td>
        <td>Data</td>
          <td>Data</td>
      </tr>
      <tr class="head">
        <td>Overlow_M</td>
         <td>Overlow_TU</td>
          <td>Overlow_W</td>
           <td>Overlow_Th</td>
           <td>Overlow_F</td>
           </tr>
    </table>
    Iteration1
    Overflow_M Overflow_W with each decrement it is reduced till it becomes zero and upon which it reset to-1 and during next iteration a empty td is put under it and incase of Overflow_W empty td is never put under it  .
    In case of Overflow_F td is no put from iteration bumber 2-3 and during iteration number 4 again rows are added to the bottom of it

    逻辑的Javascript实现

     var trcounter = 1;
     var O1 = -1,
       O2 = -1,
       O3 = -1,
       O4 = -1,
       O5 = -1,
       O6 = -1;
    
     $("#sbt").click(function() {
    
    
       var YN = $('#YorN').val();
       //$('#Schedule').append("<td rowspan=" + person + "><p>Cult Anthropology</P</td>");
    
    
       if (YN == 'Y' || YN == 'y') {
         var person = prompt("Please enter the rowspan size in multiples of two", "2");
        // alert("y");
       // alert($('#Schedule tr:last td').length);
    
    
         /*    if ($('#Schedule tr:last td').length < 6) {
    
               $('#Schedule tr:last ').append('<td class="red" rowspan="' + person + '"><p>Cult Anthropology</P</td>');
    
             } else {
    
               $('#Schedule').append("<tr> </tr>");
               $('#Schedule tr:last').append('<td class="red" rowspan="' + person + '"><p>Cult Anthropology</P</td>');
    
             }*/
    
    
    
    
    
         switch (trcounter) {
           case 1:
             if (O1 < 0) {
          
               if (trcounter < 7) {
    
                 $('#Schedule tr:last ').append('<td class="red" rowspan="' + person + '"><p>Cult Anthropology</P</td>');
    
               } else {
                 $('#Schedule').append("<tr> </tr>");
                 $('#Schedule tr:last').append('<td class="red" rowspan="' + person + '"><p>Cult Anthropology</P</td>');
               }
               O1 = O1 + parseInt(person);
              // alert(O1);
             } else {
                alert("This TimeSlot on Monday is occupied");
               O1 = O1 - 1;
               if (O1 == 0) {
                 O1 = -1;
               }
             }
             break;
    
           case 2:
             if (O2 < 0) {
          
               if (trcounter < 7) {
    
                 $('#Schedule tr:last ').append('<td class="red" rowspan="' + person + '"><p>Cult Anthropology</P</td>');
    
               } else {
                 $('#Schedule').append("<tr> </tr>");
                 $('#Schedule tr:last').append('<td class="red" rowspan="' + person + '"><p>Cult Anthropology</P</td>');
               }
               O2 = O2 + parseInt(person);
               //alert(O1);
             } else {
               alert("This TimeSlot on Tuesday is occupied");
               O2 = O2 - 1;
               if (O2 == 0) {
                 O2 = -1;
               }
             }
             break;
           case 3:
              if (O3 < 0) {
          
               if (trcounter < 7) {
    
                 $('#Schedule tr:last ').append('<td class="red" rowspan="' + person + '"><p>Cult Anthropology</P</td>');
    
               } else {
                 $('#Schedule').append("<tr> </tr>");
                 $('#Schedule tr:last').append('<td class="red" rowspan="' + person + '"><p>Cult Anthropology</P</td>');
               }
               O3 = O3 + parseInt(person);
             //  alert(O1);
             } else {
               alert("This TimeSlot on Wednesday is occupied");
               O3 = O3 - 1;
               if (O3 == 0) {
                 O3 = -1;
               }
             }
             break;
           case 4:
               if (O4 < 0) {
          
               if (trcounter < 7) {
    
                 $('#Schedule tr:last ').append('<td class="red" rowspan="' + person + '"><p>Cult Anthropology</P</td>');
    
               } else {
                 $('#Schedule').append("<tr> </tr>");
                 $('#Schedule tr:last').append('<td class="red" rowspan="' + person + '"><p>Cult Anthropology</P</td>');
               }
               O4 = O4 + parseInt(person);
             //  alert(O1);
             } else {
               alert("This TimeSlot on Wednesday is occupied");
               O4 = O4 - 1;
               if (O4 == 0) {
                 O4 = -1;
               }
             }
             break;
           case 5:
             if (O5 < 0) {
          
               if (trcounter < 7) {
    
                 $('#Schedule tr:last ').append('<td class="red" rowspan="' + person + '"><p>Cult Anthropology</P</td>');
    
               } else {
                 $('#Schedule').append("<tr> </tr>");
                 $('#Schedule tr:last').append('<td class="red" rowspan="' + person + '"><p>Cult Anthropology</P</td>');
               }
               O5 = O5 + parseInt(person);
             //  alert(O1);
             } else {
               alert("This TimeSlot on Wednesday is occupied");
               O5 = O5 - 1;
               if (O5 == 0) {
                 O5 = -1;
               }
             }
             break;
           case 6:
             if (O6 < 0) {
          
               if (trcounter < 7) {
    
                 $('#Schedule tr:last ').append('<td class="red" rowspan="' + person + '"><p>Cult Anthropology</P</td>');
    
               } else {
                 $('#Schedule').append("<tr> </tr>");
                 $('#Schedule tr:last').append('<td class="red" rowspan="' + person + '"><p>Cult Anthropology</P</td>');
               }
               O6 = O6 + parseInt(person);
              // alert(O1);
             } else {
               alert("This TimeSlot on Wednesday is occupied");
               O6 = O6 - 1;
               if (O6 == 0) {
                 O6 = -1;
               }
             }
             break;
    
         }
         if (trcounter == 7) {
           trcounter = 1;
            $('#Schedule').append("<tr> </tr>");
           $('#Status').html("REACHED SATURDAY MOVING ON TO NEXT TIME SLOT");
         } else {
           trcounter++;
    
         }
       } else if(YN == 'N' || YN == 'n') {
    
    
         /* if (O1 > 0)) {
           O1 ;
         } else if (O1 == 0) {
           O1 = -1;
         }
         if ($('#Schedule tr:last td').length < 6) {
    
           $('#Schedule tr:last ').append("<td ></td>");
    
         } else {
           $('#Schedule').append("<tr> </tr>");
           $('#Schedule tr:last').append("<td ></td>");
         }*/
         switch (trcounter) {
           case 1:
            //  alert("trcounter"+trcounter+"O1"+O1);
             if (O1 < 0) {
               if (trcounter < 7) {
    
                 $('#Schedule tr:last ').append("<td ></td>");
    
               } else {
               //  $('#Schedule').append("<tr> </tr>");
                 $('#Schedule tr:last').append("<td ></td>");
               }
              
             } else {
               O1 = O1 - 1;
              // alert(O1);
               if (O1 == 0) {
                 O1 = -1;
               }
                 $('#Status').html("Empty Node Cannot be inserted here becuase previous rowspan allocation is taking up the space");
             }
             break;
       
           case 2:
             if (O2 < 0) {
               if (trcounter < 7) {
    
                 $('#Schedule tr:last ').append("<td ></td>");
    
               } else {
               //  $('#Schedule').append("<tr> </tr>");
                 $('#Schedule tr:last').append("<td ></td>");
               }
              
             } else {
               O2 = O2 - 1;
              // alert(O1);
               if (O2 == 0) {
                 O2 = -1;
               }
                            $('#Status').html("Empty Node Cannot be inserted here becuase previous rowspan allocation is taking up the space");
             }
             break;
           case 3:
             if (O3 < 0) {
               if (trcounter < 7) {
    
                 $('#Schedule tr:last ').append("<td ></td>");
    
               } else {
               //  $('#Schedule').append("<tr> </tr>");
                 $('#Schedule tr:last').append("<td ></td>");
               }
              
             } else {
               O3 = O3 - 1;
              // alert(O1);
               if (O3 == 0) {
                 O3 = -1;
               }
                          $('#Status').html("Empty Node Cannot be inserted here becuase previous rowspan allocation is taking up the space");
             }
             break;
           case 4:
            if (O4 < 0) {
               if (trcounter < 7) {
    
                 $('#Schedule tr:last ').append("<td ></td>");
    
               } else {
               //  $('#Schedule').append("<tr> </tr>");
                 $('#Schedule tr:last').append("<td ></td>");
               }
              
             } else {
               O4 = O4 - 1;
              // alert(O1);
               if (O4 == 0) {
                 O4 = -1;
               }
                            $('#Status').html("Empty Node Cannot be inserted here becuase previous rowspan allocation is taking up the space");
             }
             break;
           case 5:
             if (O5 < 0) {
               if (trcounter < 7) {
    
                 $('#Schedule tr:last ').append("<td ></td>");
    
               } else {
               //  $('#Schedule').append("<tr> </tr>");
                 $('#Schedule tr:last').append("<td ></td>");
               }
              
             } else {
               O5 = O5 - 1;
              // alert(O1);
               if (O5 == 0) {
                 O5 = -1;
               }
                              $('#Status').html("Empty Node Cannot be inserted here becuase previous rowspan allocation is taking up the space");
             }
             break;
           case 6:
             if (O6 < 0) {
               if (trcounter < 7) {
    
                 $('#Schedule tr:last ').append("<td ></td>");
    
               } else {
               //  $('#Schedule').append("<tr> </tr>");
                 $('#Schedule tr:last').append("<td ></td>");
               }
              
             } else {
               O6 = O6 - 1;
              // alert(O1);
               if (O6 == 0) {
                 O6 = -1;
               }
                           $('#Status').html("Empty Node Cannot be inserted here becuase previous rowspan allocation is taking up the space");
             }
             break;
    
         }
         if (trcounter == 7) {
           trcounter = 1;
            $('#Schedule').append("<tr> </tr>");
           $('#Status').html("REACHED SATURDAY MOVING ON TO NEXT TIME SLOT");
         } else {
           trcounter++;
         }
    
    
       }else{
        alert("Either Enter Y or N (Y >Allocate td with class N > Go to Next day)");
       }
    
    
     });
    .red {
      background: red;
    }
    table{border:1px black solid;width:100%;}
    td{width:16.66%;
    max-width:16.66%;
    height:50px;
    }
    #Status{
      
      Color:cyan;
    }
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
    <p>
      This is a dummy showing how to avoid butted out tds so for adding a rows span enter y else n and click proceed
    
    </p>
    <p id="Status">
    
    </p>
    <input id="YorN" type="text" />
    <input type="button" id="sbt" value="Proceed  " />
    <table>
    <tr>
        <td>
          Monday</td>
        <td>
          Tuesday</td>
        <td>
          Wednesday</td>
        <td>
          Thursday</td>
        <td>
          Friday</td>
        <td>
          Saturday</td>
      </tr>
    
    </table>
    </table>
    <table id="Schedule">
      <tr></tr>
    </table>