get selected value of Select Control in Asp.net MVC razor

Question

I have defined an select on top of my page which shows pageSize(item list pr page)

        <select name="ddlPageSize" style="text-align:left;width:80px;">
        @for (var i = 5; i <= 100; i=i+5){

             <option>@i</option>
        }
        </select>

now when i wants to set page size in pagging link like.

 <div style="width:inherit; padding:15px 0; clear:both;">
    <ul style="text-align:center">

        @for (int i = 0; i < (int)Math.Ceiling((decimal)totalCount / (decimal)pageSize); i++)
        {        
            int page = i + 1;
            string background = "transparent";//transparent
            if (pageNo == page)
            {
               background = "grey";
            }

            <li style="display:inline; font-size:14px; color:#000; font-weight:bold; font-family:'VAGRound';padding:0 0px; background-color:@background; ">

                 <a href="~/Admin/Userspagging?page=@page">@page</a>

            </li>
        }
        </ul>
    </div>

in html anchor i wants to pass selected page size too with page Number

<a href="~/Admin/Userspagging?page=@page & size=@pageSize">@page</a>

score 1 · Accepted Answer · edited May 23 '17 at 12:05

You will need to change the url on ddlPageSize selected index change in jQuery.
Here is a link for the same
How to change the href for a hyperlink using jQuery

First of all add some class over your anchor so that you can easily get your Item in jQuery as.

 <a class='apager' href="~/Admin/Userspagging?page=@page">@page</a>

and use jquery as below

$("#ddlPageSize" ).on("change", function() {
   var selectedValue=$(this).val();
   $(".apager").each(function(item,index){
       item.attr("href",item.attr("href")+"&pageSize="+selectedValue);
   });

});

Note that this is just an idea not implemented so far.

this idea helps me alot thanks for jquery hint and idea – syed Ahsan Jaffri Dec 11 '13 at 11:30 — syed Ahsan Jaffri, Dec 11 '13 at 11:30

user2206329 · Answer 2 · 2013-12-11T10:55:53.910

If you want to update the anchor link based on user selection, it will have to be done client side.

Also use the data attributes for the URL. You know you will update the URL with just the current page.

<a id="LINKID" data-url="~/Admin/Userspagging?page=@page" href="">@page</a>

Attach a function to the change event of the dropdown.

$("#ddlPageSize" ).on( "change", function() {

   $("#LINKID").attr("href", $("#LINKID").data("id") + "&size=" + $("#ddlPageSize").val())

});

something like that...

get selected value of Select Control in Asp.net MVC razor

2 Answers2