Archive Page 2

Mantener la posición en un Treeview con ASP.Net y ASP.Net Ajax después de un postback

En este post veremos como mantener a la vista la posición actual de un nodo elegido en un treeview después de que este ha sido seleccionado y que por lo tanto se produce un postback.

Lo he traducido en parte y creo que mejorado de un artículo que leí en developer.com

Si no se han dado cuenta, después de elegir un nodo en el treeview y al producirse dicho postback, el treeview vuelve a a posicionarse en el primer nodo superior del mismo, si el elegido no cabe en pantalla, pues ¿que sucedera?, pues que no se verá.

Veremos como solucionarlo tanto con ASP.Net como con ASP.Net Ajax.
Lo lograremos gracias a ejecutar un código javascript cada vez que se realice el postback.

 Veamos primero dos imágenes que muestran lo que sucede sin dicho código javascript.

Después de elegir nodo se reposiciona el treeview en su lado superior.

ASP.Net
El código asp.net es bien sencillo, simplemente ponemos el treeview dentro de un panel y en la sección body cargamos el script en cuestión.

<body onload=”CargarScriptLoad()”>
<form id=”form1″ runat=”server”>
<div>
<asp:Panel ID=”Panel1″ runat=”server”>
<asp:TreeView ID=”TreeView1″ runat=”server”>
</asp:TreeView>
</asp:Panel>
</div>
</form>

Y en el codebehind.

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
‘ CARGA TODOS LOS EVENTOS DE INICIO
Me.CargarEventosInicio()

If Me.Page.IsPostBack Then Return

Me.RellenarTreeView()
End Sub

Public Sub CargarEventosInicio()
Me.SriptsLoad()
End Sub
Private Sub RellenarTreeView()
‘ RELLENA TREEVIEW DE EJEMPLO
Me.TreeView1.Nodes.Clear()

Dim _Nodo1 As New TreeNode(“Nodo 1”)
Me.TreeView1.Nodes.Add(_Nodo1)
Dim _Nodo2 As New TreeNode(“Nodo 2”)
Me.TreeView1.Nodes.Add(_Nodo2)
Dim _Nodo3 As New TreeNode(“Nodo 3”)
Me.TreeView1.Nodes.Add(_Nodo3)
Dim _Nodo4 As New TreeNode(“Nodo 4”)
Me.TreeView1.Nodes.Add(_Nodo4)
Dim _Nodo5 As New TreeNode(“Nodo 5”)
Me.TreeView1.Nodes.Add(_Nodo5)

Dim I As Integer
For I = 1 To 70
_Nodo1.ChildNodes.Add(New TreeNode(“Nodo 1/ ” + I.ToString()))
_Nodo2.ChildNodes.Add(New TreeNode(“Nodo 2/” + I.ToString()))
_Nodo3.ChildNodes.Add(New TreeNode(“Nodo 3/” + I.ToString()))
_Nodo4.ChildNodes.Add(New TreeNode(“Nodo 4/” + I.ToString()))
_Nodo5.ChildNodes.Add(New TreeNode(“Nodo 5/” + I.ToString()))
Next

Me.TreeView1.CollapseAll()

End SubPublic Sub SriptsLoad()

Dim _Script As New StringBuilder

‘ SCRIPT PARA POSICIONAR TREEVIEW EN EL SELECCIONADO
_Script.Append(“function CargarScriptLoad()”)
_Script.Append(“{{“)
_Script.Append(“try”)
_Script.Append(“{{“)
_Script.Append(“var elem = document.getElementById(‘{0}_SelectedNode’);”)
_Script.Append(“if(elem != null )”)
_Script.Append(“{{“)
_Script.Append(“var node = document.getElementById(elem.value);”)
_Script.Append(“if(node != null)”)
_Script.Append(“{{“)
_Script.Append(“node.scrollIntoView(true);”)
_Script.Append(“{1}.scrollLeft = 0;”)
_Script.Append(“}}”)
_Script.Append(“}}”)
_Script.Append(“}}”)
_Script.Append(“catch(oException)”)
_Script.Append(“{{}}”)
_Script.Append(“}}”)
_Script.Append(“”)
_Script.Append(“”)

Me.Page.ClientScript.RegisterClientScriptBlock(Me.GetType(), “EventoLoad_1”,String.Format(_Script.ToString, TreeView1.ClientID, Panel1.ClientID), True)
End Sub

Esto es todo, quizás lo más complicado de entender es el javascript, realmente lo único que hace es crear una función, que trabaja con el elemento seleccionado del treeview, y mueve el scroll del panel hasta la posición correcta.

ASP.Net Ajax
En ASP.Net Ajax el codebehind es exactamente igual, lo único que cambia es la adición de un scriptmanager, el updatepanel, el contentpanel y el trigger correspondiente.

<body onload=”CargarScriptLoad()”>
<form id=”form1″ runat=”server”>
<asp:ScriptManager ID=”ScriptManager1″ runat=”server” />

<div>
<asp:UpdatePanel ID=”UpdatePanel1″ runat=”server”>
<ContentTemplate>
<asp:Panel ID=”Panel1″ runat=”server”>
<asp:TreeView ID=”TreeView1″ runat=”server”>
</asp:TreeView>
</asp:Panel>
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID=”TreeView1″ />
</Triggers>
</asp:UpdatePanel>
</div>

</form>
</body>

Resultado final.

