콤보 박스에서 봄 MVC로 옵션을 선택하는 방법

Question

내 첫 번째 게시물 :) 콤보 상자의 옵션을 선택하고 싶습니다.이 옵션을 사용하면 레이블 하나 또는 다른 하나를 인쇄하고 싶습니다. 예를 들어 내가 선택한 경우 옵션 -> DNI 레이블 DNI 것 : 나는 놈 브레 것 라벨 브레 옵션 ->을 선택한 경우 나 :

<div class="campos"> 
    <div class="campo"> 
     <form:label path="buscarPor">Buscar Por:</form:label> 
     <div> 
      <select name="buscarPor" id="buscarPor"> 
       <option value="dni">DNI</option> 
       <option value="nombre">Nombre</option> 
       <option value="Departamento">Departamento</option> 
       <option value="Área de Conocimiento">Área de Conocimiento</option> 
      </select> 
     </div> 



    <script type="text/javascript"> 
    function cargarLabel(){ 
     var seleccionado = $(this).val(); 
     if(seleccionado == 'dni'){ 

      $('#seleccion').html('<div class="campo">'+'<form:label path="seleccion">DNI:</form:label>'+ 
        '<div>'+'<form:input path="seleccion"/>'+'<form:errors path="seleccion"/>'+'</div>'+'</div>'); 
     }if(seleccionado == 'nombre'){ 

      $('#seleccion').html('<div class="campo">'+'<form:label path="seleccion">Nombre:</form:label>'+ 
        '<div>'+'<form:input path="seleccion"/>'+'<form:errors path="seleccion"/>'+'</div>'+'</div>'); 
     } 
    } 

    $(function() { 
     $('#buscarPor').change(cargarLabel); 
    }); 

    </script> 
    </div> 

    <div class="campo"> 
    <form:label path="seleccion">??</form:label> 
     <div> 
      <form:input path="seleccion"/> 
      <form:errors path="seleccion"/> 
     </div> 
    </div> 

Answer 1

것부터 먼저, <form:label path="buscarPor">Buscar Por:</form:label> 다른 뭔가의 path 속성을 변경 . 스프링 태그 라이브러리는 동일한 값의 id 속성을 생성하며 select 태그의 id 속성과 직접 충돌합니다. 그것이 현재 코드에서 jquery가 select 태그 대신 label 태그를 선택하고 change 이벤트를 바인딩하는 이유입니다.

이 문제에 접근하는 정확한 방법은 JSFiddle입니다. 나는 당신의 접근 방식이 너무 장황하다고 생각하며 모든 if/else 블록을 피함으로써 자신을 호의적으로 다룰 수 있습니다.