CODEWITHSUNDEEP
c#jqueryasp.net-mvchtml.dropdownlistfor
Arturo Martinez
Arturo Martinez

Reputation: 385

Pass Option Select Value to Controller

im trying to get the value each time a client selects a option from my Dropdown list to send it back to controller where i use the value on creating a file and then refreshing the page but im unable to do so

This is my Dropdownlist:

 <select id="sel0">
 <option value="">Todos</option>
   @foreach (var item in Model.Select(l => l.Fecha).Distinct())
             {
 <option value="@lines">@lines</option>
             }
 </select>

This is my Ajax Call:

 $('#sel0').on('change', function () {
                       dataTable.columns('.fechas').search(this.value).draw();
                   });

                   $("form").submit(function () { 
                       $.ajax({
                           url: '@Url.Action("MethodName","HomePosController")',
                           type: 'POST',
                           cache: false,
                           data: { Selected: $("#sel0").val() },
                           success: function (data) {
                               //
                           }
                       });
                   });

and this is my Controller its named 'HomePosController':

 public ActionResult MethodName(string Selected)
    {
        var db = new ArponClientPosContext();

        String value = Selected;
        var json4 = JsonConvert.SerializeObject(Selected);
        System.IO.File.WriteAllText(@"C:\inetpub\wwwroot\potzolcalli.brain.arpon.com\valorselected.txt", json4);
        return View("~/Views/HomePos/Index.cshtml", db.Pos.ToList());
    }

But whenever y select a option of my dropdown nothing happens, the page its not refreshed nor the file is created what am i doing wrong?

Upvotes: 0

Views: 1329

Answers (2)

David
David

Reputation: 218827

whenever y select a option of my dropdown nothing happens

Well, this happens:

dataTable.columns('.fechas').search(this.value).draw();

But that doesn't invoke the AJAX request. It doesn't do much of anything, really.

how can i trigger the ajax ? i want it to trigger after a value is changed in the dropdown list

In that case you want to do that on the select element's change event. Currently you perform the AJAX request here:

$("form").submit(function () { 
    // AJAX
});

That is, you perform the request in the form's submit event. Just add it to the drop down's change event instead:

$('#sel0').on('change', function () {
    dataTable.columns('.fechas').search(this.value).draw();

    $.ajax({
        url: '@Url.Action("MethodName","HomePosController")',
        type: 'POST',
        cache: false,
        data: { Selected: $("#sel0").val() },
        success: function (data) {
            //
        }
    });
});

the page its not refreshed

Well, no. That won't happen in an AJAX request. Currently your success callback is empty, so nothing will happen on the page. Whatever you want to happen would need to be put in that callback.

Upvotes: 1

Ehsan Sajjad
Ehsan Sajjad

Reputation: 62488

If you want it to be on dropdown change then you have to send ajax call in change event :

$('#sel0').on('change', function () {

   dataTable.columns('.fechas').search(this.value).draw();

   $.ajax({
                       url: '@Url.Action("MethodName","HomePos")',
                       type: 'POST',
                       cache: false,
                       data: { Selected: $("#sel0").val() },
                       success: function (data) {
                           //
                       }
                   });

and you have to not write complete Controller class name, you have to skip the Controller postfix, it is convention which is followed by Url helpers in mvc, that way your url generated will be wrong and ajax call will fail.

Upvotes: 1

Related Questions