How can I use selected value (not model value) as Post Parameter In Razor View?

Question

I am posing a model back to my controller,

How every I want the user to select the country from a drop down, So I pass this to the view in a separate list:

Controller GET:

public static List<String> provinces = new List<String>() { "Eastern Cape", "Free State", "Gauteng", "KwaZulu-Natal", "Limpopo", "Mpumalanga", "Northern Cape", "North West", "Western Cape" };
    public static List<String> countries = new List<String>() { "South Africa" };

  public ActionResult Create()
    {
        ViewBag.Provinces = provinces.Select(x =>
                              new SelectListItem()
                              {
                                  Text = x.ToString()
                              });
        ViewBag.Countries = countries.Select(x =>
                               new SelectListItem()
                               {
                                   Text = x.ToString()
                               });
        return View();
    }

Now I display the Drop down in the View:

   ....   
 <p>
        @Html.LabelFor(model => model.Province, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("Provinces", null, htmlAttributes: new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.Province, "", new { @class = "text-danger" })
        </div>
    </p>

    <p>
        @Html.LabelFor(model => model.Country, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("Countries",null , htmlAttributes: new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.Country, "", new { @class = "text-danger" })
        </div>
    </p>
  ....

and here is my View Model:

public class RadioNetwork
{           
    public int NetworkIdentifier { get; set; }
    public string CommonName { get; set; }
    public string RepeaterName { get; set; }
    public string StartCode { get; set; }
    public string Frequency { get; set; }
    public string Area { get; set; }
    public string Province { get; set; }
    public string Country { get; set; }                 
}

So I have discovered where the issue is. But I donot know how to solve it.

I need the form to take the selected Value of my DropDown and not of the model?

Because when I receive the View Model in the POST Controller the provence and Country are `Null'

   [HttpPost]
    [ValidateAntiForgeryToken]
    public async Task<ActionResult> Create([Bind(Include = "NetworkIdentifier,CommonName,RepeaterName,StartCode,Frequency,Area,Province,Country")] RadioNetwork radioNetwork)
    {

Answer 1

Try

@Html.DropDownList(m => m.Province, (SelectList)ViewBag.Provinces, ...

This will bind the selected Province to your model

Answer 2

Your model isn't binding properly because you're using the wrong method to render the DropDownLists. The fields in your form bind to your model according to the name attribute, and the DropDownList() method renders a field without that attribute. When you want form fields to bind properly to a model, you should always take care to use methods that end in For so you don't have to worry about the model binding.

You're doing

@Html.DropDownList("Countries",null , htmlAttributes: new { @class = "form-control" })

You should be doing

@Html.DropDownListFor(model => model.Country, (List<SelectListItem>)ViewBag.Countries, new { @class = "form-control" })

Also, your lists should be:

ViewBag.Provinces = provinces.Select(x =>
                          new SelectListItem()
                          {
                              Text = x.ToString(),
                              Value = x.ToString()
                          }).ToList();

PS You don't need any of the bind stuff at all.