텍스트 상자에 값을 표시하는 jquery 도움말

Question

내 응용 프로그램에서 사용자가 눈금을 열고 옵션을 선택합니다. 사용자가 "질문 추가"버튼을 클릭하면 옵션을 선택한 후 텍스트 상자에 옵션 값을 보여주는 새 행을 표에 추가합니다.

이제는 사용자가 마음을 바꾸고 추가 한 테이블 행에서 옵션 값을 변경하고 싶다고 말하면 사용자는 테이블 행에서 "Open Grid"링크를 클릭하여 그리드를 열 수 있습니다. 또 다른 옵션. 유일한 문제는 선택한 옵션이 테이블 행에있는 텍스트 상자에 표시되어야하지만 실제로는 사용자가 원래 옵션을 선택하는 맨 위에있는 텍스트 상자에 표시된다는 것입니다.

그래서 사용자가 테이블 행 내에서 옵션을 변경하면 그 값이 텍스트 상자가 아닌 행 내의 텍스트 상자에 표시되도록하려면 어떻게해야합니까?

단계가 당신을 도와 내 바이올린에 따라 :

1. 열기 그리드 선택 옵션을 "질문 추가"의 "3"

2. 클릭, 당신은 새로운 행이되었습니다 볼 수 있습니다 추가 한 옵션을 텍스트 상자에 표시했습니다.

3. 이제 새 행에서 "Open Grid"링크를 클릭하고 "5"옵션을 선택했습니다. 이제 테이블 행의 텍스트 상자가 여전히 "3"이라고 표시되어 있지만 상단의 텍스트 상자를 보면 "5"가 표시됩니다. 맨 위에있는 텍스트 상자가 "5"로 변경되면 안되며, 테이블 행에있는 텍스트 상자 여야합니다. 당신이 무슨 뜻인지 볼 수 있습니다 당신은 당신의 아이디어를 테스트하는 데 사용할 수 있도록

모든 here

Answer 1

먼저 클릭 jsfiddle를 사용하여, 당신은 후 일치하는 요소의 집합을 숨길 필요가 없습니다 그들을 밖으로 페이딩. 참조 :

$('body').on('click', function() { 
    $('#optionTypeTbl').fadeOut('slow'); 
    $('#optionTypeTbl').hide(); 
}); 

그때 나는 개인적으로 코드가 더 나을 수 있다고 생각. 기본적으로 옵션 테이블은 고정 요소로 사용됩니다. 그러나 실제로 페이드 아웃이 끝나면 스크립트를 제거 할 수도 있습니다. 물론 스크립트 내 변수에 그대로두고 [Open Grid]를 클릭하여 추가 할 수도 있습니다. (나는 아직도 내가 바로 샘플을 제공 할 수 없습니다 전체 코드를 통과하지 않았습니다. 나에게 그 약간의 시간을 준다.) 그럼, 대신 당신은 지금 당신의 옵션 테이블을 만든 이후

$('#optionTypeTbl input').click(function() { 
    $(".gridBtns").removeClass("gridBtnsOn"); 
    $(this).addClass("gridBtnsOn"); 
    // THIS FOLLOWING LINE 
    $('.box INPUT').val($(this).val()); 
    $('#optionTypeTbl').hide(); 
}); 

를 사용하는 클릭 된 [열기 그리드] 링크의 부모의 자식, 당신은 다음과 같이 closest를 사용하여 부모를 참조 할 수 있습니다 :

$(this).closest('tr').find('.box input').val($(this).val()); 

는 솔직히 말해서, 나는의 큰 부분을 변경하지 않고 문제를 해결할 수없는 당신의 행동. 내 버전의 코드를 수정하는 데 약간의 시간이 필요합니다.

EDITH :

좋아

, 그래서 당신의 바이올린에 근무하고 작업 조각 해낸했습니다. Here 당신은 간다!