2015-07-11 8 views
-1

Привет, у меня проблема с мышлением, чтобы решить этот логарифм, и это будет soo soo good, если ответ wana будет с angularjs javascript.получить координатное место на столе

Мой вопрос у меня есть эта таблица: http://jsfiddle.net/zdtvy1h1/2/

Как я могу получить текущие координаты места после любого нажатия.

Чтобы объяснить мой вопрос больше: http://jsfiddle.net/zdtvy1h1/2/

Это фото о моей таблице и то, что я хочу: если я нажал на 14, чтобы получить координаты для него и значение Вана быть для числа 14 ENG209 и 12:00-13:00 также, если я нажал на номер 23, чтобы получить ENG214 14:00-15:00.

Надеюсь, я отправил хороший вопрос, чтобы вы поняли это.

уведомление 1: номер, который на фото, это просто пример, мне нужно поставить некоторые вещи еще

уведомление 2: Я использую базу данных, чтобы получить это значение от него

example

<div class="panel panel-Technical text-center"> 
    <div class="panel-heading"> 
     <h3 class="panel-title"> 
      <i class="fa fa-institution"> </i> 
      Monday 
     </h3> 
    </div> 
</div> 
<div class="table-responsive text-center"> 
    <table class="table table-bordered text-center"> 
     <thead> 
      <tr class="text-center"> 
       <th>#</th> 
       <th>ENG201</th> 
       <th>ENG209</th> 
       <th>ENG214</th> 
       <th>EBN204</th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr> 
       <th scope="row">9:00-10:00</th> 
       <td>1</td> 
       <td>2</td> 
       <td>3</td> 
       <td>4</td> 
      </tr> 
      <tr> 
       <th scope="row">10:00-11:00</th> 
        <td>5</td> 
       <td>6</td> 
       <td>7</td> 
       <td>8</td> 
      </tr>     
      <tr> 
       <th scope="row">11:00-12:00 </th> 
       <td>9</td> 
       <td>10</td> 
       <td>11</td> 
       <td>12</td> 
      <tr> 
       <th scope="row">12:00-13:00</th> 
       <td>13</td> 
       <td>14</td> 
       <td>15</td> 
       <td>16</td> 
      </tr> 
      <tr> 
       <th scope="row">13:00-14:00</th> 
       <td>17</td> 
       <td>18</td> 
       <td>19</td> 
       <td>20</td> 
      </tr> 
      <tr> 
       <th scope="row">14:00-15:00</th> 
       <td>21</td> 
       <td>22</td> 
       <td>23</td> 
       <td>24</td> 
      </tr> 
      <tr> 
       <th class="aaa" scope="row" >15:00-16:00</th> 
       <td>25</td> 
       <td>26</td> 
       <td>27</td> 
       <td>28</td> 
      </tr> 
      <tr> 
       <th scope="row">16:00-17:00</th> 
       <td>29</td> 
       <td>30</td> 
       <td>31</td> 
       <td>32</td> 
      </tr> 
     </tbody> 
    </table> 
</div> 
+0

Вы можете разместить HTML таблицы пожалуйста ? EDIT: thanks :) –

+0

Вам не нравится использование jquery? –

+0

ОК я его отредактировал :) – badr

ответ

2

Используйте это! Fiddle: http://jsfiddle.net/zdtvy1h1/3/

$(document).ready(function() { 
    $('td').click(function() { 
     var subject = $("tr.text-center th").get($(this).index()); 
     alert($(this).parent().find('th[scope="row"]').text()+" "+$(subject).text()); 
    }); 
}); 

Это первый поиск предмета по индексации ребенка номер $(this).index() и чем смотреть то, что ребенок в заголовке принадлежит щелкнули тр var subject = .... Затем он находит th с scope=row, который находится в том же tr с .find('th[scope="row"]').

Но все это очень компактно :)

Наслаждайтесь!

EDIT:

Это, по существу, тот же сценарий, но теперь у вас есть переменные subject и time, которые вы можете передать своим AngularJS

$(document).ready(function() { 
    $('td').click(function() { 
     var subject = $("tr.text-center th").get($(this).index()); 
     subject = $(subject).text(); 
     var time = $(this).parent().find('th[scope="row"]').text(); 

     alert(time+" "+subject); 
    }); 
}); 
+0

Спасибо soo soo soo much :), что так хорошо, и это сработало со мной – badr

0

Так как вы в том числе JQuery использовать index()

$('tbody td').click(function(){ 
    var rowIndex = $(this).parent().index(); 
    var colIndex = $(this).index();  
}); 

При использовании без аргументов возвращает индекс элемента в пределах его братья и сестры

2

Если макет вашей таблицы с помощью нг-повтор с коллекцией объектов (каждый из которых представляет собой строку данных), вы можете использовать ng-click, чтобы отключить функцию, передав объект, представляющий эту строку.

Что-то вроде этого:

<tr ng-repeat="row in vm.tableData" ng-click=vm.selectRow(row);> 
    <td ....> 
    <td ....> 
    <td ....> 
</tr> 

В контроллере определяют vm.tableData как массив объектов, содержащих данные. vm.selectRow - это функция, которая принимает объект данных и делает все, что вам нужно.

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