none
Usercontrol et Javascript RRS feed

  • Question

  • Bonjour,

    J'ai un petit soucis sur l'affichage....

    Je travail avec visual studio 2003 Framework1.1. je fais du web Form.

    Dans ma page principale jai ceci :

    J'utilise un user control pour afficher du contenu different en fonction du type de données.

    Le meme user control est utilisé, mais le contenu est different

    ...

    ...

    <BR>
        <uc1:listeelements id="ucListePC" runat="server" typeElement="LPC"
            pageMere="PTt" NomEntete="Eqpt"></uc1:listeelements>
        <BR>
        <BR>
        <uc1:listeelements id="ucListePI" runat="server" typeElement="LPI"
            pageMere="PTt" NomEntete="Equipement"></uc1:listeelements>
        <P></P>
        <BR>

    Mon userCOntrol est le suivant  : "ListElement :

    <TABLE border="0" cellPadding="10">
        <tr>
            <td width="500">
                <div style="WIDTH: 330px; HEIGHT: 150px; OVERFLOW: auto" id="divListElt"><asp:datagrid>
    </asp:datagrid></div>
            </td>
        </tr>
    </TABLE>

    Je voudrais via un javascript modifier le height: 150px dans la page mere. Ce UC est appellé 2 fois dans la page mere avec du contenu different.

    Avec mon script suivant, j'arrive a modifier le 1er uc mais pas le deuxieme.

    <script language="javascript">
    function printpreview()
    {
        document.getElementById('divListElt').style.height = '100%';
        window.print();
        document.getElementById('divListElt').style.height = '150px';
    }
    </script>

    quelqu'un a une idée?

    Merci...

    mardi 6 mars 2012 16:59

Réponses

  • Bonjour,

    Vous devez utiliser la fonction getElementsByName car getElementById retourne un seul élément étant donné qu'un Id est sensé être unique :

    Modifier le code de votre user control de la façon suivante :

    <TABLE border="0" cellPadding="10">
        <tr>
            <td width="500">
                <div style="WIDTH: 330px; HEIGHT: 150px; OVERFLOW: auto; " id="divListElt" Name="divListElt" >
                
                </div>
            </td>
        </tr>
    </TABLE>

    En suite modifier votre fonction javascript de la façon suivante :

    function printpreview()
    {
        var items = document.getElementsByName('divListElt');
        
        for(i=0; i< items.length; i++)
        {
            items[i].style.height = '100%';
        }
    
        window.print();
    
        for(i=0; i< items.length; i++)
        {
            items[i].style.height = '150px';
        }
    }

    Cordialement.

    • Marqué comme réponse GraySky mercredi 7 mars 2012 13:51
    mercredi 7 mars 2012 13:17
    Auteur de réponse

Toutes les réponses

  • Bonjour,

    Vous devez utiliser la fonction getElementsByName car getElementById retourne un seul élément étant donné qu'un Id est sensé être unique :

    Modifier le code de votre user control de la façon suivante :

    <TABLE border="0" cellPadding="10">
        <tr>
            <td width="500">
                <div style="WIDTH: 330px; HEIGHT: 150px; OVERFLOW: auto; " id="divListElt" Name="divListElt" >
                
                </div>
            </td>
        </tr>
    </TABLE>

    En suite modifier votre fonction javascript de la façon suivante :

    function printpreview()
    {
        var items = document.getElementsByName('divListElt');
        
        for(i=0; i< items.length; i++)
        {
            items[i].style.height = '100%';
        }
    
        window.print();
    
        for(i=0; i< items.length; i++)
        {
            items[i].style.height = '150px';
        }
    }

    Cordialement.

    • Marqué comme réponse GraySky mercredi 7 mars 2012 13:51
    mercredi 7 mars 2012 13:17
    Auteur de réponse
  • Merci pour ta réponse, cela fonctionne.

    mercredi 7 mars 2012 13:51