Passing Value from Kendo DDL to ActionLink/ActionImage without submitting values

Question

VS'12 KendoUI InternetApplication Template C# asp.net EF Code First

I got 2 dropdownlist pages 1 page uses the DropDownList For Posting values to a ModelView the other is just returning by ID.

Qeustion

Basically i want to stay in the view with a DDL that a user can select from. Left of this DDL there is a Actionlink that should be able to go to a new ACtion with the selected parameter. But my model values are always null. How does one pass this value?

DropDownList

                <label for="Prospects">Prospect:</label>
                @(Html.Kendo().DropDownListFor(m=>m.Prospects)
                      //.Name("clients")
                      .HtmlAttributes(new { style = "width:300px"}) //, id = "clients"})
                      .OptionLabel("Select Prospect...")
                      .DataTextField("ProspectName")
                      .DataValueField("ProspectID")
                      .DataSource(source => {
                           source.Read(read => {
                               read.Action("GetCascadeProspects", "AddCCCTRST");
                           });
                      })
                  )

ActionLink

@Html.ActionImage("ADD", "Prospect", new { id=Model.Prospects.FirstOrDefault() } , "~/Images/Navigation/Add.PNG", "Add")

..., new { id=Model.Prospects.FirstOrDefault() } ,...,...) 
// the Model is null here, how can i pass my value to this actionlink / actionimage?

(The ActionImage is from This Post) if the code needs posted here please advise. (the custom ActionImage is working i just can't pass the value.... )

UPDATES Model

public class ViewModelCCTRST
{
    public string Clients { get; set; }
    public IEnumerable<dbClient> AvailableClients { get; set; }
    public string Prospects { get; set; }
    public IEnumerable<dbProspect> AvailableProspects { get; set; }
    public string Countys { get; set; }
    public IEnumerable<dbCounty> AvailableCounties { get; set; }
    public string TownShips { get; set; }
    public IEnumerable<dbTownShip> AvailableTownShip { get; set; }
    public string Ranges { get; set; }
    public IEnumerable<dbRange> AvailableRanges { get; set; }
    public string Sections { get; set; }
    public IEnumerable<dbSection> AvailableSection { get; set; }
    public string Tracts { get; set; }
    public IEnumerable<dbTract> AvailableTracts { get; set; }
}

Controller *A JsonResult GET Method and Post Request

    public JsonResult GetCascadeTracts(int sections)
    {
        var tract = db.Tracts.AsQueryable();

        if (0 != sections)
        {
            tract = tract.Where(o => o.SectionID == sections);
        }

        return Json(tract.Select(o => new { TractID = o.TractID, TractName = o.TractNumber }),    JsonRequestBehavior.AllowGet);
    }

    [HttpPost]
    public ActionResult Index(ViewModelCCTRST model)
    {

        if (ModelState.IsValid)
        {

            //string clt = model.Clients;
            string pro = model.Prospects;
            string cnt = model.Countys;
            string twn = model.TownShips;
            string rng = model.Ranges;
            string sct = model.Sections;
            string trt = model.Tracts;

            return Content(cnt + twn + rng + sct + trt);
        }
        else
        {
            return Content("");
        }
    }

**As Discussed below i do have values in my Post method, but i do not have any values in my View(This is where i want to be able to have values to use my Actionlinks w/o refreshing the page) also, If I tie the Model.(w/e the data is) into the action links they give me a null reference.

Answer 1

1. add id to Actionlink

   @Html.ActionLink("Add", "Create", new { controller = "Client"}, new {id="AddClient"}) 
   

2. add to catch onclick events

    $('#AddClient').click(function (e) {
       var val = $("#Clients").val();
       var href = "/Client/Create/" + val;
       this.href = ""; //clears out old href for reuse
       this.href = href; //changes href value to currently slected dropdown value
   });
   

srcs

Answer 2

You can use kendo template for this. Reference: Kendo DropDownList / Customizing templates

@(Html.Kendo().DropDownList()
      .Name("customers")
      .HtmlAttributes(new { style = "width: 400px" })
      .DataTextField("ContactName")
      .DataValueField("CustomerID")
      .DataSource(source =>
      {
          source.Read(read =>
          {
              read.Action("GetCustomers", "Home");
          });
      })
      .Height(300)
      .Template("<img src=\"" + Url.Content("~/Content/web/Customers/") +  "${data.CustomerID}.jpg\" alt=\"${data.CustomerID}\" />" +
                        "<dl>" +
                            "<dt>Contact:</dt><dd>${ data.ContactName }</dd>" +
                            "<dt>Company:</dt><dd>${ data.CompanyName }</dd>" +
                        "</dl>")
)

UPDATE

You are getting null value because you haven't assign Name to your kendo control. Without doing this, the control value will not be bind to your model.

@(Html.Kendo().DropDownListFor(m=>m.Prospects)
                  .Name("Prospects")         // assign appropriate name
                  .HtmlAttributes(new { style = "width:300px"}) //, id = "clients"})
                  .OptionLabel("Select Prospect...")
                  .DataTextField("ProspectName")
                  .DataValueField("ProspectID")
                  .DataSource(source => {
                       source.Read(read => {
                           read.Action("GetCascadeProspects", "AddCCCTRST");
                       });
                  })
              )