#javascript #java #html #user-interface #button
#javascript #java #HTML #пользовательский интерфейс #кнопка
Вопрос:
У меня есть HTML-таблица с несколькими элементами (td-тегами), в каждой строке есть 4 кнопки: «Редактировать», «Удалить», «Переместить вверх» и «Переместить вниз». Кнопки «Переместить вверх» и «Переместить вниз» иногда ведут себя странно, поскольку их действия могут привести к тому, что несколько строк будут иметь одинаковый «item_order» в базе данных MySQL. Таким образом, при попытке переместить другие строки вверх или вниз функции не будут работать должным образом из-за дублирования «item_order» для более чем одной строки. При проверке базы данных я вижу, что многие строки имеют «item_order = 1» или 2 или 5 и так далее
Я бы хотел, чтобы кнопки «Переместить вверх» и «Переместить вниз» продолжали обновлять базу данных MySQL (но, надеюсь, в правильном порядке), А ТАКЖЕ перемещать строки во интерфейсе пользовательского интерфейса, чтобы они отображались в желаемом порядке 1,2,3 … и т.д.
Пожалуйста, будьте терпеливы со мной, потому что я новичок в бизнесе разработки программного обеспечения, и я все еще чему-то учусь. Ниже приведена таблица:
<tr id="tr_<%=String.valueOf(RowCount)%>" onmouseover="showRow(<%=String.valueOf(RowCount)%>)" onmouseout="hideRow(<%=String.valueOf(RowCount)%>)">
<td valign="top" width="200px" class="tablepad tableborder_bottom">(<%=String.valueOf(RowCount)%>) <%=topic%></td>
<td valign="top" width="200px" class="tableborder_left"><%=sub_topic%></td>
<td valign="top" width="280px" class="tableborder_left"><%=item%></td>
<td valign="top" class="tableborder_left"><a href="ad_summary.jsp?action=editamp;rowid=<%=absid%>amp;description=<%=item%>amp;serviceName=<%=sub_topic%>amp;mainHeading=<%=topic%>" target="_top"><img src="./media/images/edit.jpeg" border="0"/></a></td>
<td valign="top" class="tableborder_bottom"><a href="ad_summary.jsp?action=deleteamp;rowid=<%=absid%>amp;description=<%=item%>amp;serviceName=<%=sub_topic%>amp;mainHeading=<%=topic%>" target="_top"><img src="./media/images/delete.jpeg" border="0"/></a></td>
<td valign="top" class="tableborder_bottom"><a href="ad_summary.jsp?action=move_upamp;rowid=<%=absid%>amp;itemOrder=<%=item_order%>" target="_top"><img src="./media/images/16_arrow_up.png" border="0"/></a></td>
<td valign="top" class="tableborder_bottom"><a href="ad_summary.jsp?action=move_downamp;rowid=<%=absid%>amp;itemOrder=<%=item_order%>" target="_top"><img src="./media/images/16_arrow_down.png" border="0"/></a></td>
</tr>
Вот код Java для обновления базы данных MySQL при использовании кнопки «move_up» или «move_down»:
if (action.equals("move_up")){
action="add";
if (whichOrder != 1){
int CurrentOrder = whichOrder;
int NewOrder = whichOrder - 1;
String sqlString1 = "UPDATE msr_summary_notices set item_order = " String.valueOf(NewOrder) " WHERE item_order = " String.valueOf(CurrentOrder);
String sqlString2 = "UPDATE msr_summary_notices set item_order = " String.valueOf(CurrentOrder) " WHERE item_order = " String.valueOf(NewOrder) " AND absid <>" rowid;
statement1 = conn.prepareStatement(sqlString1);
int RowsAffected1 = (statement1.executeUpdate());
statement1.close();
statement2 = conn.prepareStatement(sqlString2);
int RowsAffected2 = (statement2.executeUpdate());
statement2.close();
}else{
// Do nothing coz you can move up above 1
}
}
if (action.equals("move_down")){
action="add";
if (whichOrder != MaxValue){
int CurrentOrder = whichOrder;
int NewOrder = whichOrder 1;
String sqlString1 = "UPDATE msr_summary_notices set item_order = " String.valueOf(NewOrder) " WHERE item_order = " String.valueOf(CurrentOrder);
String sqlString2 = "UPDATE msr_summary_notices set item_order = " String.valueOf(CurrentOrder) " WHERE item_order = " String.valueOf(NewOrder) " AND absid <>" rowid;
statement1 = conn.prepareStatement(sqlString1);
int RowsAffected1 = (statement1.executeUpdate());
statement1.close();
statement2 = conn.prepareStatement(sqlString2);
int RowsAffected2 = (statement2.executeUpdate());
statement2.close();
}else{
// Do nothing coz you can move down below MaxValue
}
}
Наконец, вот функция JavaScript, которая показывает / скрывает строки при наведении курсора мыши и функциональность для распечатки строк:
<script type="text/javascript">
function showRow(RowId){
var Row = document.getElementById("tr_" RowId);
Row.style.backgroundColor="#CCCCFF";
//console.debug(Row);
}
function hideRow(RowId){
var Row = document.getElementById("tr_" RowId);
Row.style.backgroundColor="#FFFFFF";
}
if ((action.equals("move_up"))||(action.equals("move_down"))){
out.println("showRow(" rowid ")");
//console.log(RowId);
}
</script>
</head>
Я провел много исследований, и я думаю, что проблема может быть в сеансе, который может быть плохо обработан. Кроме того, если «item_order» в БД остается беспорядочным (тот же item_order для нескольких строк) Меня это не слишком беспокоит, поскольку основной ожидаемый результат заключается в том, чтобы пользовательский интерфейс отображал правильный порядок строк.