2017-09-20 1 views
-1

나는 개발중인 웹 앱에서 뭔가를 구현할 수있는 방법에 대한 몇 가지 아이디어를 얻고 싶습니다.아이디어는 사용자 선택에 따라 동적 양식을 미리 채울 수 있습니까?

시나리오 : 사용자가 동적으로

[table] 
     [1st row] [input 1] [input 2] [X - delete] 
     [2nd row] [input 1] [input 2] [X - delete] 
     ... 
     [add new row] 

내가 드롭 다운 선택이 select box 추가 할 테이블에 입력 행을 추가/삭제하는 옵션으로 HTML5 양식을 발견 동적 양식을 사전을 채 웁니다 선택에 따라 행/입력 값.

저는 주로 클라이언트 측 스크립팅과 약간의 PHP에 익숙하지만 최근에 node.js를 배우기 시작했습니다. 나는 mysql 데이터베이스를 가지고 있지만 앞으로 나아갈 수있는 최선의 방법이 확실하지 않다.

나를 위해 코드를 작성 하시겠습니까? 이 유형의 사용자 기능을 어떻게 개념화 할지를 알고 싶습니다. 그래서 이것을 학습 프로젝트로 만들 수 있습니다.

언제나처럼 감사드립니다!

답변

0

한 가지 방법은 : 당신은 조작하려고하는 값 또는 필드에 따라, 그 라인을 따라

<select onchange="functionNameHere(this.options[this.selectedIndex].value"> 
... 
<script> 
const functionNameHere = (value) => { 
    if(value=="Some Option Value"){ 
    document.getElementById("target-field-id").value = "newValue" 
} else if(value=="Other Option Value"){ ...} 
} 
</script> 

또는 무언가 다음 <select> 상자에게 onchange="functionNameHere(this.options[this.selectedIndex].value)" 속성을주고, 다음과 같은 뭔가. setAttribute 또는 심지어 innerHTML의 대상 div, 입력란 또는 입력을 찾고있을 수 있습니다. 동적 다중 선택을 기반으로 필드를 채우려면

또한, 각 선택 필드

+0

오에 대해 서로 다른 onchange를 함수 이름을 가지고 현명 할 것, 그리고 위는 수도 사용자의 환경에 따라 ES6 JS를 사용 'var functionNameHere = function (value) {if ...}'와 같은 고전적인 함수를 원한다. –

관련 문제