Avatar billede troels_p Nybegynder
09. juli 2013 - 10:35 Der er 16 kommentarer og
1 løsning

Tilføj tekst til textarea fra dropdown

Hej,

Jeg sidder med en side, hvor jeg kan tilføje tekst ved at vinge checkboxes af - det virker fantastisk.

Jeg kan dog ikke få det til at virke med dropdown. Den skal tilføje teksten, og ikke slette eller rette noget i mit textarea.

Jeg har følgende kode, jeg har forsøgt at adaptere fra checkboxes, men er for uerfaren til at få det til at virke:

  <script type="text/javascript">
    function addToList2(checkObj, outputObjID)
    {
        var checkGroup = checkObj.form[checkObj.name];
        var checkGroupLen = checkGroup.length;
        var valueList = new Array();
        for (var i=0; i<checkGroupLen; i++)
        {
          if (checkGroup[i].checked)
          {
              valueList[valueList.length] = checkGroup[i].value;
          }
        }
        document.getElementById(outputObjID).value = valueList.join('\r\n');
        return;
    }
</script>


Min dropdown er som følger:
Antal:<select name="service[]" onchange="addToList2(this, 'txt1')"><option></option><option value="1">1</option><option value="2">2</option></select>

Hjælp? :-)
Avatar billede skelboe Nybegynder
09. juli 2013 - 10:58 #1
Prøv med følgende kode


function addToList2(dropdown, outputObjID) {
  var selectedValue = dropdown.options[dropdown.selectedIndex].value;
  document.getElementById(outputObjID).value += selectedValue + "\r\n";
}
Avatar billede troels_p Nybegynder
09. juli 2013 - 11:07 #2
Det virker - ish...

Værdien bliver tilføjet, men så snart jeg rører en anden checkbox forsvinder værdien. :-(
Avatar billede skelboe Nybegynder
09. juli 2013 - 11:12 #3
Det er nok fordi koden ved checkboxe bruge "=" til at sætte værdien, frem for at tilføje den med "+="
Avatar billede troels_p Nybegynder
09. juli 2013 - 11:21 #4
function addToList(checkObj, outputObjID)
    {
        var checkGroup = checkObj.form[checkObj.name];
        var checkGroupLen = checkGroup.length;
        var valueList = new Array();
        for (var i=0; i<checkGroupLen; i++)
        {
          if (checkGroup[i].checked)
          {
              valueList[valueList.length] = checkGroup[i].value;
          }
        }
        document.getElementById(outputObjID).value = valueList.join('\r\n');
        return;
    }



Har du nogen chance for at se om det er += / = det går galt ved?

Jeg skal beklage jeg er så håbløst blank på JS...
Avatar billede skelboe Nybegynder
09. juli 2013 - 11:27 #5
Prøv at ændre
document.getElementById(outputObjID).value = valueList.join('\r\n');


til at være
document.getElementById(outputObjID).value += valueList.join('\r\n');
Avatar billede troels_p Nybegynder
09. juli 2013 - 11:31 #6
Har jeg faktisk lige prøvet - så går den helt i selvsving med at duplikere hvad der i forvejen er markeret, hver gang jeg vælger en ny checkbox.
Avatar billede skelboe Nybegynder
09. juli 2013 - 11:36 #7
Det ville nok være bedst at kombinere dine funktioner så den sætter data ind på ny hver gang du foretager dit et nyt valg
Avatar billede troels_p Nybegynder
09. juli 2013 - 11:40 #8
Og det gør jeg hvorledes? :-)

Du kan se en de-branded udgave her:
http://www.v-its.dk/eksperten.html
Avatar billede skelboe Nybegynder
09. juli 2013 - 11:51 #9
Prøv med dette


