How to change datepicker format in laravel 8 using jqueryui?

Question

I'm building an app with laravel 8 and using jqueryui, I'm having a problem with datepicker format as it's format "mm/dd/yyyy" and I want it to be "dd/mm/yyyy" just in the view not the database as it's inserted in database just right no problem.

I've tried to add data-date-format="dd/mm/yyyy" but it didn't work and also i've tried to add

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
        $( function() {
            $('#datepicker').datepicker({
                format: 'dd/mm/yyyy'
            });        
        });
</script>

but also didn't work!

Here is the input code I'm using

<input type="date" id="datepicker" class="form-control" name="first_visit_date" value="{{ $owner->first_visit_date }}" data-date-format="dd/mm/yyyy">

Am I doing something wrong?

Answer 1

Please try by changing the format to dateFormat.

Example code:

<input type="text" id="txtDate" name="SelectedDate" readonly="readonly" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js" type="text/javascript"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"
    type="text/javascript"></script>
<link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css"
    rel="Stylesheet" type="text/css" />
<script type="text/javascript">
    $(function () {
        $("#txtDate").datepicker({
            showOn: 'button',
            buttonImageOnly: true,
            buttonImage: 'images/calendar.gif',
            dateFormat: 'dd/mm/yy'
        });
    });
</script>