Ich weiß Variationen dieser Fragen wurden mehrmals auf dieser Website gefragt, aber ich werde es noch einmal versuchen. Ich habe das Gefühl, dass ich jede mögliche Code-Kombination ausprobiert habe, um das zu erreichen, aber ich hatte kein Glück. Alles, was ich tun möchte, ist, den 'Erweitert:' - Text auf dem Button/Dropdown-Schalter zu erhalten, um zu einer der ausgewählten Dropdown-Menüoptionen zu wechseln, wenn darauf geklickt wird (Item1, Item2, usw.).Change Button/Drop-Down-Text zu ausgewählten Dropdown-Artikel
Alle Funktionen werden natürlich nicht in meinem Code enden, aber ich wollte nur Beispiele von dem geben, was ich bereits versucht habe.
$(function() {
$("#dropdown").click(function() {
$("#AdvancedSearch").text($(this).find(":selected").text());
$("#dropdown option:selected").text();
var text = $("#AdvancedSearch").text($(this).text());
alert(text);
});
});
$(".dropdown-menu li a").click(function() {
var selText = $(this).text();
$(this).parents('.input-group-btn').find('.dropdown-toggle').html(selText);
});
$(function() {
$("#dropdown").on('click', 'li a', function() {
$("#AdvancedSubmit").text($(this).text());
$("#AdvancedSubmit").val($(this).text());
});
});
$(function() {
$("#dropdown").click(function() {
$("#AdvancedSubmit").text($(this).text());
$("#AdvancedSubmit").val($(this).text());
});
});
<div class="container">
<div class="row buffer">
<div class="col-xs-1 col-sm-1 col-md-1 col-lg-1 ">
<div class="input-group" role="group" >
<div class="input-group-btn" role="group">
<button type="button" class="btn btn-secondary dropdown-toggle" id="AdvancedSearch" data-toggle="dropdown" OnClick="AdvancedSubmit();" style="background-color:#718CA1;color:#FFF;" > <span class="selection">Advanced:</span></button>
<div class="dropdown-menu" id="dropdown" style="background-color:#718CA1;color:#FFF;">
<li><a class="dropdown-item" href="#" data-value="item1">ITEM1</a></li>
<li><a class="dropdown-item" href="#" data-value="item2">ITEM2</a></li>
<li><a class="dropdown-item" href="#" data-value="item3">ITEM3</a></li>
</div>
</div>
</div>
</div>
<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 text-center">
<div class="input-group" role="group">
<input type="text" id="InquiryInput2" onblur="javascript:removeSpaces()" style="display:none" runat="server" class="form-control" Width="280px" placeholder="Asset Dept, Building, Asset MGR BEMSID #" />
</div>
</div>
</div>
</div>
Und das ist die Kombination, die ich nicht ... habe versucht perfekt funktioniert. Völlig vergessen habe ich die span class = "selection" dort eingefügt. Danke für die Hilfe und schnelle Antwort! – ryan45366
Dies könnte für eine andere Frage geeignet sein, aber da es verwandt ist, habe ich mich gefragt, ob Sie wissen, wie Sie diesen Text davon abhalten können, sich nach einer erneuten Bindung zu ändern? Nachdem der Text der Schaltfläche in die Dropdown-Auswahl geändert wurde, verwende ich diesen Text, um einen Filter für meine sqlbuilder.where-Klausel zu erstellen. Wenn ich den Suchknopf wähle, obwohl die Seite aktualisiert wird und die Änderung löscht? Irgendwelche Ideen, wie man die Änderung behält, bis der Benutzer sich entscheidet, sie zu ändern? – ryan45366
Sie hatten Recht, es ist eine zu lange Frage für einen Kommentar :) – technico