<script type="text/javascript">
      var selectionHasChanged = function() {
        // det samlede indhold
        var output = []

        // hent indholdet af service checkboxes
        var services = document.getElementsByName('service[]');
        for(var i = 0; i < services.length; i++) {
          if ( services[i].checked ) {
            output.push(services[i].value);
          }
        }

        // hent indholdet af dropdown
        var dropdown = document.getElementsByName('antal');
        if (dropdown && dropdown.selectedIndex > 0) {
          output.push(dropdown.options[dropdown.selectedIndex].value);
        }

        // saml alt indholde
        document.getElementById('txt1').value = output.join("\n");
      }
    </script>


og så ændre alle dine
onClick="addToList(this, 'txt1')"


til
onClick="selectionHasChanged()"


så skal din dropdown bare have se sådan her ud

<select name="antal" onchange="selectionHasChanged()">
  <option>Vælg antal ...</option>
  <option value="1">1</option>
  <option value="2">2</option>
</select>
Avatar billede troels_p Nybegynder
09. juli 2013 - 12:41 #10
Det er smidt op:

http://www.v-its.dk/eksperten.html

Dropdown virker dog bare ikke :-(
Avatar billede skelboe Nybegynder
09. juli 2013 - 12:47 #11
Ændre koden til

<script type="text/javascript">
      var selectionHasChanged = function() {
        // det samlede indhold
        var output = []

        // hent indholdet af service checkboxes
        var services = document.getElementsByName('service[]');
        for(var i = 0; i < services.length; i++) {
          if ( services[i].checked ) {
            output.push(services[i].value);
          }
        }

        // hent indholdet af dropdown
        var dropdown = document.getElementById('antal');
        if (dropdown && dropdown.selectedIndex > 0) {
          output.push(dropdown.options[dropdown.selectedIndex].value);
        }

        // saml alt indholde
        document.getElementById('txt1').value = output.join("\n");
      }
    </script>


så skal din dropdown bare have se sådan her ud

<select id="antal" onchange="selectionHasChanged()">
  <option>Vælg antal ...</option>
  <option value="1">1</option>
  <option value="2">2</option>
</select>
Avatar billede troels_p Nybegynder
09. juli 2013 - 12:53 #12
Nu er jeg OAB, checkboxes kommer i rækkefølgen de er listet i i tabellen, mens dropdown altid bliver tilføjet nederst i textarea, uanset om jeg vælger dem først, "i midten" eller til sidst. :-(
Avatar billede skelboe Nybegynder
09. juli 2013 - 12:56 #13
Poster du formen, eller er den bare brug til at indhente oplysninger til tekstfeltet?
Avatar billede troels_p Nybegynder
09. juli 2013 - 13:01 #14
Den skal ikke postes, jeg skal bare markere textarea og copy-paste fra loggen til et andet program. :-)
Avatar billede skelboe Nybegynder
09. juli 2013 - 13:10 #15
Nu har jeg lige ændret lidt på hvordan den fungere

Nyt script

<script type="text/javascript">
  var selectionHasChanged = function() {
    // det samlede indhold
    var output = []

    // hent indholdet af service checkboxes
    var services = document.getElementsByName('service');
    for(var i = 0; i < services.length; i++) {
      var service = services[i];

      switch(service.type) {
        case 'checkbox':
        if ( service.checked ) {
          output.push(service.value);
        }
        break;

        case 'select-one':
        if (service.selectedIndex > 0) {
          output.push(service.options[service.selectedIndex].value);
        }
        break;
      }
    }

    // saml alt indhold
    document.getElementById('txt1').value = output.join("\n");
  }
</script>


Dine checkboxes skal se sådan her ud

<input type="checkbox" name="service" onchange="selectionHasChanged()" value="value">


og dine dropdowns

<select name="service" onchange="selectionHasChanged()">


Nu samler den all inputs der hedder service i den rækkefølge de findes i html koden
Avatar billede troels_p Nybegynder
09. juli 2013 - 13:27 #16
Det funker! Læg endelig et svar! :-)
Avatar billede skelboe Nybegynder
09. juli 2013 - 13:30 #17
svar :)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester