Гость
Войти | Профиль | Очистить
Целевая тема:
Создать новую тему:
Автор:
Действия ...
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / выбор значения элемента текущей строки таблицы Jquery / 20 сообщений из 20, страница 1 из 1
11.11.2014, 13:38
    #38802032
Сергей Лалов
Сергей Лалов
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выбор значения элемента текущей строки таблицы Jquery
Коллеги всем привет!
Сел в лужу с элелементарной функцией. Есть таблица всего из двух полей . В одном из них input типа button, в другой просто текстовое поле типа input. Нужно, чтобы при нажатии на кнопку типа button выводилось значение в alert текстовое значение соседнего поля

Что представляет собой таблица:

Код: html
1.
2.
3.
4.
5.
6.
7.
<table id='table1'>
<tr><th>КОНТЕЙНЕР</th><th>КНОПКА</th></tr>
<tr><td><input type='text' id='container' value='MSCU4569871'></td><td><input type='button' class='btn1' value='ВЫВЕСТИ'></td></tr>
<tr><td><input type='text' id='container' value='MSCU4567892'></td><td><input type='button' class='btn1' value='ВЫВЕСТИ'></td></tr>
<tr><td><input type='text' id='container' value='MSCU4629413'></td><td><input type='button' class='btn1' value='ВЫВЕСТИ'></td></tr>
<tr><td><input type='text' id='container' value='MSKU3126981'></td><td><input type='button' class='btn1' value='ВЫВЕСТИ'></td></tr>
</table>



Что представляет собой процедура повешенная на нажатие кнопки 'btn1'

Код: javascript
1.
2.
3.
4.
5.
$(".btn1").click(function () {

///// Здесь нужно чтобы в Алерт вывелось значение соседнего текстового поля input . Значение должно выводиться в зависимости от строки, где нажимается кнопка.

 });




Помогите пожалуйста
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
11.11.2014, 14:02
    #38802083
skyANA
skyANA
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выбор значения элемента текущей строки таблицы Jquery
Сергей Лалов,

Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
<!DOCTYPE HTML>
<html>  
<head>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
</head>  
<body>
  <table id='table1'>
    <tr>
      <th>КОНТЕЙНЕР</th><th>КНОПКА</th>
    </tr>
    <tr>
      <td>
        <input type='text' id='container' value='MSCU4569871'>
      </td>
      <td>
        <input type='button' class='btn1' value='ВЫВЕСТИ'>
      </td>
    </tr>
    <tr>
      <td>
        <input type='text' id='container' value='MSCU4567892'>
      </td>
      <td>
        <input type='button' class='btn1' value='ВЫВЕСТИ'>
      </td>
    </tr>
    <tr>
      <td>
        <input type='text' id='container' value='MSCU4629413'>
      </td>
      <td>
        <input type='button' class='btn1' value='ВЫВЕСТИ'>
      </td>
    </tr>
    <tr>
      <td>
        <input type='text' id='container' value='MSKU3126981'>
      </td>
      <td>
        <input type='button' class='btn1' value='ВЫВЕСТИ'>
      </td>
    </tr>
  </table>
  <script>
    function onButtonClick(e) {
      var sender = $(this),
          senderTagName = sender.prop('tagName'),
          parent = sender.parent(),
          parentTagName = parent.prop('tagName');
      
      alert(parent.prev(parentTagName).children(senderTagName).val());
    }
    
    $('#table1').on('click', 'input[type="button"]', onButtonClick);
  </script>
</body>
</html>
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
11.11.2014, 14:03
    #38802084
skyANA
skyANA
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выбор значения элемента текущей строки таблицы Jquery
Либо:
Код: javascript
1.
2.
3.
function onButtonClick(e) {      
  alert($(this).parent().prev('td').children('input').val());
}
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
11.11.2014, 14:04
    #38802087
skyANA
skyANA
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выбор значения элемента текущей строки таблицы Jquery
Либо:
Код: javascript
1.
2.
3.
function onButtonClick(e) {      
  alert($(this).closest('td').prev('td').find('input').val());
}
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
11.11.2014, 14:05
    #38802089
