동적 콘텐츠와 함께 Thickbox를 사용하는 방법이 있습니까?

StackOverflow https://stackoverflow.com/questions/257801

  •  06-07-2019
  •  | 
  •  

문제

시나리오는 다음과 같습니다.

웹 페이지에 텍스트 상자와 버튼이 있습니다. 버튼을 클릭하면 텍스트 상자에 입력 된 값과 일치하는 모든 항목이 표시되는 팝업 창이 열리기를 원합니다 (Thickbox 사용). 현재 Thickbox의 iframe 구현을 사용하고 있습니다. 문제는 표시 할 URL이 버튼의 "Alt '속성으로 하드 코딩된다는 것입니다. 실제로 필요한 것은"Alt "속성이 텍스트 상자의 값을 팝업으로 전달하는 것입니다.

지금까지 코드는 다음과 같습니다.

<input type="textbox" id="tb" />
<input alt="Search.aspx?KeepThis=true&TB_iframe=true&height=500&width=700" class="thickbox" title="Search" type="button" value="Search" />

이상적으로는 TextBox 값을 Search.aspx URL에 넣고 싶지만 어떻게 해야하는지 알 수는 없습니다. 현재 대안은 jQuery를 사용하여 검색 버튼의 클릭 함수를 설정하여 ASP.NET 세션에서 일부 값을 설정하는 웹 서비스를 호출하는 것입니다. Search.aspx 페이지는 세션 변수를 사용하여 검색을 수행합니다. 그러나 세션 변수가 설정되기 전에 검색이 실행될 가능성이 항상있는 것처럼 보이기 때문에 이것은 약간 벗겨집니다.

도움이 되었습니까?

해결책

버튼의 켜기를 처리하기 만하면 호출되는 기능을 실행하십시오. tb_show(), 텍스트 상자의 값을 전달합니다. 같은 것

... onclick = "doSearch()" ...

function doSearch()
{
    tb_show(caption, 'Search.aspx?KeepThis=true&q=\"' +
            $('input#tb').val() +
            '\"&TB_iframe=true&height=500&width=700');
}

다른 팁

iframe 컨텐츠 섹션에서 매뉴얼을 읽으면 매개 변수가 TB_IFRAME 매개 변수보다 먼저 가야 함을 알려줍니다. 이 후에 모든 것이 제거됩니다.

여기 아이디어가 있습니다. 나는 그것이 매우 예쁘다고 생각하지 않지만 작동해야합니다.

$('input#tb').blur(function(){ 
  var url = $('input.thickbox').attr('alt');
  var tbVal = $(this).val();

  // add the textbox value into the query string here
  // url = ..

  $('input.thickbox').attr('alt', url);

});

기본적으로 텍스트 상자가 초점을 잃을 때마다 버튼 alt 태그를 업데이트합니다. 대신, 당신은 또한 주요 스트로크를 듣고마다 업데이트 할 수도 있습니다.

쿼리 문자열을 업데이트하는 한 가장 좋은 방법을 알아낼 수 있습니다. & tb = tb_placeholder와 같은 자리 표시자를 거기에 넣는 것을 볼 수 있습니다. 그런 다음 문자열 교체를 할 수 있습니다.

에서 코드-하인 대체 태그를 대중적으로 추가 할 수도 있습니다.

button1.Attributes.Add("alt", "Search.aspx?KeepThis=true&TB_iframe=true&height=500&width=700");
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top