Fix: disable unused input, buttons

This commit is contained in:
2018-07-03 18:25:04 +09:00
parent cec8e18470
commit 3f97b1eac3
4 changed files with 53 additions and 42 deletions
+10 -14
View File
@@ -41,50 +41,46 @@
vertical-align: top; vertical-align: top;
} }
#registered_player_list { .player_list {
list-style: none; list-style: none;
} }
#registered_player_list { .player_list > li > span {
list-style: none;
}
#registered_player_list > li > span {
line-height: normal; line-height: normal;
} }
#registered_player_list > li > .player_id { .player_list > li > .player_id {
display: none; display: none;
} }
#registered_player_list .player_id { .player_list .player_id {
background-color: #ffffff; background-color: #ffffff;
} }
#registered_player_list .player_name { .player_list .player_name {
width: 200px; width: 200px;
background-color: #ffdddd; background-color: #ffdddd;
} }
#registered_player_list .player_entercode { .player_list .player_entercode {
width: 200px; width: 200px;
background-color: #ddffdd; background-color: #ddffdd;
} }
#registered_player_list .registered_player_update { .player_list .player_update {
width: 200px; width: 200px;
background-color: #ddddff; background-color: #ddddff;
} }
#player_list_navigator { .player_list_navigator {
text-align: center; text-align: center;
} }
#player_list_navigator > span { .player_list_navigator > span {
line-height: normal; line-height: normal;
} }
#player_list_navigator a { .player_list_navigator > span > a {
cursor: pointer; cursor: pointer;
} }
+17 -6
View File
@@ -15,7 +15,7 @@ class PlayerList {
constructor(parent) { constructor(parent) {
let self = this; let self = this;
this.listParent = parent; this.listParent = parent;
// console.log(parent); console.log(parent);
let id_list = parent.find(".player_id"); let id_list = parent.find(".player_id");
// console.log(id_list); // console.log(id_list);
@@ -30,6 +30,8 @@ class PlayerList {
$(id_list[i]).siblings(".player_delete") $(id_list[i]).siblings(".player_delete")
); );
this.disableItem(this.listRows[i]);
$(id_list[i]).siblings(".player_edit").click(function() { $(id_list[i]).siblings(".player_edit").click(function() {
self.editPlayer(this); self.editPlayer(this);
}) })
@@ -42,11 +44,20 @@ class PlayerList {
} }
} }
disableItem(item) {
$(item.playerID).empty();
$(item.playerName).prop("disabled", true);
$(item.enterCode).prop("disabled", true);
$(item.editButton).prop("disabled", true);
$(item.deleteButton).prop("disabled", true);
}
updatePlayerList(jsonData) { updatePlayerList(jsonData) {
// console.log(jsonData); // console.log(jsonData);
for(let i = 0; i < 10; i++) { for(let i = 0; i < 10; i++) {
$(this.listRows[i].playerID).empty(); // $(this.listRows[i].playerID).empty();
this.disableItem(this.listRows[i]);
if(i < jsonData.length) { if(i < jsonData.length) {
$(this.listRows[i].playerID).append(jsonData[i]["UserID"]); $(this.listRows[i].playerID).append(jsonData[i]["UserID"]);
@@ -61,13 +72,13 @@ class PlayerList {
$(this.listRows[i].deleteButton).prop("disabled", false); $(this.listRows[i].deleteButton).prop("disabled", false);
} else { } else {
$(this.listRows[i].playerName).val(""); $(this.listRows[i].playerName).val("");
$(this.listRows[i].playerName).prop("disabled", true); // $(this.listRows[i].playerName).prop("disabled", true);
$(this.listRows[i].enterCode).val(""); $(this.listRows[i].enterCode).val("");
$(this.listRows[i].enterCode).prop("disabled", true); // $(this.listRows[i].enterCode).prop("disabled", true);
$(this.listRows[i].editButton).prop("disabled", true); // $(this.listRows[i].editButton).prop("disabled", true);
$(this.listRows[i].deleteButton).prop("disabled", true); // $(this.listRows[i].deleteButton).prop("disabled", true);
} }
} }
} }
@@ -1,7 +1,7 @@
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function() { $(document).ready(function() {
addPlayerList = new PlayerList($("#registered_player_list")); addPlayerList = new PlayerList($("#add_player_list"));
addPlayerListNavigator = new PlayerListNavigator($("#page_no_area")); addPlayerListNavigator = new PlayerListNavigator($("#add_player_list_navigator > #page_no_area"));
loadPlayerList(); loadPlayerList();
addPlayerListNavigator.addPlayerListPages(); addPlayerListNavigator.addPlayerListPages();
@@ -50,7 +50,7 @@ $(document).ready(function() {
<span id="search_result"> <span id="search_result">
학생 목록 학생 목록
<div id="player_list_result_contents"> <div id="player_list_result_contents">
<ul id="registered_player_list"> <ul id="add_player_list" class="player_list">
<li> <li>
<span class="player_name">이름</span> <span class="player_name">이름</span>
<span class="player_entercode">입장 코드</span> <span class="player_entercode">입장 코드</span>
@@ -129,7 +129,7 @@ $(document).ready(function() {
</ul> </ul>
</div> </div>
<div id="player_list_navigator"> <div id="add_player_list_navigator" class="player_list_navigator">
<span><a onClick="onClickPlayerListPage('first')"></a></span> <span><a onClick="onClickPlayerListPage('first')"></a></span>
<span><a onClick="onClickPlayerListPage('prev')"> </a></span> <span><a onClick="onClickPlayerListPage('prev')"> </a></span>
<span id="page_no_area"></span> <span id="page_no_area"></span>
+21 -17
View File
@@ -1,6 +1,7 @@
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function() { $(document).ready(function() {
searchPlayerList = new PlayerList($("#search_player_list")); searchPlayerList = new PlayerList($("#search_player_list"));
searchPlayerListNavigator = new PlayerListNavigator($("#search_player_list_navigator > #page_no_area"));
}); });
</script> </script>
@@ -12,18 +13,21 @@ $(document).ready(function() {
<input type="text" id="search_name"><button>찾기</button><br/> <input type="text" id="search_name"><button>찾기</button><br/>
<br/> <br/>
<!--
<h3>검색 결과</h3> <h3>검색 결과</h3>
학생 이름 학생 이름
<input type="text" id="result_name"><button>삭제</button><br/> <input type="text" id="result_name"><button>삭제</button><br/>
입장 코드 입장 코드
<input type="text" id="result_entercode"><button>수정</button> <input type="text" id="result_entercode"><button>수정</button>
-->
</span> </span>
<span id="search_result"> <span id="search_result">
검색 결과 검색 결과
<div id="player_list_result_contents"> <div id="player_list_result_contents">
<ul id="search_player_list"> <ul id="search_player_list" class="player_list">
<li> <li>
<span class="player_name">이름</span> <span class="player_name">이름</span>
<span class="player_entercode">입장 코드</span> <span class="player_entercode">입장 코드</span>
@@ -34,79 +38,79 @@ $(document).ready(function() {
<input type='text' value="" class="player_name"> <input type='text' value="" class="player_name">
<input type='text' value="" class="player_entercode"> <input type='text' value="" class="player_entercode">
<input type='button' class="player_edit" value='수정'> <input type='button' class="player_edit" value='수정'>
<input type='button' value='삭제'> <input type='button' class="player_delete" value='삭제'>
</li> </li>
<li class="search_result_list"> <li class="search_result_list">
<span class="player_id"></span> <span class="player_id"></span>
<input type='text' value="" class="player_name"> <input type='text' value="" class="player_name">
<input type='text' value="" class="player_entercode"> <input type='text' value="" class="player_entercode">
<input type='button' class="player_edit" value='수정'> <input type='button' class="player_edit" value='수정'>
<input type='button' value='삭제'> <input type='button' class="player_delete" value='삭제'>
</li> </li>
<li class="search_result_list"> <li class="search_result_list">
<span class="player_id"></span> <span class="player_id"></span>
<input type='text' value="" class="player_name"> <input type='text' value="" class="player_name">
<input type='text' value="" class="player_entercode"> <input type='text' value="" class="player_entercode">
<input type='button' class="player_edit" value='수정'> <input type='button' class="player_edit" value='수정'>
<input type='button' value='삭제'> <input type='button' class="player_delete" value='삭제'>
</li> </li>
<li class="search_result_list"> <li class="search_result_list">
<span class="player_id"></span> <span class="player_id"></span>
<input type='text' value="" class="player_name"> <input type='text' value="" class="player_name">
<input type='text' value="" class="player_entercode"> <input type='text' value="" class="player_entercode">
<input type='button' class="player_edit" value='수정'> <input type='button' class="player_edit" value='수정'>
<input type='button' value='삭제'> <input type='button' class="player_delete" value='삭제'>
</li> </li>
<li class="search_result_list"> <li class="search_result_list">
<span class="player_id"></span> <span class="player_id"></span>
<input type='text' value="" class="player_name"> <input type='text' value="" class="player_name">
<input type='text' value="" class="player_entercode"> <input type='text' value="" class="player_entercode">
<input type='button' class="player_edit" value='수정'> <input type='button' class="player_edit" value='수정'>
<input type='button' value='삭제'> <input type='button' class="player_delete" value='삭제'>
</li> </li>
<li class="search_result_list"> <li class="search_result_list">
<span class="player_id"></span> <span class="player_id"></span>
<input type='text' value="" class="player_name"> <input type='text' value="" class="player_name">
<input type='text' value="" class="player_entercode"> <input type='text' value="" class="player_entercode">
<input type='button' class="player_edit" value='수정'> <input type='button' class="player_edit" value='수정'>
<input type='button' value='삭제'> <input type='button' class="player_delete" value='삭제'>
</li> </li>
<li class="search_result_list"> <li class="search_result_list">
<span class="player_id"></span> <span class="player_id"></span>
<input type='text' value="" class="player_name"> <input type='text' value="" class="player_name">
<input type='text' value="" class="player_entercode"> <input type='text' value="" class="player_entercode">
<input type='button' class="player_edit" value='수정'> <input type='button' class="player_edit" value='수정'>
<input type='button' value='삭제'> <input type='button' class="player_delete" value='삭제'>
</li> </li>
<li class="search_result_list"> <li class="search_result_list">
<span class="player_id"></span> <span class="player_id"></span>
<input type='text' value="" class="player_name"> <input type='text' value="" class="player_name">
<input type='text' value="" class="player_entercode"> <input type='text' value="" class="player_entercode">
<input type='button' class="player_edit" value='수정'> <input type='button' class="player_edit" value='수정'>
<input type='button' value='삭제'> <input type='button' class="player_delete" value='삭제'>
</li> </li>
<li class="search_result_list"> <li class="search_result_list">
<span class="player_id"></span> <span class="player_id"></span>
<input type='text' value="" class="player_name"> <input type='text' value="" class="player_name">
<input type='text' value="" class="player_entercode"> <input type='text' value="" class="player_entercode">
<input type='button' class="player_edit" value='수정'> <input type='button' class="player_edit" value='수정'>
<input type='button' value='삭제'> <input type='button' class="player_delete" value='삭제'>
</li> </li>
<li class="search_result_list"> <li class="search_result_list">
<span class="player_id"></span> <span class="player_id"></span>
<input type='text' value="" class="player_name"> <input type='text' value="" class="player_name">
<input type='text' value="" class="player_entercode"> <input type='text' value="" class="player_entercode">
<input type='button' class="player_edit" value='수정'> <input type='button' class="player_edit" value='수정'>
<input type='button' value='삭제'> <input type='button' class="player_delete" value='삭제'>
</li> </li>
</ul> </ul>
</div> </div>
<div id="player_list_navigator"> <div id="search_player_list_navigator" class="player_list_navigator">
<span><a onClick="onClickPlayerListPage('first')"> << </a></span> <span><a onClick="onClickPlayerListPage('first')"> </a></span>
<span><a onClick="onClickPlayerListPage('prev')"> < </a></span> <span><a onClick="onClickPlayerListPage('prev')"> </a></span>
<span id="player_list_pages"></span> <span id="page_no_area"></span>
<span><a onClick="onClickPlayerListPage('next')"> > </a></span> <span><a onClick="onClickPlayerListPage('next')"> </a></span>
<span><a onClick="onClickPlayerListPage('last')"> >> </a></span> <span><a onClick="onClickPlayerListPage('last')"> </a></span>
</div> </div>
</span> </span>