Bootstrap и dropdown-menu

@spirikonpro · Регистрация: 14.02.2015

Студворк — интернет-сервис помощи студентам

Есть dropdown-menu в форме

HTML5
1
2
3
4
5
6
7
8
9
10
<div class="btn-group btn-input clearfix team-select">
   <button class="btn btn-primary dropdown-toggle form-control" data-toggle="dropdown">
      <span data-bind="label">Choose Team</span>&nbsp;<span class="caret"></span>
   </button>
  <ul class="dropdown-menu">
    <li><a data-remote="true" href="/turnaments/1?user_id=1">Test Field</a></li>
    <li><a data-remote="true" href="/turnaments/1?user_id=2">Test Field</a></li>
    <li><a data-remote="true" href="/turnaments/1?user_id=3">Test Field</a></li>
  </ul>
</div>

При выборе <li> Ajax'ом подгружается полная информация, поэтому теги <a> обязательны.
Но мне нужно чтобы при нажатии на кнопку <input type="submit">мне отправлялся id пользователя.

HTML5
1
2
3
4
5
<select id="user_id" name="user_id">
  <option value="1">Brad</option>
  <option value="2">Angie</option>
  <option value="3">Jenny</option>
</select>

Таким способом оно отправляет но в option нельзя вставлять ссылки. Как сделать чтобы оно отправило user_id пользователя которого я выбрал?

@BANO · 05.06.2016, 13:08

spirikonpro, а как выбирается пользователь в этом dropdown?

Добавлено через 2 минуты
spirikonpro, у меня есть предложение
сделайте скрытый select, у него меняйте значение и отправляйте его

@kalabuni · 05.06.2016, 13:33

Сообщение от spirikonpro

При выборе <li> Ajax'ом подгружается полная информация, поэтому теги <a> обязательны.

откуда дровишки?
не существует никакой зависимости между аяксом и ссылками
аяксом можно пользоваться без каких-либо ссылок и даже без форм

@Padimanskas · 05.06.2016, 18:23

spirikonpro,it's much simple doing on the angular. in pure javascript it's going to looks like shit. try it out

HTML5
1
2
3
4
5
6
7
8
9
<div ng-controller="usersCtrl">
 
  <select class="form-control" ng-model="selectedUser" ng-options="user.name for user in users" ng-change="sendUserData(selectedUser)"></select>
  
     <br/> ID пользователя: {{selectedUser.id}}
    <br/> Имя пользователя: {{selectedUser.name}}
    <br/>Ответ сервера:
    <br/><pre>{{log}}</pre>
</div>

JavaScript
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
var app = angular.module('myApp', []).
 
controller('usersCtrl', function($scope, sendingDataSrv) {
    $scope.users = [{
        id: 1,
        name: 'Brad'
    }, {
        id: 2,
        name: 'Angie'
    }, {
        id: 3,
        name: 'Jenny'
    }];
 
    $scope.log = '';
 
    $scope.sendUserData = function(user) {
        var data = angular.toJson(user);
        sendingDataSrv(data).then(function(response) {
            $scope.log =  'Код: ' + response.status +'\nОтвет: '+ response.config.data;
        }, function(response) {
            $scope.log = 'Ошибка: ' + response.status;
        });
    }
}).
 
factory('sendingDataSrv', function($http) {
    return function(user) {
        return $http.post('/echo/json/', user);
    };
});

http://jsfiddle.net/Lvc0u55v/4992/

@BANO · 05.06.2016, 18:58

Не по теме:

Padimanskas, у тебя код невалидный)

Добавлено через 2 минуты
Padimanskas, ан нет, валидный, это меня точки в конце строки насторожили

@Padimanskas · 05.06.2016, 19:12

Не по теме:

Сообщение от BANO

это меня точки в конце строки насторожили

тебя больше ничего не настораживает, а? хватит с линейкой бегать

Новые блоги и статьи Все статьи Все блоги /
Конвертировать закладки radiotray-ng в m3u-плейлист damix 19.02.2026 Это можно сделать скриптом для PowerShell. Использование . \СonvertRadiotrayToM3U. ps1 <path_to_bookmarks. json> Рядом с файлом bookmarks. json появится файл bookmarks. m3u с результатом. # Check if. . .	Семь CDC на одном интерфейсе: 5 U[S]ARTов, 1 CAN и 1 SSI Eddy_Em 18.02.2026 Постепенно допиливаю свою "многоинтерфейсную плату". Выглядит вот так: https:/ / www. cyberforum. ru/ blog_attachment. php?attachmentid=11617&stc=1&d=1771445347 Основана на STM32F303RBT6. На борту пять. . .	Камера Toupcam IUA500KMA Eddy_Em 12.02.2026 Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .	И ясному Солнцу zbw 12.02.2026 И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.
«Знание-Сила» zbw 12.02.2026 «Знание-Сила» «Время-Деньги» «Деньги -Пуля»	SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 12.02.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 11.02.2026 Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image 8Observer8 10.02.2026 Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .

@BANO Ренегат 1740 / 1085 / 386 Регистрация: 06.08.2014 Сообщений: 5,203 Записей в блоге: 1
	05.06.2016, 13:08
	spirikonpro, а как выбирается пользователь в этом dropdown? Добавлено через 2 минуты spirikonpro, у меня есть предложение сделайте скрытый select, у него меняйте значение и отправляйте его 0

@BANO
	05.06.2016, 18:58
	Не по теме: Padimanskas, у тебя код невалидный) Добавлено через 2 минуты Padimanskas, ан нет, валидный, это меня точки в конце строки насторожили 0

Bootstrap и dropdown-menu

Решение