1

I have the following javascript function in Razor View.cshtml

<script type="text/javascript">
        $(function () {
            $("#form").change(function () {
                var selected = $(this).find("option:selected").text();
                $("#SelectedHouseDetailsText").val(selected);
                var a = $("#SelectedHouseDetailsText").value;
                if ( a!= null) {
                    $('.divForSelectHouse').Load('@Html.Partial("~/Views/ClientReservations/ReservationHouseDetails.cshtml",Model.MyProperty[Model.SelectedHouseDetailsText])')
                }               
            });
        })
    </script>

When I open this view field "SelectedHouseDetailsText" is not initialized at the begigning, how can I check if this not null to not display partial view when key value "SelectedHouseDetailsText" is not initialized?

C# code of Model

public class ReservationDetails
    {
        public ReservationDetails()
        {

        }
        public Reservation Reservation { get; set; }

        public List<ReservationHouseDetails> ReservationHouseDetails { get; set; }

        public Dictionary<string,ReservationHouseDetails> MyProperty { get; set; }

        public List<ReservationAttractionDetails> ReservationAttractionDetails { get; set; }

        public IEnumerable<SelectListItem> Houses { get; set; }

        public int SelectedHouseDetailsId { get; set; }

        public string SelectedHouseDetailsText { get; set; }
    }

Partial View

@model Repository.ViewModels.ReservationHouseDetails
@using Repository.Models


<div>
    <h4>Szczegóły domku + @Html.DisplayFor(model=>model.House.Name)</h4>
    <hr />
    <dl class="dl-horizontal">
        <dt>
            @Html.DisplayNameFor(model => model.House.HouseType.Type)
        </dt>

        <dd>
            @Html.DisplayFor(model => model.House.HouseType.Type)
        </dd>

        <dt>
            @Html.DisplayNameFor(model => model.House.HouseType.Price)
        </dt>

        <dd>
            @Html.DisplayFor(model => model.House.HouseType.Price)
        </dd>

        <dt>
            @Html.DisplayNameFor(model => model.House.Description)
        </dt>

        <dd>
            @Html.DisplayFor(model => model.House.Description)
        </dd>

        <dt>
            @Html.DisplayNameFor(model => model.Meal.Type)
        </dt>

        <dd>
            @Html.DisplayFor(model => model.Meal.Type)
        </dd>

        <dt>
            @Html.DisplayNameFor(model => model.Meal.Price)
        </dt>

        <dd>
            @Html.DisplayFor(model => model.Meal.Price)
        </dd>
    </dl>

    <table class="table">
        <tr>
            <th>
                @Html.DisplayName("LP")
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Participants.FirstOrDefault().Name)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Participants.FirstOrDefault().Surname)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Participants.FirstOrDefault().BirthDate)
            </th>
            <th></th>
        </tr>

        @foreach (var item in Model.Participants.Select((value, i) => new { i, value }))
        {
            Participant value = item.value;
            int index = item.i + 1;
            <tr>
                <td>
                    @index.ToString()
                </td>
                <td>
                    @value.Name
                </td>
                <td>
                    @value.Surname
                </td>
                <td>
                    @value.BirthDate
                </td>
            </tr>
         }

</table>
</div>
3
  • You can simplify your condition, just use if (a) { . In that case all falsy values will redirect code to else branch Commented Aug 10, 2017 at 9:22
  • If this instruction var a = $("#SelectedHouseDetailsText").value is proper, I applied your suggestion, but in condition "a" is true Commented Aug 10, 2017 at 9:27
  • And this $("#SelectedHouseDetailsText").value is not valid as I think, it need to be $("#SelectedHouseDetailsText").val() Commented Aug 10, 2017 at 9:38

1 Answer 1

1

You can check it in javascript like below. Actually "@Html.Partial" is server side call. so it will be get called before JS. That is the issue. So you should have server side condition to solve this.

<script type="text/javascript">
@if(!string.IsNullOrEmpty(Model.SelectedHouseDetailsText))
{
        <text>
           $(function () {
            $("#form").change(function () {
                var selected = $(this).find("option:selected").text();
                $("#SelectedHouseDetailsText").val(selected);
                var a = $("#SelectedHouseDetailsText").value;
                if (a) {
                    $('.divForSelectHouse').Load('@Html.Partial("~/Views/ClientReservations/ReservationHouseDetails.cshtml",Model.MyProperty[Model.SelectedHouseDetailsText])')
                }               
            });
        })
       </text>
}
    </script>
Sign up to request clarification or add additional context in comments.

9 Comments

When I open this view '$('.divForSelectHouse').Load('@Html.Partial("~/Views/ClientReservations/ReservationHouseDetails.cshtml",Model.MyProperty[Model.SelectedHouseDetailsText])')' this line is always executed Value cannot be null. Parameter name: key
I have edited my answer with undefined check.. did you tried?
The problem still remains, if this script should be included in head section in View.cshtml?, version jquery is 3.1.1
I found it!!! Actually "@Html.Partial" is server side call. so it will be get called before JS. That is the issue. So you should have server side condition to solve this. I have updated can you see it??
You include that condition wherever you need as per your business :)
|

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.