응용 프로그램의 개발 에서 일부 입력 정 보 는 동태 적 인 것 이다.예 를 들 어 우 리 는 한 직원 의 업무 경력 을 등록 해 야 한다.예 를 들 어 다음 그림 이다. 죽은 것 으로 만 들 면 세 개 만 쓸 수 있 고 네 개 라면?또는 더 많은 것 은 추가 할 수 없 는 것 이 아 닙 니까?그래서 이렇게 하 는 것 도 좋 지 않 습 니 다.우 리 는 표 줄 을 동적 으로 추가 하여 실현 할 수 있 습 니 다.다음 그림 에서 한 줄 을 추가 하고 한 줄 의 정 보 를 입력 하 는 것 이 비교적 유연 합 니 다. asp 와 asp.net 에서 자바 script 을 결합 하여 이 효 과 를 실현 하 는 방법 을 살 펴 보 겠 습 니 다. 우선,동적 추가 표 는 프론트 데스크 에서 이 루어 져 야 합 니 다.물론 백 스테이지 도 가능 하지만 ajax 를 사용 해 야 할 수도 있 습 니 다.귀 찮 으 므 로 자바 script 으로 이 루어 지 는 것 이 좋 습 니 다.다음은 동적 추가 표 줄 의 두 가지 방식 을 소개 합 니 다. 첫 번 째:소스 코드 Javascript:
<script type="text/javascript">
/**//*This function is use to add one row dynamicly
* tabObj : Target table
* colNum: The number of columns that of a row in table
* sorPos: The source of the new row.
* targPos: The position where the new row will be added.
*
*/
function addRow(tabObj,colNum,sorPos,targPos){
var nTR = tabObj.insertRow(tabObj.rows.length-targPos); // Insert a new row into appointed table on the
//appointed position.
var TRs = tabObj.getElementsByTagName('TR'); // Get TRs collection from the appointed table
var sorTR = TRs[sorPos]; // Positioned the sorTR
var TDs = sorTR.getElementsByTagName('TD'); // Get TDs collection from the appointed row
if(colNum==0 || colNum==undefined || colNum==isNaN){
colNum=tabObj.rows[0].cells.length;
}
var ntd = new Array(); // Create a new TDs array
for(var i=0; i< colNum; i++){ // Traverl the TDs in row
ntd[i] = nTR.insertCell(); // Create new cell
ntd[i].id = TDs[0].id; // copy the TD's id to new cell. | Attention! The TDs's
//suffix must be appointed
ntd[i].innerHTML = TDs[i].innerHTML; // copy the value in ntd[i]'s innerHTML from corresponding TDs
}
}
/**//* This function is use to remove appointed row in appointed table
* tabObj: the appointed table
* targPos: target row position
* btnObj: currently clicked delete image button
*
*/
function deleteRow(tabObj,targPos,btnObj){ //Remove table row
for(var i =0; i<tabObj.rows.length;i++){
if(tabObj.getElementsByTagName('img')[i]==btnObj){
tabObj.deleteRow(i+targPos);
}
}
}
</script>
여기 서 주의해 야 할 것 이 있 습 니 다:는 주로 데 이 터 를 추가 할 때 텍스트 상자 의 값 이 비어 있 습 니 다.그렇지 않 으 면 추 가 된 새 줄 이 모두 값 이 있 습 니 다.이것 은 좋 지 않 습 니 다.물론 읽 는 것 이 빈 값 이지 않도록 뒤에서 데이터 그룹 을 얻 을 때 색인 1 부터 값 을 얻 습 니 다.이것 은 뒤에서 설명 합 니 다. 두 번 째 방식: JavaScript
<script type="text/javascript">
function addRow()
{
var root = document.getElementById("tbody")
var allRows = root.getElementsByTagName('tr');
var allCells = allRows[0].getElementsByTagName('td');
var newRow = root.insertRow();
var newCell0 = newRow.insertCell();
var newCell1 = newRow.insertCell();
var newCell2 = newRow.insertCell();
var newCell3 = newRow.insertCell();
newCell0.innerHTML = allCells[0].innerHTML;
newCell1.innerHTML = allCells[1].innerHTML;
newCell2.innerHTML = allCells[2].innerHTML;
newCell3.innerHTML = allCells[3].innerHTML;
}
function removeRow(r)
{
var root = r.parentNode;
root.deleteRow(r);
}
</script>
메모:첫 번 째 기본 과 유사 합 니 다.기본 적 인 상황 에서 한 줄 이 있 기 를 원한 다 면 정적 으로 한 줄 을 추가 할 수 있 습 니 다. 배경 을 통 해 추가 줄 에 대한 수정,삭제,추가 등 작업 을 수행 하 는 방법 을 살 펴 보 겠 습 니 다. 일단 데이터베이스 에 대해 서 얘 기해 볼 게 요. 이런 동태 적 으로 추가 해 야 할 표 줄 의 기록 에 대해 우 리 는 다시 한 표 에 넣 어야 한다.바로 하나의 표를 만 드 는 것 이다.예 를 들 어 위 에서 말 한 업무 경력 의 문 제 는 당연 하 다.직원 은 직원 표,이름,나이,신분증,학력 등 정 보 를 기록 해 야 한다.업무 경력 에 대해 따로 업무 경력 표를 만들어 야 한다.그 다음 에 외부 키 에 따라 그들 간 의 관 계 를 구축 하 는 것 은 데이터 베이스 방면 의 디자인 이다. asp 에서 어떻게 이 루어 지 는 지 살 펴 보 겠 습 니 다. 추가 작업: 코드:
메모:여기 서 우 리 는 request("username")를 통 해 username 열의 배열 값 을 직접 얻 을 수 있 습 니 다.디 버 깅 을 통 해 첫 번 째(색인 0)값 은","이 므 로 값 을 얻 을 때 우 리 는 색인 1 부터 읽 은 다음 에 하나씩 조작 을 추가 하면 됩 니 다. 수정: 먼저 외부 키 순환 에 따라 데 이 터 를 표 에 읽 습 니 다.코드:
내 생각 은 이전에 추 가 된 기록 과 현재 추가 할 기록 줄 을 분리 해서 조작 하 는 것 이다.만약 에 우리 가 기록 줄 을 삭제 하거나 기록 줄 을 수정 하려 면 이렇게 조작 할 수 있다. 먼저 기록 을 삭제 한 다음 에 이전의 기록 과 현재 의 기록 을 다시 추가 합 니 다.코드 와 추 가 된 사고방식 은 같 습 니 다.다만 이 안에 두 개 로 나 누 어 추 가 된 구체 적 인 코드 를 완성 할 수 있 습 니 다.여러분 스스로 시도 해 보 세 요. asp.net 에서 어떻게 실현 되 는 지 살 펴 보 겠 습 니 다. asp.net 자체 의 컨트롤 패 키 징 모드 를 사용 하면 실현 하기 어렵 기 때문에 위 에서 말 한 asp 사상 으로 완성 할 수 있 습 니 다. js 와 html 는 모두 같 습 니 다.다른 것 은 배경 코드 입 니 다. 예 를 들 면 추가.
여기 서 우 리 는 Request[username]을 사용 하여 값 을 얻 습 니 다.페이지 는 html 라벨 을 사용 합 니 다.서버 의 컨트롤 이 아니 라.value 나 Text 를 사용 하지 않 아 도 됩 니 다.그러면 asp 나 jsp 의 사상 으로 처리 할 수 있 습 니 다. 마찬가지 로 수정 과 삭제 도 asp 나 jsp 의 사상 으로 처리 할 수 있다. 또는 제출 부터 처리 까지 jsp 와 asp 의 사상 을 완전히 사용 하여 HttpHandler 를 만 들 고 데 이 터 를 모두 여기에 제출 하여 처리 하 는 것 도 좋 지만 첫 번 째 방법 이 좋 습 니 다.이렇게 하면 값 을 얻 고 처리 하기 쉬 우 며 변환 할 필요 가 없습니다. 구체 적 인 문 제 는 구체 적 으로 다 루어 야 한다.예 를 들 어 기본 값 이 필요 하면 한 줄 이 있다.이 럴 때 직원 표 에 업무 기록 필드 를 추가 해 야 한다.이 줄 의 기록 은 모두 직원 표 에 추가 한 다음 에 편집 하고 삭제 할 때 먼저 편집 한 다음 에 두 개의 추 가 를 해 야 한다. 대체로 데이터 줄 을 추가 하 는 사고방식 이 이렇다.무슨 문제 가 있 으 면 여러분 이 지적 해 주시 기 바 랍 니 다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
