How I can create multiple populating dropdown list in Express.js with handlebars
enter code hereI want to create populating dropdown list. like one dropdown will have Car types (Sport, Luxury, SUV, etc) stored in mongodb using mongoose and another dropdown will have car names like (Ferrari, Lamborghini, Rollce Royece) also stored in mongodb. If i select car type as "sport" in one dropdown, another dropdown should show only sport cars name fetch from mongoDB using mongoose.
Express Js
app.get('/car', (req, res) => {
res.render('car/');
});
index.handlebars
<div class="row mb-3">
<div class="col">
<input type="hidden" name="_method" value="PUT">
<div class="form-group dropdown">
<label for="Category" value=""> Select Category </label>
<select class="form-control" id="" name="Category">
{{#each category}}
<option>{{category}}</option>
{{/each}}
</select>
</div>
</div>
<div class="col">
<div class="form-group dropdown">
<label for="Car" value=""> Select Car</label>
<select class="form-control" id="" name="Car">
{{#each Car}}
<option>{{car}}</option>
{{/each}}
</select>
</div>
</div>
</div>
Category model.js
const CarSchema= new Schema({
Category: {
type: String,
required: true
},
CarName: {
type: String,
required: true
}
});
node.js mongodb express mongoose handlebars.js
asked Nov 23 '18 at 18:46
Pranay SalvePranay Salve
62
add a comment |
enter code hereI want to create populating dropdown list. like one dropdown will have Car types (Sport, Luxury, SUV, etc) stored in mongodb using mongoose and another dropdown will have car names like (Ferrari, Lamborghini, Rollce Royece) also stored in mongodb. If i select car type as "sport" in one dropdown, another dropdown should show only sport cars name fetch from mongoDB using mongoose.
Express Js
app.get('/car', (req, res) => {
res.render('car/');
});
index.handlebars
<div class="row mb-3">
<div class="col">
<input type="hidden" name="_method" value="PUT">
<div class="form-group dropdown">
<label for="Category" value=""> Select Category </label>
<select class="form-control" id="" name="Category">
{{#each category}}
<option>{{category}}</option>
{{/each}}
</select>
</div>
</div>
<div class="col">
<div class="form-group dropdown">
<label for="Car" value=""> Select Car</label>
<select class="form-control" id="" name="Car">
{{#each Car}}
<option>{{car}}</option>
{{/each}}
</select>
</div>
</div>
</div>
Category model.js
const CarSchema= new Schema({
Category: {
type: String,
required: true
},
CarName: {
type: String,
required: true
}
});
node.js mongodb express mongoose handlebars.js
asked Nov 23 '18 at 18:46
Pranay SalvePranay Salve
62
Would be great if you can show the code you were working on. That way, it will be easier to help you.
– Cartucho
Nov 23 '18 at 19:57
please go through the code
– Pranay Salve
Nov 24 '18 at 4:21
add a comment |
enter code hereI want to create populating dropdown list. like one dropdown will have Car types (Sport, Luxury, SUV, etc) stored in mongodb using mongoose and another dropdown will have car names like (Ferrari, Lamborghini, Rollce Royece) also stored in mongodb. If i select car type as "sport" in one dropdown, another dropdown should show only sport cars name fetch from mongoDB using mongoose.
Express Js
app.get('/car', (req, res) => {
res.render('car/');
});
index.handlebars
<div class="row mb-3">
<div class="col">
<input type="hidden" name="_method" value="PUT">
<div class="form-group dropdown">
<label for="Category" value=""> Select Category </label>
<select class="form-control" id="" name="Category">
{{#each category}}
<option>{{category}}</option>
{{/each}}
</select>
</div>
</div>
<div class="col">
<div class="form-group dropdown">
<label for="Car" value=""> Select Car</label>
<select class="form-control" id="" name="Car">
{{#each Car}}
<option>{{car}}</option>
{{/each}}
</select>
</div>
</div>
</div>
Category model.js
const CarSchema= new Schema({
Category: {
type: String,
required: true
},
CarName: {
type: String,
required: true
}
});
node.js mongodb express mongoose handlebars.js
asked Nov 23 '18 at 18:46
Pranay SalvePranay Salve
62
enter code hereI want to create populating dropdown list. like one dropdown will have Car types (Sport, Luxury, SUV, etc) stored in mongodb using mongoose and another dropdown will have car names like (Ferrari, Lamborghini, Rollce Royece) also stored in mongodb. If i select car type as "sport" in one dropdown, another dropdown should show only sport cars name fetch from mongoDB using mongoose.
Express Js
app.get('/car', (req, res) => {
res.render('car/');
});
index.handlebars
<div class="row mb-3">
<div class="col">
<input type="hidden" name="_method" value="PUT">
<div class="form-group dropdown">
<label for="Category" value=""> Select Category </label>
<select class="form-control" id="" name="Category">
{{#each category}}
<option>{{category}}</option>
{{/each}}
</select>
</div>
</div>
<div class="col">
<div class="form-group dropdown">
<label for="Car" value=""> Select Car</label>
<select class="form-control" id="" name="Car">
{{#each Car}}
<option>{{car}}</option>
{{/each}}
</select>
</div>
</div>
</div>
Category model.js
const CarSchema= new Schema({
Category: {
type: String,
required: true
},
CarName: {
type: String,
required: true
}
});
node.js mongodb express mongoose handlebars.js
node.js mongodb express mongoose handlebars.js
asked Nov 23 '18 at 18:46
Pranay SalvePranay Salve
62
asked Nov 23 '18 at 18:46
Pranay SalvePranay Salve
62
edited Nov 24 '18 at 4:19
Pranay Salve
asked Nov 23 '18 at 18:46
Pranay SalvePranay Salve
62
asked Nov 23 '18 at 18:46
Pranay SalvePranay Salve
62
asked Nov 23 '18 at 18:46
Pranay SalvePranay Salve
62
62
Would be great if you can show the code you were working on. That way, it will be easier to help you.
– Cartucho
Nov 23 '18 at 19:57
please go through the code
– Pranay Salve
Nov 24 '18 at 4:21
add a comment |
Would be great if you can show the code you were working on. That way, it will be easier to help you.
– Cartucho
Nov 23 '18 at 19:57
please go through the code
– Pranay Salve
Nov 24 '18 at 4:21
Would be great if you can show the code you were working on. That way, it will be easier to help you.
– Cartucho
Nov 23 '18 at 19:57
Would be great if you can show the code you were working on. That way, it will be easier to help you.
– Cartucho
Nov 23 '18 at 19:57
please go through the code
– Pranay Salve
Nov 24 '18 at 4:21
please go through the code
– Pranay Salve
Nov 24 '18 at 4:21
add a comment |
0
active
oldest
votes
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53451651%2fhow-i-can-create-multiple-populating-dropdown-list-in-express-js-with-handlebars%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
0
active
oldest
votes
0
active
oldest
votes
active
oldest
votes
active
oldest
votes
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53451651%2fhow-i-can-create-multiple-populating-dropdown-list-in-express-js-with-handlebars%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Would be great if you can show the code you were working on. That way, it will be easier to help you.
– Cartucho
Nov 23 '18 at 19:57
please go through the code
– Pranay Salve
Nov 24 '18 at 4:21