Ako obnoviť pole HTML pri výbere rozbaľovacieho zoznamu? - javascript, jquery, html

Chcem získať pole html (rozbaľovací zoznam)obnovený, keď ho v predvolenom nastavení dostanem po kliknutí na typ grafu z rozbaľovacieho zoznamu (typ grafu). Predvolený výber po výbere grafu je uvedený nižšie: (ak z rozbaľovacieho zoznamu vyberiem možnosť „Výsečový graf 2D“)

Ak teraz vyberiem iný podobný graf „Výsečový graf 3D“ (ktorý má rovnaké rozbaľovacie pole) a tiež vyberiem údaje poľa, potom je obrázok nasledovný:

PROBLÉM

Teraz, ak znova vyberiem „koláčový graf 2D“z rozbaľovacieho zoznamu už mám toto druhé obrazové pole nastavené. Chcem, aby sa pole obnovilo, ako je to znázornené na 1. obrázku koláčového grafu 2D. Ako by som teda mal toto pole obnoviť?

POZNÁMKA: Pole, ktoré chcem obnoviť na predvolené, je „Definujte os X“ rozbaľovacieho zoznamu.

Dúfam, že som vyriešil svoj problém, v prípade zámeny v porozumení odpoviem čoskoro. Dúfam, že to nie je ťažké vyriešiť!

Ďakujem za Váš čas.

odpovede:

3 pre odpoveď č. 1

Môžete pridať onchange poslucháč udalostí podľa vášho výberu. Ak máte funkciu updateDiv() v JS, ktorý by aktualizoval váš <div> prvok, ktorý chcete volať so zmenou <select> element:

V HTML:

<select id="chartType" onchange="resetFieldToDefault();">

V jQuery:

$("select#chartType").change(resetFieldToDefault);

In (plain) JS:

document.getElementById("chartType").addEventListener("change", resetFieldToDefault);

UPRAVIŤ

Nemyslím si, že som na otázku odpovedal správnevyššie. Domnievam sa, že otázka bola viac v súlade s témou: Ako by som mohol zrušiť výber všetkých možností v tomto poli (po zmene vybratého poľa)? Takže som odpovedal iba na prvú časť otázky, ale na druhú časť týkajúcu sa resetovania druhej <select> prvok zostáva nevyrovnaný. (Mám pravdu?)

Ak to chcete urobiť, pridajte poslucháča, ako je uvedené vyššie. A potom pridajte (obyčajnú) funkciu JS:

var resetFieldToDefault = function() {
var selectedOptions = document.getElementById("xAxisSelect").selectedOptions;
for(var i = 0; i < selectedOptions.length; i++)
selectedOptions[i].selected = false;
}

---

0 pre odpoveď č. 2

Urobil by som niečo takéto:

$("#chartType).on("change", function() {
refreshDivs(this.val());
});

function refreshDivs(value) {
if(value=="Scatter Chart") {
$("#divEventCategory").hide();
$("#divEventSubCategory").hide();
} else if ((value=="Bubble Chart") {
$("#divEventCategory").show();
$("#divEventSubCategory").show();
}
}

Ak potrebujete aktualizovať obsah rozbaľovacích zoznamov / zoznamov na základe výberu, stačí pridať aj kód do príslušnej sekcie.

---