How to fetch selective data from model on click of radio button in ASP.Net Core MVC?

Question

Scenario Background: 1. Two radio buttons - "Default" & "Preferred" 2. One Text box - "DirPath"(To show Default/Preferred path based on radio selection) 3. Inside model class, there are two class members (string DefP, PrefP - which holds the Default/Preferred path) and are initialized by reading some database (Consider registry) when MVC action is performed for the first time.

Requirement: 1. When "Default" radio button is pressed, "DirPath" should fetch latest DefP and PrefP should not be fetched (Though it is not being shown) 2. Similarly, When "Preferred" radio button is pressed, "DirPath" should fetch latest PrefP and DefP should not be fetched (Though it is not being shown). 3. View (UI)should not be reloaded.

Reason: To restrict the fetching of data only to required extent.

score 0 · Answer 1 · answered Dec 02 '19 at 14:58

It's hard for us to decided what is the best way. Your UI could have 2 textbox instead of 1 and then show/hide the one you want.

Or your class could have a property what is returned depending on the value of the flag.

    Public Property DirPath As String

    Public ReadOnly Property DefP As String
        Get
            If IsDefault Then
                Return DirPath
            End If

            Return String.Empty
        End Get
    End Property

    Public ReadOnly Property PrefP As String
        Get
            If Not IsDefault Then
                Return DirPath
            End If

            Return String.Empty
        End Get
    End Property

Or you could just take care of it when saving to the database.

                param = New OracleParameter("@DefP", If(IsDefault, DirPath, String.Empty))
                param = New OracleParameter("@PrefP", If(Not IsDefault, DirPath, String.Empty))

Or if you use ViewModel then you could do the conversion when the data is moved to your business object.

score 0 · Answer 2 · answered Dec 03 '19 at 09:06

You could try javascript to set the value of DirPath based on the radio button click event.

Here is a simple example

Model

public class TestModel
{
    public string DefP { get; set; }
    public string PrefP { get; set; }

}

Controller

public IActionResult Test()
{
        var model = new TestModel
        {
            DefP = "defPath",
            PrefP = "prefPath"
        };
        return View(model);
}

View

@model MVCTest2_2.Models.TestModel

<input type="radio" id="default" name="default" />Default
<input type="radio" id="preferred" name="preferred" />Preferred
<br />
<label>DirPath</label>
<input type="text" id="dirPath" name="dirPath"/>

@section Scripts
{
<script>
    $(document).ready(function () {
        $("#default").change(function () {
            if ($('input[name=default]').is(':checked')) {
                $("#dirPath").val('@Model.DefP');
                $("#preferred").prop("checked", false);
            }
        });

        $("#preferred").change(function () {
            if ($('input[name=preferred]').is(':checked'))
            {
                $("#dirPath").val('@Model.PrefP');
                $("#default").prop("checked", false);
            }
        });


    });
</script>
}

How to fetch selective data from model on click of radio button in ASP.Net Core MVC?

2 Answers2