Convert tag as a Date picker
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}
This is my GUI view in html 
and my html code is
<div class="row">
<div class="col-md-5" style=" padding: 35px;">
<span style="font-size: 16px;">From</span>
<p style="padding-left: 20px;padding-top: 15px;">
<i class="fa fa-calendar" style="font-size:30px">
<input type="date" dataformatas=""/>
<span class="muve-span-date"><?php echo date('Y-m-01'); ?></span>
</i>
</p>
</div>
<div style="margin-top: 40px;" class="col-md-1">
<div class="vl"></div>
</div>
<div class="col-md-5" style="padding: 35px;">
<span style="font-size: 16px;">To</span>
<p style="padding-left: 20px;padding-top: 15px;">
<i class="fa fa-calendar" style="font-size:30px">
<span class="muve-span-date"><?php echo date("Y-m-d"); ?></span>
</i>
</p>
</div>
</div>. how can i convert this span tag as a date picker.
Thanks,
Buddhika.
html css html5 css3 bootstrap-4
asked Nov 23 '18 at 6:27
Buddhika LakshanBuddhika Lakshan
12719
add a comment |
This is my GUI view in html and my html code is
<div class="row">
<div class="col-md-5" style=" padding: 35px;">
<span style="font-size: 16px;">From</span>
<p style="padding-left: 20px;padding-top: 15px;">
<i class="fa fa-calendar" style="font-size:30px">
<input type="date" dataformatas=""/>
<span class="muve-span-date"><?php echo date('Y-m-01'); ?></span>
</i>
</p>
</div>
<div style="margin-top: 40px;" class="col-md-1">
<div class="vl"></div>
</div>
<div class="col-md-5" style="padding: 35px;">
<span style="font-size: 16px;">To</span>
<p style="padding-left: 20px;padding-top: 15px;">
<i class="fa fa-calendar" style="font-size:30px">
<span class="muve-span-date"><?php echo date("Y-m-d"); ?></span>
</i>
</p>
</div>
</div>. how can i convert this span tag as a date picker.
Thanks,
Buddhika.
html css html5 css3 bootstrap-4
asked Nov 23 '18 at 6:27
Buddhika LakshanBuddhika Lakshan
12719
@BuddhikaLakshan Can you elaborate your question.
– Husna
Nov 23 '18 at 7:08
@buddhika-lakshan can you also mark answers as correct or comment on why they are not good enough?
– cloned
Nov 26 '18 at 11:30
add a comment |
This is my GUI view in html and my html code is
<div class="row">
<div class="col-md-5" style=" padding: 35px;">
<span style="font-size: 16px;">From</span>
<p style="padding-left: 20px;padding-top: 15px;">
<i class="fa fa-calendar" style="font-size:30px">
<input type="date" dataformatas=""/>
<span class="muve-span-date"><?php echo date('Y-m-01'); ?></span>
</i>
</p>
</div>
<div style="margin-top: 40px;" class="col-md-1">
<div class="vl"></div>
</div>
<div class="col-md-5" style="padding: 35px;">
<span style="font-size: 16px;">To</span>
<p style="padding-left: 20px;padding-top: 15px;">
<i class="fa fa-calendar" style="font-size:30px">
<span class="muve-span-date"><?php echo date("Y-m-d"); ?></span>
</i>
</p>
</div>
</div>. how can i convert this span tag as a date picker.
Thanks,
Buddhika.
html css html5 css3 bootstrap-4
asked Nov 23 '18 at 6:27
Buddhika LakshanBuddhika Lakshan
12719
This is my GUI view in html and my html code is
<div class="row">
<div class="col-md-5" style=" padding: 35px;">
<span style="font-size: 16px;">From</span>
<p style="padding-left: 20px;padding-top: 15px;">
<i class="fa fa-calendar" style="font-size:30px">
<input type="date" dataformatas=""/>
<span class="muve-span-date"><?php echo date('Y-m-01'); ?></span>
</i>
</p>
</div>
<div style="margin-top: 40px;" class="col-md-1">
<div class="vl"></div>
</div>
<div class="col-md-5" style="padding: 35px;">
<span style="font-size: 16px;">To</span>
<p style="padding-left: 20px;padding-top: 15px;">
<i class="fa fa-calendar" style="font-size:30px">
<span class="muve-span-date"><?php echo date("Y-m-d"); ?></span>
</i>
</p>
</div>
</div>. how can i convert this span tag as a date picker.
Thanks,
Buddhika.
<div class="row">
<div class="col-md-5" style=" padding: 35px;">
<span style="font-size: 16px;">From</span>
<p style="padding-left: 20px;padding-top: 15px;">
<i class="fa fa-calendar" style="font-size:30px">
<input type="date" dataformatas=""/>
<span class="muve-span-date"><?php echo date('Y-m-01'); ?></span>
</i>
</p>
</div>
<div style="margin-top: 40px;" class="col-md-1">
<div class="vl"></div>
</div>
<div class="col-md-5" style="padding: 35px;">
<span style="font-size: 16px;">To</span>
<p style="padding-left: 20px;padding-top: 15px;">
<i class="fa fa-calendar" style="font-size:30px">
<span class="muve-span-date"><?php echo date("Y-m-d"); ?></span>
</i>
</p>
</div>
</div> <div class="row">
<div class="col-md-5" style=" padding: 35px;">
<span style="font-size: 16px;">From</span>
<p style="padding-left: 20px;padding-top: 15px;">
<i class="fa fa-calendar" style="font-size:30px">
<input type="date" dataformatas=""/>
<span class="muve-span-date"><?php echo date('Y-m-01'); ?></span>
</i>
</p>
</div>
<div style="margin-top: 40px;" class="col-md-1">
<div class="vl"></div>
</div>
<div class="col-md-5" style="padding: 35px;">
<span style="font-size: 16px;">To</span>
<p style="padding-left: 20px;padding-top: 15px;">
<i class="fa fa-calendar" style="font-size:30px">
<span class="muve-span-date"><?php echo date("Y-m-d"); ?></span>
</i>
</p>
</div>
</div>html css html5 css3 bootstrap-4
html css html5 css3 bootstrap-4
asked Nov 23 '18 at 6:27
Buddhika LakshanBuddhika Lakshan
12719
asked Nov 23 '18 at 6:27
Buddhika LakshanBuddhika Lakshan
12719
edited Nov 23 '18 at 7:02
Buddhika Lakshan
asked Nov 23 '18 at 6:27
Buddhika LakshanBuddhika Lakshan
12719
asked Nov 23 '18 at 6:27
Buddhika LakshanBuddhika Lakshan
12719
asked Nov 23 '18 at 6:27
Buddhika LakshanBuddhika Lakshan
12719
12719
@BuddhikaLakshan Can you elaborate your question.
– Husna
Nov 23 '18 at 7:08
@buddhika-lakshan can you also mark answers as correct or comment on why they are not good enough?
– cloned
Nov 26 '18 at 11:30
add a comment |
@BuddhikaLakshan Can you elaborate your question.
– Husna
Nov 23 '18 at 7:08
@buddhika-lakshan can you also mark answers as correct or comment on why they are not good enough?
– cloned
Nov 26 '18 at 11:30
@BuddhikaLakshan Can you elaborate your question.
– Husna
Nov 23 '18 at 7:08
@BuddhikaLakshan Can you elaborate your question.
– Husna
Nov 23 '18 at 7:08
@buddhika-lakshan can you also mark answers as correct or comment on why they are not good enough?
– cloned
Nov 26 '18 at 11:30
@buddhika-lakshan can you also mark answers as correct or comment on why they are not good enough?
– cloned
Nov 26 '18 at 11:30
add a comment |
1 Answer
1
active
oldest
votes
You would have to implement a datepicker instead of a span.
Easiest way would be to just use <input type="date"> and let the browser handle this for you. Downside of this is that you can't really style this input.
Second option is to use a javascript library that takes care of rendering the datepicker, two popular choices are:
- Bootstrap datepicker
- jQuery UI Datepicker
This are only 2 options, if you search for javascript datepicker you will find a lot more, so feel free to chose a different one if you don't like the 2 mentioned above.
answered Nov 23 '18 at 7:15
clonedcloned
66769
add a comment |
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%2f53441580%2fconvert-span-tag-as-a-date-picker%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
You would have to implement a datepicker instead of a span.
Easiest way would be to just use <input type="date"> and let the browser handle this for you. Downside of this is that you can't really style this input.
Second option is to use a javascript library that takes care of rendering the datepicker, two popular choices are:
- Bootstrap datepicker
- jQuery UI Datepicker
This are only 2 options, if you search for javascript datepicker you will find a lot more, so feel free to chose a different one if you don't like the 2 mentioned above.
answered Nov 23 '18 at 7:15
clonedcloned
66769
add a comment |
You would have to implement a datepicker instead of a span.
Easiest way would be to just use <input type="date"> and let the browser handle this for you. Downside of this is that you can't really style this input.
Second option is to use a javascript library that takes care of rendering the datepicker, two popular choices are:
- Bootstrap datepicker
- jQuery UI Datepicker
This are only 2 options, if you search for javascript datepicker you will find a lot more, so feel free to chose a different one if you don't like the 2 mentioned above.
answered Nov 23 '18 at 7:15
clonedcloned
66769
add a comment |
You would have to implement a datepicker instead of a span.
Easiest way would be to just use <input type="date"> and let the browser handle this for you. Downside of this is that you can't really style this input.
Second option is to use a javascript library that takes care of rendering the datepicker, two popular choices are:
- Bootstrap datepicker
- jQuery UI Datepicker
This are only 2 options, if you search for javascript datepicker you will find a lot more, so feel free to chose a different one if you don't like the 2 mentioned above.
answered Nov 23 '18 at 7:15
clonedcloned
66769
You would have to implement a datepicker instead of a span.
Easiest way would be to just use <input type="date"> and let the browser handle this for you. Downside of this is that you can't really style this input.
Second option is to use a javascript library that takes care of rendering the datepicker, two popular choices are:
- Bootstrap datepicker
- jQuery UI Datepicker
This are only 2 options, if you search for javascript datepicker you will find a lot more, so feel free to chose a different one if you don't like the 2 mentioned above.
answered Nov 23 '18 at 7:15
clonedcloned
66769
answered Nov 23 '18 at 7:15
clonedcloned
66769
answered Nov 23 '18 at 7:15
clonedcloned
66769
answered Nov 23 '18 at 7:15
clonedcloned
66769
66769
add a comment |
add a comment |
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%2f53441580%2fconvert-span-tag-as-a-date-picker%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
@BuddhikaLakshan Can you elaborate your question.
– Husna
Nov 23 '18 at 7:08
@buddhika-lakshan can you also mark answers as correct or comment on why they are not good enough?
– cloned
Nov 26 '18 at 11:30