Сергей Лалов
Сергей Лалов
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выбор значения элемента текущей строки таблицы Jquery
skyANA,
Ага, огромное спасибо! Все работает. А обязательно с пропертями целую простыню создавать?
Может можно какнить покороче ?)
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
11.11.2014, 14:05
    #38802092
Сергей Лалов
Сергей Лалов
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выбор значения элемента текущей строки таблицы Jquery
skyANAЛибо:
Код: javascript
1.
2.
3.
function onButtonClick(e) {      
  alert($(this).closest('td').prev('td').find('input').val());
}



Ага, сенкс!
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
11.11.2014, 14:32
    #38802139
skyANA
skyANA
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выбор значения элемента текущей строки таблицы Jquery
Сергей ЛаловА обязательно с пропертями целую простыню создавать?Это я Вам написал, чтобы Вы познакомились с большим количеством методов jQuery, чтобы меньше вопросов у Вас было в будущем :)
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
11.11.2014, 14:32
    #38802141
Сергей Лалов
Сергей Лалов
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выбор значения элемента текущей строки таблицы Jquery
А если мне во втором Алерте необходимо вывести значение ID текущего тега строки TR, такая конструкция

Код: javascript
1.
alert($(this).parent('tr').attr('id').value);



почему то не работает, что странно, вроде правильно указал цепочку

айдишник в теге строка есть, нормальный ,числовой
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
11.11.2014, 14:39
    #38802153
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выбор значения элемента текущей строки таблицы Jquery
Сергей ЛаловА если мне во втором Алерте необходимо вывести значение ID текущего тега строки TR, такая конструкция

Код: javascript
1.
alert($(this).parent('tr').attr('id').value);



почему то не работает, что странно, вроде правильно указал цепочку

айдишник в теге строка есть, нормальный ,числовой
У элементов жиКвери нет свойства value... Но есть метод val().
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
11.11.2014, 14:41
    #38802158
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выбор значения элемента текущей строки таблицы Jquery
Сергей ЛаловА обязательно с пропертями целую простыню создавать?
Может можно какнить покороче ?)
Как вариант...

Код: javascript
1.
2.
3.
function onButtonClick(e) {      
  alert($(this).parents('tr').find('input:text').val());
}
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
11.11.2014, 14:42
    #38802163
Сергей Лалов
Сергей Лалов
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выбор значения элемента текущей строки таблицы Jquery
krvsa,

Да я и с val() пробовал, не выходит

Код: javascript
1.
2.
3.
4.
5.
function onButtonClick(e) {   
alert($(this).parent('tr').attr('id').val());
alert($(this).parent().prev('td').children('input').val());
}
});



Чет не пошло, хотя айдишник у тега <tr> нормально генериться
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
11.11.2014, 14:44
    #38802174
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выбор значения элемента текущей строки таблицы Jquery
Сергей ЛаловА если мне во втором Алерте необходимо вывести значение ID текущего тега строки TR, такая конструкция

Код: javascript
1.
alert($(this).parent('tr').attr('id').value);



почему то не работает, что странно, вроде правильно указал цепочку

айдишник в теге строка есть, нормальный ,числовой
И "цепочка" неправильная...

Код: javascript
1.
alert($(this).parent().parent().attr('id'));
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
11.11.2014, 14:46
    #38802177
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выбор значения элемента текущей строки таблицы Jquery
Сергей Лаловkrvsa,

Да я и с val() пробовал, не выходит

Код: javascript
1.
2.
3.
4.
5.
function onButtonClick(e) {   
alert($(this).parent('tr').attr('id').val());
alert($(this).parent().prev('td').children('input').val());
}
});



Чет не пошло, хотя айдишник у тега <tr> нормально генериться
Метод val() возвращает только то, что находится в свойстве/атрибуте value...
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
11.11.2014, 14:46
    #38802179
skyANA
skyANA
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выбор значения элемента текущей строки таблицы Jquery
Сергей Лалов,

а Вы документацию по методам почитайте: .closest() , .parent() и т.п.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
11.11.2014, 14:49
    #38802187
