2013-11-29 4 views
1

Привета я хочу сделать следующее:Следующая Предыдущая кнопка с помощью переключателя

У меня есть поле выбора, когда я нажимаю на номер страницы в процессе изменения продукт делает хорошо, что я хочу сделать сейчас, это нажать на a Значок «Выбор окна» автоматически переходит к следующему значению (страница).

Это мой Select Box и тонкая работа по:

enter image description here

 <td colspan="3">page 
     <select id="numPage"> 
      @if (ViewBag.pages == 0) 
      { 
       <option value="0" selected>0</option> 
      } 
      else 
      { 
       for (int i = 1; i <= ViewBag.pages; i++) 
       { 
        if (ViewBag.Nowpage == i) 
        { 
       <option id="Now" value="@(i)" selected>@(i)</option> 
        } 
        else 
        { 
       <option id="Next" value="@(i)">@(i)</option> 
        } 
       } 
      } 
     </select> 
    de @(ViewBag.pages)</td> 

это мои кнопки для первых предыдущих следующих или последних страницах:

enter image description here

<div> 
    <div id="startPage"><i class="fa fa-step-backward"></i></div> 
    <div id="previousPage"><i class="fa fa-backward"></i></div> 
    <div id="nextPage"><i class="fa fa-forward"></i></div> 
    <div id="lastPage"><i class="fa fa-step-forward"></i></div> 
</div> 

здесь я на странице 4, но я хочу перейти на страницу 4, когда нажав на иконку для перехода:

enter image description here

при нажатии на иконку последнюю страницу, чтобы перейти к последней странице Select Box:

enter image description here

Я ищу программирования с JQuery и MVC 4 какие-либо предложения?

ответ

1

Что-то вроде это работает:

$("#nextPage").on("click", function(){ 
    changeIndex(true); 
}); 

$("#previousPage").on("click", function(){ 
    changeIndex(false); 
}); 

function changeIndex(val) 
{ 
    var i = $("#numPage").prop("selectedIndex"); 
    $("#numPage").prop("selectedIndex", i + (val ? 1:-1)); 
    $("#numPage").trigger("change"); 
} 

$("#numPage").on("change", function(){ 
    console.log("I got triggered"); 
}); 

jsFiddle: http://jsfiddle.net/4c7LV/

Убедитесь, чтобы проверить, что индекс не выходит за пределы границ на ваш выбор, сравнивая его с того, сколько элементов он имеет ,

+1

Thanks man¡¡¡¡¡ – Christian

Смежные вопросы