jquery option value an input

Dieses Thema im Forum "Webentwicklung" wurde erstellt von leex, 18. September 2013 .

  1. 18. September 2013
    Hey,
    ich suche eine Möglichkeit den value der Options an ein input zu übergeben bzw in den value des inputs zu schreiben bevor er abgeschickt wird.

    das ist mein code

    Code:
    <select id="11" onchange="rot_slaveSelect()">
     <option value="11">X</option>
     <option value="12">XL</option>
     <option value="13">XXL</option>
     </select>
     
     <form action="ausgabe.php" method="post">
     <input id="product_11" type="hidden" value="HIER SOLL DER OPTION VALUE REIN" name="product">
     </form>
    lässt sich das mit jquery bewerkstelligen?
     
  2. 18. September 2013
    AW: jquery option value an input

    Code:
    function rot_slaveSelect(){
     var $this = $(this);
     $('#product_11').val( $this.val() );
    }
     
    1 Person gefällt das.
  3. 19. September 2013
    AW: jquery option value an input

    vielen Dank.
    Habs jetzt so eingebaut:

    Code:
    $(document).ready(function(){
     $('#meinselect').change(function(){
     $("#product_11").val($("#meinselect").val()); 
     $("#ausgabe").html($("#meinselect option:selected").text());
     $("#product").html($("#meinselect").val());
     }); 
     });
     
  4. 19. September 2013
    AW: jquery option value an input

    Hab jetzt noch etwas erweiter (funktioniert auch).
    Aber würde gerne wissen ob man das noch optimieren, kürzer machen kann als ich das gemacht habe.

    Code:
    <script type="text/JavaScript">
    
     $(document).ready(function(){
     
     $("#product_11").val($("#meinselect").val());
     $("#product").html($("#meinselect").val());
     $("#ausgabe").html($("#meinselect option:selected").text());
     
     $('#meinselect').change(function(){ 
     $("#product_11").val($("#meinselect").val()); 
     $("#ausgabe").html($("#meinselect option:selected").text());
     $("#product").html($("#meinselect").val());
     }); 
     
     
     });
     
    </script>
    zu sehen hier:
    http://tag.thirty3.de/gs/input.php
     
  5. 19. September 2013
    Zuletzt bearbeitet: 19. September 2013
    AW: jquery option value an input

    Ja das geht:

    Code:
    jQuery(function($) {
     var a = $('#product_11'), b = $('#product'), 
     c = $('#ausgabe'), d = $('#meinselect'), e, f, g; 
     
     d.change(g = function() {
     e = s.val(), f = d.find('option:selected').text();
     a.val(e); 
     b.html(f); 
     c.html(t);
     });
    
     g();
    });
     
  6. 19. September 2013
    AW: jquery option value an input

    Ok. Super. Check ich nur nich mehr ganz durch.

    Ist das viel schneller oder warum ist es besser so?
     
  7. 19. September 2013
    Zuletzt bearbeitet: 19. September 2013
    AW: jquery option value an input

    Jedes Element wird nur einmal (bis auf option:selected) gesucht, kein doppelter Code.
    Schneller gehts ohne jQuery.

    Code:
    document.addEventListener('DOMContentLoaded', function() {
     var a = document.getElementById('product_11'),
     b = document.getElementById('product'),
     c = document.getElementById('ausgabe'),
     d = document.getElementById('meinselect'),
     e, f, g, h;
     
     d.addEventListener('change', h = function() {
     e = d.selectedIndex, 
     f = d.options[e].value, 
     g = d.options[e].textContent;
     a.value = f;
     b.textContent = g;
     c.textContent = g;
     });
     
     h();
    });
     
  8. Video Script

    Videos zum Themenbereich

    * gefundene Videos auf YouTube, anhand der Überschrift.