[ Príspevkov: 8 ] 
AutorSpráva
Offline

Užívateľ
Užívateľ
Obrázok užívateľa

Registrovaný: 17.03.13
Prihlásený: 09.04.18
Príspevky: 112
Témy: 39 | 39
NapísalOffline : 24.11.2016 19:17 | Ziskanie textu zo zoznamu do inputu

Zdravím, myslím že názov vystihuje čo potrebujem. Potrebujem dosť text zo zoznamu do inputu. Háčik je aj v tom, že text ktory potrebujem dostať do inputu musí byť aj z nadradeneho li aj z jeho podkategorie(Môj prípad napríklad Freeflow Tristar). Viete mi niekto poradiť kód v js alebo ked sa dá nahodou cez nejake classy Bootstrapu. Ďakujem krasne
Kód:
Kód:
<input type="tel" class="form-control no-border no-padding">                 
                <a role="button" data-toggle="collapse" href="#list" aria-expanded="false" aria-controls="list"><span class="arrow" data-toggle="group" data-target="#list" aria-expanded="false" aria-controls="list"></span></a></input>
                <ul id="list" class="group" >
                  <li class="list-group-item">Freeflow
                    <ul class="list-group">
                      <li class="list-group-item">Excursion</li>
                      <li class="list-group-item">Monterey</li>
                      <li class="list-group-item">Aptos</li>
                      <li class="list-group-item">Azure</li>
                      <li class="list-group-item">Tristar</li>
                      <li class="list-group-item">Cascina</li>
                      <li class="list-group-item">Mini</li>
                    </ul>
                  </li>
                  <li class="list-group-item">Freeflow
                    <ul class="list-group">
                      <li class="list-group-item">Excursion</li>
                      <li class="list-group-item">Monterey</li>
                      <li class="list-group-item">Aptos</li>
                      <li class="list-group-item">Azure</li>
                      <li class="list-group-item">Tristar</li>
                    </ul>
                  </li>
                  <li class="list-group-item">Freeflow
                    <ul class="list-group">
                      <li class="list-group-item">Excursion</li>
                      <li class="list-group-item">Monterey</li>
                      <li class="list-group-item">Aptos</li>
                      <li class="list-group-item">Azure</li>
                      <li class="list-group-item">Tristar</li>
                    </ul>
                  </li>
                  <li class="list-group-item">Freeflow
                    <ul class="list-group">
                      <li class="list-group-item">Excursion</li>
                      <li class="list-group-item">Monterey</li>
                      <li class="list-group-item">Aptos</li>
                      <li class="list-group-item">Azure</li>
                      <li class="list-group-item">Tristar</li>
                      <li class="list-group-item">Cascina</li>
                      <li class="list-group-item">Mini</li>
                    </ul>
                  </li>         
                </ul>


Offline

Užívateľ
Užívateľ
Obrázok užívateľa

Registrovaný: 06.02.14
Prihlásený: 19.01.18
Príspevky: 443
Témy: 9 | 9
NapísalOffline : 26.11.2016 12:20 | Ziskanie textu zo zoznamu do inputu

preco mas html kod v <input> ? to nie je validne ;)

za 1. dopln napriklad <span class="list-group-parent"> okolo textu rodica, aby bolo mozne jednoduchsie dostat dany text -> <span class="list-group-parent">freeflow</span>

a potom s jquery:
Kód:
var $listItems = $l('.list-group-item');
var $input = $('.form-control');
$listItems.on('click', function() {
  var $parent = $(this).parents('.list-group-item').children('.list-group-parent');
  var inputValue = $parent.innerHTML + " " + $(this).innerHTML;
  $input.val(inputValue);
});


ps: kod som netestoval, tak nerucim ze na 100% funguje ;)


Offline

Skúsený užívateľ
Skúsený užívateľ
Obrázok užívateľa

Registrovaný: 17.07.11
Prihlásený: 17.09.19
Príspevky: 1501
Témy: 2 | 2
NapísalOffline : 26.11.2016 14:31 | Ziskanie textu zo zoznamu do inputu

1. html v inpute je naozaj hovadina, input nie je párový tag.

2. hatto správne napísal, že to Freeflow určite obaľ nejakým elementom. Len to trochu opravím, lebo ten jeho javascript nemusí úplne fungovať (a je trochu dlhý)
Kód:
$('.list-group-item').click( function() {
  var parentText = $(this).closest('.list-group-item').children('.list-group-parent').first().html();
  var inputValue = $parentText + " " + $(this).html();
  $('#IDinputu').val(inputValue); //tu daj inputu urcite nejake jednoznacne ID, pretoze classu .form-control moze mat vela inputov na stranke
});

a doplním, že tento kód vyžaduje jQuery


_________________
Na súkromné správy týkajúce sa problémov, ktoré sa riešia vo fóre, neodpovedám!
Offline

Užívateľ
Užívateľ
Obrázok užívateľa

Registrovaný: 17.03.13
Prihlásený: 09.04.18
Príspevky: 112
Témy: 39 | 39
Napísal autor témyOffline : 27.11.2016 12:14 | Ziskanie textu zo zoznamu do inputu

Vdaka uz to cosi vypisuje do toho inputu no je to toto:
Kód:
undefined Freeflow                    <ul class="list-group">                      <li class="list-group-item" value="Excursion">Excursion</li>                      <li class="list-group-item" value="Monterey">Monterey</li>                      <li class="list-group-item" value="Aptos">Aptos</li>                      <li class="list-group-item" value="Azure">Azure</li>                      <li class="list-group-item" value="Tristar">Tristar</li>                      <li class="list-group-item" value="Cascina">Cascina</li>                      <li class="list-group-item" value="Mini">Mini</li>                    </ul>


neviem, nebolo by dobre dat kazdemu li rovnaku value ako je jeho text a volat tu value?


Offline

Skúsený užívateľ
Skúsený užívateľ
Obrázok užívateľa

Registrovaný: 17.07.11
Prihlásený: 17.09.19
Príspevky: 1501
Témy: 2 | 2
NapísalOffline : 27.11.2016 13:11 | Ziskanie textu zo zoznamu do inputu

Tag li nemá atribút value, to v prvom rade (má iba pre ol zoznamy http://www.w3schools.com/tags/att_li_value.asp)

V druhom rade - pošli sem upravený html kód aj s tým javascriptom.


_________________
Na súkromné správy týkajúce sa problémov, ktoré sa riešia vo fóre, neodpovedám!
Offline

Užívateľ
Užívateľ
Obrázok užívateľa

Registrovaný: 17.03.13
Prihlásený: 09.04.18
Príspevky: 112
Témy: 39 | 39
Napísal autor témyOffline : 27.11.2016 14:14 | Ziskanie textu zo zoznamu do inputu

Kód:
<div class="input-group form-group">         
                <span class="input-group-addon no-border no-padding">Model*</span>
                <input type="tel" id="model" class="form-control no-border no-padding">                 
                <a role="button" data-toggle="collapse" href="#list" aria-expanded="false" aria-controls="list"><span class="arrow"></span></a>
                <ul id="list" class="group collapse " data-toggle="collapse" >
                  <li class="list-group-item list-group-parent">Freeflow
                    <ul class="list-group">
                      <li class="list-group-item">Excursion</li>
                      <li class="list-group-item">Monterey</li>
                      <li class="list-group-item">Aptos</li>
                      <li class="list-group-item">Azure</li>
                      <li class="list-group-item">Tristar</li>
                      <li class="list-group-item">Cascina</li>
                      <li class="list-group-item">Mini</li>
                    </ul>
                  </li>
                  <li class="list-group-item list-group-parent">Freeflow
                    <ul class="list-group">
                      <li class="list-group-item">Excursion</li>
                      <li class="list-group-item">Monterey</li>
                      <li class="list-group-item">Aptos</li>
                      <li class="list-group-item">Azure</li>
                      <li class="list-group-item">Tristar</li>
                    </ul>
                  </li>
                  <li class="list-group-item list-group-parent" value="Freeflow">Freeflow
                    <ul class="list-group">
                      <li class="list-group-item">Excursion</li>
                      <li class="list-group-item">Monterey</li>
                      <li class="list-group-item">Aptos</li>
                      <li class="list-group-item">Azure</li>
                      <li class="list-group-item">Tristar</li>
                    </ul>
                  </li>
                  <li class="list-group-item list-group-parent">Freeflow
                    <ul class="list-group">
                      <li class="list-group-item">Excursion</li>
                      <li class="list-group-item">Monterey</li>
                      <li class="list-group-item">Aptos</li>
                      <li class="list-group-item">Azure</li>
                      <li class="list-group-item">Tristar</li>
                      <li class="list-group-item">Cascina</li>
                      <li class="list-group-item">Mini</li>
                    </ul>
                  </li>         
                </ul>
              </div>
            </div>
           

            <div class="col-md-12">
              <label for="comment" class="comment"><p>* Údaje sú povinné</p>
              <span class="ask">Ak máte akekoľvek otázky, napíšte nám:</span></label>
              <textarea class="form-control no-border" rows="5"></textarea>
            </div>

            <div class="col-md-4 col-xs-12">
              <button type="submit" class="btn submit-btn">odoslať</button>
            </div>
            <div class="clearfix"></div>
          </form>
      </div>

    </div>

  </div>
</div>

    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>

    <script>
      $(document).on('click','.group.collapse',function(e) {
       
        if( $(e.target).is('li') ) {
          $(this).collapse('hide');
        }
      });

      $('.list-group-item').click( function() {
        var parentText = $(this).closest('.list-group-item').children('.list-group-parent').first().html();
        var inputValue = parentText + " " + $(this).html();
         $('#list').val(inputValue);
      });

    </script>

Teraz mi to prezmenu zasa neide :( :?


Offline

Skúsený užívateľ
Skúsený užívateľ
Obrázok užívateľa

Registrovaný: 17.07.11
Prihlásený: 17.09.19
Príspevky: 1501
Témy: 2 | 2
NapísalOffline : 27.11.2016 15:06 | Ziskanie textu zo zoznamu do inputu

Poradím ti toľkoto:

1. Písali sme ti, že to Freeflow máš obaliť do nejakého tagu, aby sa odtiaľ dal získať text. Šturktúra zoznamu má teda vyzerať takto
Kód:
<ul class="group collapse " data-toggle="collapse" >
                  <li class="list-group-item list-group-parent">

                        <span class="list-group-title">Freeflow</span>

                        <ul class="list-group">
                          <li class="list-group-item">Excursion</li>
                          <li class="list-group-item">Monterey</li>
                          <li class="list-group-item">Aptos</li>
                          <li class="list-group-item">Azure</li>
                          <li class="list-group-item">Tristar</li>
                          <li class="list-group-item">Cascina</li>
                          <li class="list-group-item">Mini</li>
                        </ul>

                  </li>

atd...


2. Po kliknutí na list-group-item potmo zavoláš javascript, ktorý nájde najbližšieho predka s classou list-group-parent a vyberie text z prvého elementu s classou list-group-title.
Potom to spojíš s textom vybraného li a naplníš input (tam patrí ID inputu, ty tam máš #list, neviem prečo)
Takže poupravíš telo tej funkcie click, to nechám na teba ;)
Len ešte poradím zlepšovák - táto rekurzívna štruktúra je trocha divoká, takže pomôže toto:
Kód:
$('.list-group-item').not('.list-group-parent').click( function(evt) {
 ... tu dopln upraveny kod
});


_________________
Na súkromné správy týkajúce sa problémov, ktoré sa riešia vo fóre, neodpovedám!
Offline

Užívateľ
Užívateľ
Obrázok užívateľa

Registrovaný: 17.03.13
Prihlásený: 09.04.18
Príspevky: 112
Témy: 39 | 39
Napísal autor témyOffline : 27.11.2016 15:41 | Ziskanie textu zo zoznamu do inputu

Mamto velmi pekne dakujem ;)


 [ Príspevkov: 8 ] 


Ziskanie textu zo zoznamu do inputu



Podobné témy

 Témy  Odpovede  Zobrazenia  Posledný príspevok 
V tomto fóre nie sú ďalšie neprečítané témy.

Pridanie textu do inputu

v JavaScript, VBScript, Ajax

7

366

19.11.2010 16:01

emer

V tomto fóre nie sú ďalšie neprečítané témy.

ziskanie textu DIV elementu

v JavaScript, VBScript, Ajax

2

532

14.09.2007 19:44

Bananslovak

V tomto fóre nie sú ďalšie neprečítané témy.

Získanie hostingu == získanie IP adresy?

v Webhosting a servery

3

308

15.06.2013 18:28

majky358

V tomto fóre nie sú ďalšie neprečítané témy.

Zmena textu a zanechani pozice v textu

v PHP, ASP

4

420

01.08.2009 21:26

Tominator

V tomto fóre nie sú ďalšie neprečítané témy.

blokovanie inputu

v JavaScript, VBScript, Ajax

5

414

12.09.2008 13:48

emer

V tomto fóre nie sú ďalšie neprečítané témy.

mazanie inputu

v JavaScript, VBScript, Ajax

2

586

03.11.2007 12:49

Flety

V tomto fóre nie sú ďalšie neprečítané témy.

odkrytie inputu

v JavaScript, VBScript, Ajax

4

441

18.12.2008 15:44

chrono

V tomto fóre nie sú ďalšie neprečítané témy.

rozobratie zoznamu v Exceli

v Ostatné programy

3

632

26.12.2008 18:16

Tominator

V tomto fóre nie sú ďalšie neprečítané témy.

stiahnutie databazy zo zoznamu

v Ostatné programy

4

156

02.09.2014 16:35

harry44

V tomto fóre nie sú ďalšie neprečítané témy.

Maska text inputu

v JavaScript, VBScript, Ajax

5

535

16.01.2008 19:32

sento

V tomto fóre nie sú ďalšie neprečítané témy.

zmena inputu pomocou onchange

v JavaScript, VBScript, Ajax

7

637

30.01.2009 22:22

djsulo

V tomto fóre nie sú ďalšie neprečítané témy.

Pridanie inputu cez innerHTML

v JavaScript, VBScript, Ajax

6

279

29.05.2010 12:00

camo

V tomto fóre nie sú ďalšie neprečítané témy.

Vyrobenie zoznamu zloziek na FTP servery

v Sieťové a internetové programy

0

273

08.12.2007 15:51

Dzimbo

V tomto fóre nie sú ďalšie neprečítané témy.

Poslat do inputu php kód

v PHP, ASP

7

287

11.08.2012 23:43

1daemon1

V tomto fóre nie sú ďalšie neprečítané témy.

Zmena obsahu počas zmeny inputu

v JavaScript, VBScript, Ajax

2

332

17.04.2009 19:32

Flety

V tomto fóre nie sú ďalšie neprečítané témy.

ST dostal pokutu za neposkytovanie telefónneho zoznamu

v Novinky

9

561

12.08.2008 0:07

OmeGa



© 2005 - 2019 PCforum, edited by JanoF