MVC 5 – Third Party Date Picker that works in IE

First, send back the browser type from the controller to the browser.

ViewBag.Browser = Request.Browser.Browser; 

Add the following javascript:

 
<script type="text/javascript" src="https://cdn.jsdelivr.net/jquery/latest/jquery.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/
npm/daterangepicker/daterangepicker.min.js
"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.
net/npm/daterangepicker/daterangepicker.css
" /> 


 @if (ViewBag.Browser == "InternetExplorer")
    {
        <script type="text/javascript">
            var mFromDate = '@Model.Search.From_Date';
            if (mFromDate != "") {
                mFromDate = mFromDate.substring(0, mFromDate.search(/ /));
            }
                $('input[name="Search.From_Date"]').daterangepicker({
                    singleDatePicker: true,
                    showDropdowns: true,
                    dateFormat: "mm/dd/yyyy",
                    autoUpdateInput: true
                }, function (start, end, label) {
                    $('input[name="Search.From_
Date"]').val(start.format("MM/DD/YYYY"));
                }).val(mFromDate);
        </script>


        <script type="text/javascript">
            var mToDate = '@Model.Search.To_Date';
            if (mToDate != "") {
                mToDate = mToDate.substring(0, mToDate.search(/ /));
            }
                $('input[name="Search.To_Date"]').daterangepicker({
                    singleDatePicker: true,
                    showDropdowns: true,
                    dateFormat: "mm/dd/yyyy",
                    autoUpdateInput: true
                }, function (start, end, label) {
                    $('input[name="Search.To_Date"
]').val(start.format("MM/DD/YYYY"));
                }).val(mToDate);
        </script>
    }

And check the browser type in order to use the default HMTL date picker when not Internet Explorer.

 
<div class="col-md-2" style="padding-left: 0px;">
                    @Html.LabelFor(m => m.Search.From_Date, new { style = "font-weight:bold; margin-bottom: 0px;" })
                    <br />
                    @if (ViewBag.Browser != "InternetExplorer")
                    {
                        @Html.EditorFor(m => m.Search.From_Date, new { @class = "form-control", name = "FromDate" })
                    }
                    else
                    {
                        <input type="text" name="Search.From_Date" id="Search.From_Date" autocomplete="off"  style="height: 35px;" placeholder="mm/dd/yyyy" />
                    }
                    @Html.ValidationMessageFor(m => m.Search.From_Date)
                </div>

Please follow and like us:

MVC 5 – Refresh Parent Window After Executing Child Window

Close a windows tab upon returning a view:

Do this when a parent window opens a child window.

The child window does the processing, but after the processing, you want the parent window to refresh.

In the SAVE action of the controller of the view of child window put:

ViewBag.RefreshGrid = false; 

at the top of the action, and

ViewBag.RefreshGrid = true; 

Right before the return of the view.

Now, in the save view mentioned above, put this javascript logic below the Html.BeginForm:

if (ViewBag.RefreshGrid == true)
    {
        <script type="text/javascript">
            window.onload = function () {
                RefreshParent();
            };
        </script>
    }

And in the Javascript section, add the function:

<script type="text/javascript">
        function RefreshParent() {
            if (window.opener != null && !window.opener.closed) {
                window.opener.location.reload();
            }
        }
</script>

Please follow and like us:

MVC 5 – How to Close a Browser Tab Using Javascript

Close a windows tab upon returning a view:

    @if (ViewBag.CloseWindow == true)
    {
    <script type="text/javascript">
        window.close();
    </script>
    }

 Closing a Windows tab via a button click while on view:

<button style="font-weight:bold; margin-top: 5px;" type="button" onclick="CloseTab();" class="btn btn-primary">Close Tab</button>

    <script>
        function CloseTab() {
            window.close();
        }
    </script>
Please follow and like us:

MVC 5 – How to Display a PDF in a View

Assuming that you have a PDF in your controller as a byte array, add the following code to convert the data to a base64 string and send to your view.

string imageBase64Data = Convert.ToBase64String(results);
string imageDataURL = string.Format("data:application/pdf;base64,{0}", imageBase64Data);
ViewBag.ImageData = imageDataURL;

 In your view, display the PDF in an iframe.

 <div class="container">
    <div class="row">
        <div class="form-group-sm">
            <div class="col-md-12" style="padding-left: 0px;">
                <iframe style="width: 75%; height: 500px;" src="@ViewBag.ImageData"></iframe>
            </div>
        </div>
    </div>
</div>
Please follow and like us:

MVC 5 – Using Javascript to set focus to control, textbox, button, dropdown list upon loading of a Razor View

Let’s say you want to add focus to a button in your view. The first thing you need to do is add the id attribute to your control and give it a name such as id=”RefreshListButton”.

Next, in the jquery document ready section, add a jquery function that will set the focus.

 $('#RefreshListButton').focus(); 

 $(document).ready(function () Here is the complete function:

  <script type='text/javascript'>
$(document).ready(function () {           
$('#RefreshListButton').focus();       
});
</script>
Please follow and like us:

MVC 5 – Model State Always False and Data Received is NULL – The Save Action Variable Name Must Be the Same Name as Your Model Name When Receiving Just the Model Portion of Your View Model That Was Bound to Your View

I struggled with this one and learned something that was not taught in the tutorial I took on MVC 5. The instructor did not mention that when you receive a model into your Save action (Controller) instead of your view model that is bound to your view, you have to name your variable the same name or at least with a small case as the first character as the model class name. If you follow this rule, the model state will be true and you will get your data.

Do this if you want to receive just the model of your ViewModel you bound to your view and sent back to the controller:

public ActionResult Save(Customer Customer)

or do this if you want to receive the entire ViewModel you bound to your view and sent back to the controller:

public ActionResult Save(CustomerFormViewModel viewModel)
​

Lastly, if you choose to receive back the entire viewModel, you can call your ViewModel variable whatever you want, but NOT when receiving back just the model.

Please follow and like us: