Have Geek Brain

JQuery - How to get all data

I have a PartialView paging menu in my MVC app that looks like this:

    <%  if (Model.TotalPages > 5) 
    {
        int index = Model.PageIndex;
        int minIndex = index - 2;
        int maxIndex = index + 2;
        if (index < 2) 
        { 
            minIndex = 0; 
            maxIndex = 4; 
        }
        if (index > Model.TotalPages - 2) 
        { 
            minIndex = Model.TotalPages - 5; 
            maxIndex = Model.TotalPages; 
        }
        for (int i = minIndex; i <= maxIndex; i++)
        { %>    
            <li>
                <span class="<%= Html.GetClass((i==index), "selected", "notselected") %>">
                    <a href="<%= Url.Action("TypeNav", "Catalog", new { controller = "Catalog", action = "TypeNav", group = Model.ProductGroup, position = 0, index = i, browseSize = 6 } ) %>" class="<%= Html.GetClass((i==index), "selected", "notselected") %>">
                        <%= i + 1%>
                    </a>
                </span>
            </li>
<%      } 
    } 
    else 
    {
        for(int i=0; i<Model.TotalPages; i++) { %>    
            <li>
                <span class="<%= Html.GetClass((i==Model.PageIndex), "selected", "notselected") %>">
                    <a href="<%= Url.Action("TypeNav", "Catalog", new { controller = "Catalog", action = "TypeNav", group = Model.ProductGroup, position = 0, index = i, browseSize = 6 } ) %> ">
                        <%= i+1 %>
                    </a>
                </span>
            </li>
<%      }
    } %>

I am unable to figure out how to set the JQuery click event on the Anchor tags. Anchor tags don't have a NAME attribute, and my (very) limited experience with JQuery is that it needs NAME attributes.

Any pointers are appreciated.

TIA

+1


source to share


2 answers


You can specify any CSS selector to access your tags, not just the name / id. For example if you want all anchor tags in your document to subscribe to your event like

$("a").click(function() { /* Do magic */ });

will work. This will tend to mess up any other anchor tag on the page that may not be the effect you want.

If you want your tags to be propagated, sometimes it's easier to just give them a custom CSS class so you can hook up events via a simpler selector

$(".pagerLink").click(function() { /* Do magic */ });

If you don't like the idea that the alternative is to provide the containing UL tag with an ID, then use the descendant selector



$("#yourPager a").click(function() { /* Do magic */ });

or looking at your markup the right selector might be doable as well

$("span.selected > a, span.notselected > a")
      .click(function() {/* Do magic */ });

i.e. Find all tags that are immediate descendants of span tags that either have a selected class or an unselected class.

It's worth remembering that you need to override the default behavior of the tag (for example, navigate to your link), you can do this either by returning false from the event handler, or using the jQuery event object and calling preventDefault

+1


source


you should just do something like:



$("a").click(function(){
     alert("I've been clicked");
});
+4


source






More articles:


All Articles