Le sélecteur jQuery et le DataPager ne peuvent pas coexister! (ASP .NET)

Question

J'utilise un ASP .NET ListView avec une base de données MS SQL. J'utilise ListView pour afficher les informations et dans la vue de liste, un lien hypertexte ouvre la fenêtre d'édition pour l'enregistrement spécifique dans une boîte de dialogue jQuery Modal.

<asp:ListView ID="ListView1" runat="server" DataSourceID="SqlDataSource1"> 

    <LayoutTemplate> 
    <div id="itemPlaceholder" runat="server"> </div> 
    </LayoutTemplate> 
    <ItemTemplate> 
    <!--More Items --> 
    <a name="Link" href="EditItem.aspx?id=<%# Eval("articleid")%>">Edit</a> 
    <!--More Items -->  
    </ItemTemplate> 

    </asp:ListView> 
    </div> 

    <asp:SqlDataSource ID="SqlDataSource1" runat="server" 
     ConnectionString="<%$ ConnectionStrings:myConnectionString %>" 
     SelectCommand="SQL-SELECT-STATEMENT"> 
    </asp:SqlDataSource> 

    <div> 

Et fonctionne jQuery en prenant le lien de chaque élément qui porte le nom « Link » et l'associer à une boîte de dialogue.

<script type="text/javascript"> 


    $(document).ready(function() { 
    $("a[name=Link]").each(function() {  


      var $link = $(this); 
      var $dialog = $('<div></div>') 
       .load($link.attr('href')) 
       .dialog({ 
        autoOpen: false, 
        title: "Edit Article", 
        width: 500, 
        height: 550 
       }); 

      $link.click(function() { 
       $dialog.dialog('open'); 

       return false; 
      }); 
     }); 
    }); 
</script> 

Tout a fonctionné comme il se doit. Auparavant, tous les enregistrements pouvaient être affichés en une seule fois, mais à mesure que le nombre d'enregistrements augmentait, j'avais besoin d'une solution de pagination. DataPager pour le sauvetage!

<asp:DataPager ID="DataPager1" runat="server" PagedControlID="ListView1" PageSize="5"> 
    <Fields> 
    <asp:NextPreviousPagerField /> 
    <asp:NumericPagerField /> 
    </Fields> 
</asp:DataPager> 

Mais maintenant les contrôles du DataPager ne fonctionnent pas! Je ne peux pas revenir en arrière, avancer ou cliquer sur un numéro de page car il ouvrira le href du premier élément lié aux données dans le ListView sans boîte de dialogue (Tout comme une page normale). Mais si je supprime le code jQuery, la pagination fonctionne comme il se doit, mais je n'obtiens pas la boîte de dialogue modale soignée pour mon édition :(

Des idées pour lesquelles celles-ci ne peuvent pas exister les unes avec les autres?)

MISE À JOUR: Ce qui ne marche pas, c'est qu'ils ne peuvent pas coexister pacifiquement. Si je supprime le code jQuery, le DataPager fonctionne correctement mais je perdrai ma boîte de dialogue modale pour l'édition. Si je mets le code jQuery retour, la boîte de dialogue modale fonctionne très bien, mais la DataPager ne :(pas

Answer 1

Je pense que sélecteur de lien sélectionne probablement des liens de téléavertisseur de données. Vous pouvez $("a[name='Link']").each(.. notes des guillemets simples autour de la valeur d'attribut .

Sinon, pourquoi ne pas utiliser des sélecteurs d'id ou de classe. Par exemple:

<a id="editLink" ... 

et

$('a#editLink;).each(...