Bueno, espero haberme explicado.

Anuncios

Laboratorios Framework 3.0 en español

Hace unos días comenté en este blog la existencia de unos Hands on Lab sobre el Framework 3.0, eran en inglés, hoy leyendo la blogsfera, concretamente el blog de Grabiel veo que se pueden descargar ahora en español.

Lo puedes hacer desde aquí.

Desafío Gadget para Windows Vista Sidebar

Microsoft pone en marcha un concurso denominado Desafío Gadget para Windows Vista Sidebar destinado supongo yo a popularizar los gadgets para Windows Vista y Windows Live.

Los premios son los siguientes:
Primer premio: Una Microsoft® ORIGAMI Ultra Mobile PC
Segundo premio: Una Microsoft XBox® 360
Tercer Premio: Un Microsoft Zune 30GB Digital Player
4ra a 7ma Posición: Cuatro Premios subsecuentes para finalistas: Microsoft LifeCam VX-6000.
Los premios para estudiantes
Primer premio: Una Microsoft® ORIGAMI Tablet PC y una Placa Conmemorativa de reconocimiento a la excelencia dirigida a la Universidad o centro de estudios.
2da a 6ta Posición: Cinco Premios subsecuentes para finalistas: Microsoft Zune 30GB Digital Player

Pues a animarse y a por ellos ….

Desafío Gadget para Windows Vista Sidebar

Microsoft pone en marcha un concurso denominado Desafío Gadget para Windows Vista Sidebar destinado supongo yo a popularizar los gadgets para Windows Vista y Windows Live.

Los premios son los siguientes:
Primer premio: Una Microsoft® ORIGAMI Ultra Mobile PC
Segundo premio: Una Microsoft XBox® 360
Tercer Premio: Un Microsoft Zune 30GB Digital Player
4ra a 7ma Posición: Cuatro Premios subsecuentes para finalistas: Microsoft LifeCam VX-6000.
Los premios para estudiantes
Primer premio: Una Microsoft® ORIGAMI Tablet PC y una Placa Conmemorativa de reconocimiento a la excelencia dirigida a la Universidad o centro de estudios.
2da a 6ta Posición: Cinco Premios subsecuentes para finalistas: Microsoft Zune 30GB Digital Player

Pues a animarse y a por ellos ….

¿Funcionarán mis aplicaciones Framework 2.0 con Framework 3.0?

Esta pregunta tiene una respuesta sencilla y contundente, .

Y esto es así porque realmente el motor del framework 3.0 es del 2.0. ????
La siguiente igualdad explica claramente el porque de esta afirmación.

Framework 3.0 = Framework 2.0 + WPF + WWF + WCF

WPF = Windows Presentation Foundation
WWF = Windows WorkFlow Foundation
WCF = Windows Comunication Foundation

Y la siguiente imagen, tomada de Microsoft, explica este tema incluyendo algunas cosas más.

Así queda claro que nuestras aplicaciones desarrolladas con la versión 2.0 no tendrán ningún problema en Windows Vista o versiones XP,2000, etc. que tengan FrameWork 3.0 instalado.

¿Funcionarán mis aplicaciones Framework 2.0 con Framework 3.0?

Esta pregunta tiene una respuesta sencilla y contundente, .

Y esto es así porque realmente el motor del framework 3.0 es del 2.0. ????
La siguiente igualdad explica claramente el porque de esta afirmación.

Framework 3.0 = Framework 2.0 + WPF + WWF + WCF

WPF = Windows Presentation Foundation
WWF = Windows WorkFlow Foundation
WCF = Windows Comunication Foundation

Y la siguiente imagen, tomada de Microsoft, explica este tema incluyendo algunas cosas más.

Así queda claro que nuestras aplicaciones desarrolladas con la versión 2.0 no tendrán ningún problema en Windows Vista o versiones XP,2000, etc. que tengan FrameWork 3.0 instalado.

Clase Uri. Validando direcciones de http, ftp, etc.

En este post veremos como validar direcciones de http, https, ftp, mailto utilizando la clase Uri que nos proporciona el Framework de Microsoft.Supongamos que tenemos un textbox, en su evento Validating incluiremos el siguiente código:

Dim _Direccion As New Uri(Me.TextBox1.Text.ToString)
If _Direccion.Scheme Uri.UriSchemeHttp Then
MessageBox.Show(“Dirección HTTP incorrecta”)
e.Cancel = True
End If

Creamos una variable local del tipo Uri y le asignamos el TextBox. Si no es una dirección http correcta mostrará un mensaje de error y abortará la validación.

Si queremos validar https cambiaremos la condición por Uri.UriSchemeHttps.
Si queremos validar ftp cambiaremos la condición por Uri.UriSchemeFtp.
Si queremos validar mailto cambiaremos la condición por Uri.UriSchemeMailTo.
Si queremos validar news cambiaremos la condición por Uri.UriSchemeNews.

En esta dirección podremos encontrar toda la información relativa a la clase Uri.


septiembre 2018
L M X J V S D
« Dic    
 12
3456789
10111213141516
17181920212223
24252627282930

Sindicación

NetMania y la Web

Internet Blog Serial Number 01-10-2006-02

Licencia

Creative Commons License
Esta obra está bajo una licencia de Creative Commons


Otros


Añadir a Favoritos de Technorati

Añadir a Netvibes

Añadir a Google

Unión de Bloggers Hispanos

nubes

Anuncios