skyANA
skyANA
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выбор значения элемента текущей строки таблицы Jquery
Сергей ЛаловЧет не пошло, хотя айдишник у тега <tr> нормально генериться
Код: javascript
1.
2.
3.
4.
function onButtonClick(e) {
  alert($(this).closest('tr').attr('id'));
  alert($(this).closest('td').prev('td').find('input').val());
}
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
11.11.2014, 14:51
    #38802193
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выбор значения элемента текущей строки таблицы Jquery
Или так...

Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
<!DOCTYPE html>
<html>
<head>
<script src='http://code.jquery.com/jquery-latest.js'></script>
<!--
<link rel='stylesheet type=text/css href=tmp.css' />
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
$(function (){
	$('#table1').on('click',':button',function (){
		alert($(this).parents('tr').find(':text').val())
		alert($(this).parents('tr').attr('id'))
	});
});
</script>
</head>
<body> 
<table id='table1'>
<tr><th>КОНТЕЙНЕР</th><th>КНОПКА</th></tr>
<tr id='1'><td><input type='text' id='container' value='MSCU4569871'></td><td><input type='button' class='btn1' value='ВЫВЕСТИ'></td></tr>
<tr id='2'><td><input type='text' id='container' value='MSCU4567892'></td><td><input type='button' class='btn1' value='ВЫВЕСТИ'></td></tr>
<tr id='3'><td><input type='text' id='container' value='MSCU4629413'></td><td><input type='button' class='btn1' value='ВЫВЕСТИ'></td></tr>
<tr id='4'><td><input type='text' id='container' value='MSKU3126981'></td><td><input type='button' class='btn1' value='ВЫВЕСТИ'></td></tr>
</table>
</body>
</html>
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
11.11.2014, 15:04
    #38802229
Сергей Лалов
Сергей Лалов
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выбор значения элемента текущей строки таблицы Jquery
skyANAСергей ЛаловЧет не пошло, хотя айдишник у тега <tr> нормально генериться
Код: javascript
1.
2.
3.
4.
function onButtonClick(e) {
  alert($(this).closest('tr').attr('id'));
  alert($(this).closest('td').prev('td').find('input').val());
}



Документацию почитал, накололся только в одном моменте. $(this).closest('tr'). attr('id')
Атрибут по умолчанию не может проявлять свойства .val() ?
Или это такое свойство айдишника? Не знал, но буду знать, все заработало)
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
11.11.2014, 15:19
    #38802256
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выбор значения элемента текущей строки таблицы Jquery
Сергей ЛаловАтрибут по умолчанию не может проявлять свойства .val() ?
Метод .val() работает только с атрибутом/свойством value. Больше он ничего не делает и других атрибутов или свойств у элемента незнает...
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
11.11.2014, 15:40
    #38802285
skyANA
skyANA
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выбор значения элемента текущей строки таблицы Jquery
Сергей Лалов Документацию почитал , накололся только в одном моменте. $(this).closest('tr'). attr('id')
Атрибут по умолчанию не может проявлять свойства .val() ?Странно Вы её почитали.

Вбиваете в адресной строке барузера: http://api.jquery.com/.

Дописываете val ( http://api.jquery.com/val/) - читаете документацию о методе .val().
В частности следующее:.val()The .val() method is primarily used to get the values of form elements such as input , select and textarea .
Дописываете attr ( http://api.jquery.com/attr/) - читаете документацию о методе .attr().
Во первых строках которой написано:.attr()Get the value of an attribute for the first element in the set of matched elements...
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
11.11.2014, 15:43
    #38802289
skyANA
skyANA
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выбор значения элемента текущей строки таблицы Jquery
Ну и надо же понимать, как работает jQuery, если используете эту библиотеку.

Откуда вдруг возникнет метод .val() у обычной строки, что возвращает .attr()? Ещё раз: читайте документацию, а не гадайте! :)
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / выбор значения элемента текущей строки таблицы Jquery / 20 сообщений из 20, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение  
Полит. конфиден.  
созд. / загр.: 541ms
Закрыть
start [/forum/topic.php?fid=22&tablet=1&tid=1446549]:
 0ms
get settings:
 10ms
get forum list:
 22ms
check forum access:
 4ms
check topic access:
 4ms
track hit:
 180ms
get topic data:
 10ms
get forum data:
 2ms
get page messages:
 57ms
get tp. blocked users:
 1ms
others: 251ms
total:  541ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]