JSFiddle - React, Tailwind, and code Playground
by gustavox
HTML
<div class="container-fluid">
<header class="row"></header>
<div class="row">
<div role="main" class="col-md-8">
<form method="post" id="Cpost" name="Tpost">
<div class="container textWord_about"></div>
<div class="container textWord_about"></div>
<!-- mais 10 divs destas, todas com elementos dentro -->
<div class="container textWord_about">
<div class="row"></div>
<div class="row">
<div class="col-md-9">
<div class="row">
<div class="col-md-8 classdivcol">
<label class="control-label" for="cest"> Estado: <br>
<select name="Test" id="cest" class="select select-primary select-exemploa estado" data-toggle="select">
</select>
</label>
<label class="control-label" for="Ccid"> Cidade:
<select class="select select-primary select-exemploa cidade" name="Tcid" id="Ccid" data-toggle="select">
</select>
</label>
</div>
</div>
</div>
<div class="col-md-3"></div>
</div>
</div>
<div class="container textWord_about"></div>
<div class="container textWord_about">
<div class="row"></div>
<div class="row">
<div class="col-md-9">
<div class="row">
<div class="col-md-8 classdivcol">
<label class="control-label" for="cest2"> Estado: <br>
<select name="Test" id="cest2" class="select select-primary select-exemploa estado" data-toggle="select">
</select>
</label>
<label class="control-label" for="Ccid2"> Cidade:
<select class="select select-primary select-exemploa cidade" name="Tcid" id="Ccid2" data-toggle="select">
</select>
</label>
...
JavaScript
window.onload = function () {
var divs = document.querySelectorAll('form > div');
for (var i = 0; i < divs.length; i++) {
new dgCidadesEstados({
estado: divs[i].querySelector('.estado'),
cidade: divs[i].querySelector('.cidade'),
estadoVal: '<%=Request("estado") %>',
cidadeVal: '<%=Request("cidade") %>'
});
}
}