¿Hay alguna manera de usar Thickbox con contenido dinámico?

Question

Aquí está el escenario:

Tengo un cuadro de texto y un botón en una página web. Cuando se hace clic en el botón, quiero que se abra una ventana emergente (usando Thickbox) que mostrará todos los elementos que coincidan con el valor ingresado en el cuadro de texto. Actualmente estoy usando la implementación IFrame de Thickbox. El problema es que la URL que se muestra está codificada en el atributo "alt" del botón. Lo que realmente necesito es que el atributo "alt" pase el valor en el cuadro de texto a la ventana emergente.

Aquí está el código hasta ahora:

<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" /> 

Idealmente, me gustaría poner el valor de texto en la URL Search.aspx pero me parece que no puede encontrar la manera de hacer que mi actual alternativa es utilizar jQuery para configurar. la función de clic del botón Buscar para llamar a un servicio web que establecerá algunos valores en la sesión ASP.NET. La página Search.aspx usará las variables de sesión para hacer la búsqueda. Sin embargo, esto es un poco escamoso ya que parece como siempre habrá la posibilidad de que el el arco se ejecuta antes de que se establezcan las variables de la sesión.

Answer 1

Simplemente toque el botón de su botón para ejecutar una función que llame al tb_show(), pasando el valor del cuadro de texto. Algo así como

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

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

Answer 2

Aquí hay una idea. No creo que es muy bonita, pero debería funcionar:

$('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); 

}); 

Básicamente, se actualiza la etiqueta alt botón cada vez que el cuadro de texto pierde el foco. En su lugar, también puede escuchar los trazos de tecla y actualizar después de cada uno.

En cuanto a la actualización de la cadena de consulta, le dejaré averiguar la mejor manera. Puedo ver poner un marcador de posición allí como: & TB = TB_PLACEHOLDER. Entonces puedes simplemente reemplazar una cadena.

Answer 3

En el code-behind también se puede simplemente añadir la etiqueta alt progammatically,

button1.Attributes.Add("alt", "Search.aspx?KeepThis=true&TB_iframe=true&height=500&width=700"); 

Answer 4

Si lee el manual, en la sección de contenido iframe, que le dice que sus parámetros tienen que ir antes del parámetro TB_iframe. Todo después de esto se despoja.