elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: Únete al Grupo Steam elhacker.NET


+  Foro de elhacker.net
|-+  Programación
| |-+  Programación General
| | |-+  .NET (C#, VB.NET, ASP) (Moderador: kub0x)
| | | |-+  Updatepanel y javascript
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: Updatepanel y javascript  (Leído 5,835 veces)
NetJava

Desconectado Desconectado

Mensajes: 195



Ver Perfil
Updatepanel y javascript
« en: 5 Marzo 2013, 18:56 pm »

Buenas, tengo un problema con updatepanel y javascript. Explico un poco, tengo un updatepanel que en su interior tiene un panel que llama a una función javascript que se ocupa del diseño del scroll.
El problema está en que cuando se actualiza el updatepanel que tiene en su interior un panel y dentro de este un Accordion, el scroll no se actualiza. El Accordion es dinámico, cambia según los datos de bd.
Cuando se recarga la página por completo, no surge este problema, únicamente surge cuando se actualiza el updatepanel, que contiene el panel con la función javascript.

Código:
<asp:UpdatePanel ID="UpdatePanel_room" runat="server" ChildrenAsTriggers="False" UpdateMode="Conditional" OnLoad="ms_room">
                <ContentTemplate>                 
                        <asp:Panel ID="pnl_room" runat="server" ScrollBars="Vertical" Width="150px" Height="330px" class="flexcroll">
                            <div class="lipsum">
                                <asp:Timer ID="timer_room" runat="server" OnTick="timer_room_Tick" Interval="10000" Enabled="true"></asp:Timer>
                                <!---*****************-->
                                <Ajax:Accordion ID="Accordion_room" runat="server"
                                   HeaderCssClass="Header" ContentCssClass="Contents"
                                   HeaderSelectedCssClass="SelectedHeader"
                                   Font-Names="Trebuchet MS" Font-Size="10"
                                   BorderColor="#000000" BorderStyle="Solid" BorderWidth="0"
                                   FramesPerSecond="100" FadeTransitions="true"
                                   TransitionDuration="500">
                                    <Panes>
                                    </Panes>
                                </Ajax:Accordion>
                                <!---*****************-->
                            </div>
                        </asp:Panel>
                </ContentTemplate>
            </asp:UpdatePanel>

Si sacase del updatepanel el panel con el diseño del scrollo, este tampoco se actualizaría con el nuevo tamaño del Accordion :X Qué opináis?! Yo estoy un poco en el limite de la locura.


En línea

NetJava

Desconectado Desconectado

Mensajes: 195



Ver Perfil
Re: Updatepanel y javascript
« Respuesta #1 en: 7 Marzo 2013, 20:11 pm »

Bueno, pues estoy más o menos encaminado con el problema que tengo, pero no consigo ajustarme xD. Os comento, perimero url:


http://parametheus.wordpress.com/2011/08/27/javascript-dentro-de-un-asp-net-ajax-updatepanel/


Código en Page_Load

Código:
ScriptManager.RegisterStartupScript(Me, Page.GetType, "scriptkey1", "eval();", True)

La función de javascript esta en un archivo y se carga como ya conocéis todos:

Código:
<script type='text/javascript' src="../scripts/script1.js"></script>

pues algo debe estar fallando o faltando, qué os parece?


En línea

NetJava

Desconectado Desconectado

Mensajes: 195



Ver Perfil
Re: Updatepanel y javascript
« Respuesta #2 en: 8 Marzo 2013, 18:14 pm »

Buenos, tras patearme todo google, todos los comentarios, toda la ayuda de microsoft, la solución para mi caso es la siguiente:


http://stackoverflow.com/questions/802506/cant-get-scriptmanager-registerstartupscript-in-webcontrol-nested-in-updatepane?rq=1


Particularmente el cuarto comentario:

Código:
ScriptManager.RegisterClientScriptBlock(UpdatePanel1, UpdatePanel1.GetType(), "UpdatePanel1_PreRender", _
                   "<script type='text/javascript' id='UpdatePanel1_PreRender'>" & _
                   "include('yourDynamic.js');" & _
                   "removeDuplicatedScript('UpdatePanel1_PreRender');</script>" _
                   , False)


Código:
// Include a javascript file inside another one.
function include(filename)
{
    var head = document.getElementsByTagName('head')[0];

    var scripts = document.getElementsByTagName('script');
    for(var x=0;x<scripts.length;>    {
        if (scripts[x].getAttribute('src'))
        {
            if(scripts[x].getAttribute('src').indexOf(filename) != -1)
            {
                head.removeChild(scripts[x]);
                break;
            }
        }
    }

    script = document.createElement('script');
    script.src = filename;
    script.type = 'text/javascript';
    head.appendChild(script)
}

// Removes duplicated scripts.
function removeDuplicatedScript(id)
{
    var count = 0;
    var head = document.getElementsByTagName('head')[0];

    var scripts = document.getElementsByTagName('script');
    var firstScript;
    for(var x=0;x<scripts.length;>    {
        if (scripts[x].getAttribute('id'))
        {
            if(scripts[x].getAttribute('id').indexOf(id) != -1)
            {
                if (count == 0)
                {
                    firstScript = scripts[x];
                    count++;
                }
                else
                {
                    head.removeChild(firstScript);
                    firstScript = scripts[x];
                    count = 1;
                }
            }
        }
    }
    clearAjaxNetJunk();
}
// Evoids the update panel auto generated scripts to grow to inifity. X-(
function clearAjaxNetJunk()
{
    var knowJunk = 'Sys.Application.add_init(function() {';
    var count = 0;
    var head = document.getElementsByTagName('head')[0];

    var scripts = document.getElementsByTagName('script');
    var firstScript;
    for(var x=0;x<scripts.length;>    {
        if (scripts[x].textContent)
        {
            if(scripts[x].textContent.indexOf(knowJunk) != -1)
            {
                if (count == 0)
                {
                    firstScript = scripts[x];
                    count++;
                }
                else
                {
                    head.removeChild(firstScript);
                    firstScript = scripts[x];
                    count = 1;
                }
            }
        }
    }
}

Un saludo a todos.
En línea

NetJava

Desconectado Desconectado

Mensajes: 195



Ver Perfil
Re: Updatepanel y javascript
« Respuesta #3 en: 8 Marzo 2013, 18:33 pm »

No me lo puedo creer! Ahora el updatepanel no actualiza los datos del accordion xD. Aunq el javascript si. Seguiré estudiandolo.
En línea

Novlucker
Ninja y
Colaborador
***
Desconectado Desconectado

Mensajes: 10.683

Yo que tu lo pienso dos veces


Ver Perfil
Re: Updatepanel y javascript
« Respuesta #4 en: 9 Marzo 2013, 05:12 am »

C# :P
ASPX
Código
  1. <asp:Content ID="Content3" ContentPlaceHolderID="MainContent" runat="server">
  2.    <asp:Timer runat="server" ID="ajaxTimer" Interval="5000" Enabled="true" OnTick="ajaxTimer_Tick"></asp:Timer>
  3.    <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
  4.        <ContentTemplate>
  5.            <asp:Panel ID="mainPanel" runat="server">
  6.                <asp:Label ID="lblFecha" runat="server"></asp:Label>
  7.            </asp:Panel>
  8.        </ContentTemplate>
  9.    </asp:UpdatePanel>
  10. </asp:Content>
Codebehind
Código
  1. protected void ajaxTimer_Tick(object sender, EventArgs e)
  2. {
  3.    lblFecha.Text = DateTime.Now.ToString();
  4.    ScriptManager.RegisterStartupScript(UpdatePanel1, UpdatePanel1.GetType(), "afterupdate", "CallAlert();", true);
  5. }
javascript (Main.js)
Código
  1. function CallAlert() {
  2.    alert(new Date());
  3. }
ASPX donde esta el scriptmanager, en mi caso está en la master
Código
  1. <asp:ScriptReference Path="~/Scripts/Main.js" />

Listo! ;)

Saludos
En línea

Contribuye con la limpieza del foro, reporta los "casos perdidos" a un MOD XD
"Hay dos cosas infinitas: el Universo y la estupidez  humana. Y de la primera no estoy muy seguro."
Albert Einstein
NetJava

Desconectado Desconectado

Mensajes: 195



Ver Perfil
Re: Updatepanel y javascript
« Respuesta #5 en: 11 Marzo 2013, 11:14 am »

Buenas, he estado este fin de semana dandole al tema con tu ejemplo, muchas gracias, puedo garantizar que funciona, jajaja ningún problema con el C#. Sigue sin funcionar bien, creo que es por algún problema de base por haber dado ya tantas vueltas, voy a seguir a ver que es lo que pasa y luego lo pondré aquí, para no marearos más con este tema. El fallo soy yo xD.

Muchas gracias.
En línea

NetJava

Desconectado Desconectado

Mensajes: 195



Ver Perfil
Re: Updatepanel y javascript
« Respuesta #6 en: 11 Marzo 2013, 20:30 pm »

Es imposible xD. Os pongo el código.

Código Aspx

Código:
<asp:ScriptManager ID="ScriptManager1" runat="server">
            <Scripts>
                <asp:ScriptReference Path="../scripts/flexcroll.js" />
            </Scripts>
</asp:ScriptManager>

ms_room -> Cargar el Accordion desde programación.

Código:
<asp:UpdatePanel ID="UpdatePanel_room" runat="server" UpdateMode="Conditional" OnLoad="ms_room" >
                <ContentTemplate>    <!-- flexcroll  OnUnload="ms_room" OnLoad="ms_room" -->             
                        <asp:Timer ID="timer_room" runat="server" OnTick="timer_room_Tick" Interval="10000" Enabled="true"></asp:Timer>
                        <asp:Panel ID="pnl_room" runat="server" ScrollBars="Vertical" Width="150px" Height="330px" class="flexcroll">           
                            <div class="lipsum">
                                <!---*****************-->
                                <Ajax:Accordion ID="Accordion_room" runat="server"
                                   HeaderCssClass="Header" ContentCssClass="Contents"
                                   HeaderSelectedCssClass="SelectedHeader"
                                   Font-Names="Trebuchet MS" Font-Size="10"
                                   BorderColor="#000000" BorderStyle="Solid" BorderWidth="0"
                                   FramesPerSecond="100" FadeTransitions="true"
                                   TransitionDuration="500" RequireOpenedPane="false">
                                    <Panes>
                                    </Panes>
                                </Ajax:Accordion>
                                <!---*****************-->
                            </div>
                        </asp:Panel>                   
                </ContentTemplate>
            </asp:UpdatePanel>

Código vb:
Código:
Public Sub timer_room_Tick(ByVal sender As Object, ByVal e As System.EventArgs) Handles timer_room.Tick
        Label1.Text = DateTime.Now.ToLongTimeString()
        ScriptManager.RegisterStartupScript(UpdatePanel_room, UpdatePanel_room.GetType(), "afterupdate", "eval();", True)
    End Sub

Código javascript (flexcroll.js)

Código:
eval(
    function (p, a, c, k, e, r) {
        e = function (c) {
            return (c < a ? '' : e(parseInt(c / a))) + ((c = c % a) > 35 ? String.fromCharCode(c + 29) : c.toString(36))
        };

        if (!''.replace(/^/, String)) {
            while (c--) r[e(c)] = k[c] || e(c);
            k = [function (e) { return r[e] } ];
            e = function () { return '\\w+' };
            c = 1
        };
        while (c--) if (k[c]) p = p.replace(new RegExp('\\b' + e(c) + '\\b', 'g'), k[c]); return p
    } ('D H={38:[],5O:C(){7... Simplifico código porque si no se hace muy incomodo de ver ...prototype'.split('|'), 0, {})
                )

Si pongo el Timer fuera del Updatepanel, no hay problema, pero por que actualiza la página entera, claro en mi caso que no tiene el Conten. Sigue actualizando, pero el javascript no se ejecuta. Esto parece misión imposible... Qué opináis?!
En línea

NetJava

Desconectado Desconectado

Mensajes: 195



Ver Perfil
Re: Updatepanel y javascript
« Respuesta #7 en: 11 Marzo 2013, 20:36 pm »

Olvidaba comentar que class="flexcroll" y class = "lipsum" son para darle al Panel el diseño del scroll, que es por lo que me estoy matando. xD
En línea

NetJava

Desconectado Desconectado

Mensajes: 195



Ver Perfil
Re: Updatepanel y javascript
« Respuesta #8 en: 12 Marzo 2013, 14:14 pm »

Buenas, pues ya esta solucionado, comprobado, verificado. La respuesta de
Código:
Novlucker
es correcta al 100%, para mi caso al menos, el problema de después estaba en como yo trataba el javascript de flexcroll.

http://www.hesido.com/web.php?page=customscrollbar

Un saludo y muchas gracias.
En línea

Novlucker
Ninja y
Colaborador
***
Desconectado Desconectado

Mensajes: 10.683

Yo que tu lo pienso dos veces


Ver Perfil
Re: Updatepanel y javascript
« Respuesta #9 en: 12 Marzo 2013, 15:44 pm »

Excelente!  ;D
En línea

Contribuye con la limpieza del foro, reporta los "casos perdidos" a un MOD XD
"Hay dos cosas infinitas: el Universo y la estupidez  humana. Y de la primera no estoy muy seguro."
Albert Einstein
Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

Mensajes similares
Asunto Iniciado por Respuestas Vistas Último mensaje
Ayuda con javascript en mi web(no tengo ni idea de javascript)
Desarrollo Web
jonathanmr 1 2,228 Último mensaje 1 Febrero 2013, 06:14 am
por Shell Root
Ajax: UpdatePanel Timer y Accordion
.NET (C#, VB.NET, ASP)
NetJava 1 1,663 Último mensaje 3 Marzo 2013, 13:24 pm
por NetJava
WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines