Ankündigung

Einklappen
Keine Ankündigung bisher.

jQuery, <select>, options zählen

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • jQuery, <select>, options zählen

    Hallo,

    ich würde gerne über ein jQuery-Objekt (<select>) die Anzahl der Options herausfinden, $("select#myId").options.length klappt schonmal nicht.

    Hintergrund:
    Ich habe eine verschachtelte Auswahl von zwei Feldern, die linke bestimmt, was in der rechten zu sehen ist. Wenn die linke verändert wird, hole ich per AJAX ein HTML-Template, das mir nur die <option>s dafür ausgegeben hat, Antwort von AJAX also z.B. soetwas:
    Code:
    <option label="allgemein" value="14">allgemein</option>
    (hier Sonderfall: nur ein <option> als Rückgabewert)

    Der Code dazu sieht in etwa so aus:
    Code:
    $.post(url, data, function(response) {
        try {
            // load response into our <select> box
            details.html(response);
            window.console.log(details, response, details.html());
            // ..
            if (details.options.length == 1 && typeof details.onchange == "function") {
                details.onchange();
            }
        } catch (e) {
            // error, load nothing, keep form elements disabled
            window.console.log(e);
            details.html("");
        }
    });
    Meine Firebugausgabe:
    Code:
     jQuery(select#OBJ_LOCATION_DETAIL-2.formElements)
    <option label="kein Eintrag" value="1">kein Eintrag</option>
    <option label="kein Eintrag" value="1">kein Eintrag</option>
    Ziel ist es, wenn nur ein <option>-Element zurückgekommen ist, ich das onchange() dieser zweiten <select>-Box ansteuern möchte.

    Ich habe auch schon folgendes probiert:
    Code:
    var options = $(details + " option");
    also die <option>s in ein jQuery-Objekt zu laden und dann die Länge auszulesen.

    Jemand ne Idee dazu?

    Edit: Das doofe ist, ich kenn den Namen der zweiten <select>-Box garnicht, sondern hab nur dessen jQuery-Objekt, insofern weiß ich auch nicht, wie ich $(??? + " option") bauen könnte, denke funktionieren sollte es ja. Kann ich irgendwie das tatsächliche DOM-Objekt von jQuery() erhalten?
    "[URL="http://www.youtube.com/watch?v=yMAa_t9k2VA&feature=youtu.be&t=25s"]Mein Name ist Lohse, ich kaufe hier ein.[/URL]"

  • #2
    Code:
    $("select#myId").find("option").length
    würde ich spontan behaupten

    edit: geht auch ohne traversing:

    Code:
    $("select#myId option").length
    edit2:

    Am einfachsten würdest du es dir machen, wenn du z.b. json verwendest und jedes option ein object darstellt.
    bspw:
    Code:
    var data = {
        options: [
            {
            val: "xyz",
              text : "xyz",
              label : "xyz"
            },
            { val: "xyz",
              text : "xyz",
              label : "xyz"
            },
            { val: "xyz",
              text : "xyz",
              label : "xyz"
            }
        ],
        success : true
    }
    fände ich schöner als html zu laden und macht es dir einfacher, das entsprechende Ereignis zu laden
    I like cooking my family and my pets.
    Use commas. Don't be a psycho.
    [URL="http://jscouch.de"]Blog[/URL] - [URL="http://coverflowjs.github.io/coverflow/"]CoverflowJS[/URL]

    Kommentar


    • #3
      find ist glaube ich nicht nötig.

      Code:
      $('#myId option').size();
      oder
      Code:
      $('#myId > option').size();
      oder
      Code:
      var mySelect = $('#myId');
      $('option' , mySelect).size();
      oder
      Code:
      $('#myId').each(function (){
        var options = $('option' , this);
        alert (options.size());
      });
      usw.

      ODER

      Code:
      $('#myId').get(0) // hier weiter mit plain DOM/JS
      [COLOR="#F5F5FF"]--[/COLOR]
      [COLOR="Gray"][SIZE="6"][FONT="Georgia"][B]^^ O.O[/B][/FONT] [/SIZE]
      „Emoticons machen einen Beitrag etwas freundlicher. Deine wirken zwar fachlich richtig sein, aber meist ziemlich uninteressant.
      [URL="http://www.php.de/javascript-ajax-und-mehr/107400-draggable-sorttable-setattribute.html#post788799"][B]Wenn man nur Text sieht, haben viele junge Entwickler keine interesse, diese stumpfen Texte zu lesen.“[/B][/URL][/COLOR]
      [COLOR="#F5F5FF"]
      --[/COLOR]

      Kommentar


      • #4
        Hallo,

        find kannte ich noch garnicht, hab es jetzt so:
        Code:
        var select = details.get(0);
        //window.console.log(select.options, select.length, select.onchange);
        if (select.length == 1 && typeof select.onchange == "function") {
          select.onchange();
        }
        Danke dir trotzdem!
        "[URL="http://www.youtube.com/watch?v=yMAa_t9k2VA&feature=youtu.be&t=25s"]Mein Name ist Lohse, ich kaufe hier ein.[/URL]"

        Kommentar


        • #5
          Schau mal meinen 2. edit an, halte ich für am elegantesten, gar nicht erst html zu laden. Machst dir auch selbst das Arbeiten einfacher und angenehmer.

          edit:
          Nikosch, size() gibt einfach nur length zurück, von dem her eigentlich unnütz.
          I like cooking my family and my pets.
          Use commas. Don't be a psycho.
          [URL="http://jscouch.de"]Blog[/URL] - [URL="http://coverflowjs.github.io/coverflow/"]CoverflowJS[/URL]

          Kommentar


          • #6
            Schau Dir auch mal meine div. Ergänzungen an.

            [edit]
            Vor allem bzgl.
            Edit: Das doofe ist, ich kenn den Namen der zweiten <select>-Box garnicht, sondern hab nur dessen jQuery-Objekt, insofern weiß ich auch nicht, wie ich $(??? + " option") bauen könnte, denke funktionieren sollte es ja. Kann ich irgendwie das tatsächliche DOM-Objekt von jQuery() erhalten?
            passt die Variante:

            $('option' , jQueryObject). ...

            oder eben das DOM Object über get(0).
            [COLOR="#F5F5FF"]--[/COLOR]
            [COLOR="Gray"][SIZE="6"][FONT="Georgia"][B]^^ O.O[/B][/FONT] [/SIZE]
            „Emoticons machen einen Beitrag etwas freundlicher. Deine wirken zwar fachlich richtig sein, aber meist ziemlich uninteressant.
            [URL="http://www.php.de/javascript-ajax-und-mehr/107400-draggable-sorttable-setattribute.html#post788799"][B]Wenn man nur Text sieht, haben viele junge Entwickler keine interesse, diese stumpfen Texte zu lesen.“[/B][/URL][/COLOR]
            [COLOR="#F5F5FF"]
            --[/COLOR]

            Kommentar


            • #7
              @rudygotya
              Ja, prinzipiell sicherlich die Beste Sache, nur ist mein AJAX-Request relativ allgemein gehalten und gibt für diese und ähnliche Aktionen immer nur HTML zurück. Kann man mit jQuery() denn aber (performant, am Besten per Header) herausfinden, ob eine Antwort HTML oder JSON ist?

              Der Grund für HTML ist, dass ich ein DOM-Inferno wie bei meinem letzten Projekt vermeiden möchte, sprich jegliche Generierung von HTML soll server-seitig durchgeführt werden. Das hat sicherlich einige Nachteile bei z.B. soetwas wie hier, aber dadurch habe ich Validierung und Design eben nur zentral an einer Stelle (den Views auf dem Server).

              @nikosch:
              oder eben das DOM Object über get(0).
              Ich hatte es zurst über get(), weil ich dachte, ist ja nur ein Objekt drinne, und dann hat .length sogar funktioniert, da eben ein Array der Länge 1 zurück kam, was zufällig auch Sinn machte, weil ich auch nur eine <option> hatte. Aber war natürlich trotzdem falsch. Mit get(0) gehts prima.
              "[URL="http://www.youtube.com/watch?v=yMAa_t9k2VA&feature=youtu.be&t=25s"]Mein Name ist Lohse, ich kaufe hier ein.[/URL]"

              Kommentar


              • #8
                jQuery.isPlainObject() – jQuery API
                typeof müsste im Prinzip auch gehen.
                [COLOR="#F5F5FF"]--[/COLOR]
                [COLOR="Gray"][SIZE="6"][FONT="Georgia"][B]^^ O.O[/B][/FONT] [/SIZE]
                „Emoticons machen einen Beitrag etwas freundlicher. Deine wirken zwar fachlich richtig sein, aber meist ziemlich uninteressant.
                [URL="http://www.php.de/javascript-ajax-und-mehr/107400-draggable-sorttable-setattribute.html#post788799"][B]Wenn man nur Text sieht, haben viele junge Entwickler keine interesse, diese stumpfen Texte zu lesen.“[/B][/URL][/COLOR]
                [COLOR="#F5F5FF"]
                --[/COLOR]

                Kommentar

                Lädt...
                X