2017-06-20 8 views
-1

Ich habe ein Dropdown-Menü <select> auf meiner Ansichtsseite mit Daten aus einer gespeicherten Prozedur generiert. Mit JavaScript habe ich auf die ausgewählte <option> zugegriffen und den Text in eine Variable gespeichert. Jetzt muss ich diese Variable an meinen Controller zurücksenden, damit ich sie als Parameter in einer anderen gespeicherten Prozedur verwenden kann.Wie übergebe ich eine Variable von meiner Ansicht an meinen Controller?

Hier ist mein Controller, mit dem Titel „EventsController.cs“

public ActionResult Dropdown(string text) 
    { 
     ViewData["ids"] = db.uspGetAllEventIds().ToArray(); 
     Console.WriteLine(text); 
     return View(); 
    } 

So können Sie sehen, ich die erste gespeicherte Prozedur ausführen und es zu der Ansicht senden.

Hier ist, was in der Ansicht passiert:

@model IEnumerable<Heatmap.Models.Event> 
@{ 
    Layout = null; 
} 
<!DOCTYPE html> 
<html> 
<head> 
    <meta name="viewport" content="width=device-width" /> 
    <title></title> 
    <script> 
     function showValue() 
     { 
      var list = document.getElementById("EventId"); 
      var text = list.options[list.selectedIndex].text; 
      alert(text);  
     } 
    </script> 
</head> 
<body> 
    <div> 
     @using (Html.BeginForm("", "", FormMethod.Post)) 
     { 
     <select id="EventId"> 
      @{ 
       var ids = ViewData["ids"] as string[]; 
       for (var i = 0; i < ids.Length; i++) 
       { 
       <option>@ids[i]</option> 
       } 
       } 
     </select> 
     <input name="text" type="submit" value="Submit" /> 
     <button onclick="showValue()">Click me!</button> 
     } 
    </div> 
</body> 
</html> 

So jetzt ich die Alarmfunktion haben, nur um mich zu beweisen, dass ich Zugriff auf die option, die ich auswählen. Ich bin mir ziemlich sicher, dass ich FormMethod.Post verwenden muss, um es zurück zum Controller zu bekommen, aber ich konnte bis jetzt keine hilfreiche Hinweise finden.

Wie formatiere ich dies, so dass meine Variable text wird zurück in den Controller gesendet?

+0

Wo ist Ihre Aktionsmethode in Ihrem Controller für den POST? – krillgar

+0

@krillgar Ich hatte eine separate vor dem Posten, aber ich löschte es, um meine Frage verständlicher zu machen. Es war im Grunde nur eine "ActionResult" -Funktion, die ich versucht, ohne Glück die Daten zu übergeben –

+0

Und wie Sie diese Aktion Methode einrichten festgelegt, wie Sie die Daten an sie senden. – krillgar

Antwort

3

Ich schlage vor, jquery $.getJSON Methode zu verwenden, und die Seite ohne refresh von der Steuerung erhält Variable zu senden. Ich habe hinzugefügt. NetFiddle es funktioniert here

[HttpGet] 
public JsonResult GetDropdownList() 
{ 
    var yourdata = db.uspGetAllEventIds().ToList(); 
    Console.WriteLine(text); 
    return Json(new { data = yourdata}, JsonRequestBehavior.AllowGet); 
} 

[HttpPost] 
public ActionResult Dropdown() 
{ 
    // add your code here 
} 

//html 
@using (Html.BeginForm("Dropdown","YourControllerName", FormMethod.Post)) 
{ 
    <select id="EventId" name="eventId"> 
    </select>   
    <input name="text" type="submit" value="Submit" />    
} 
<button style="margin-top:20px;" id="yourid">Fill Dropdown!</button> 

// jquery 
$("#yourid").on("click", function(){ 
    showValue(); 
}) 

function showValue() 
{ 
    $.getJSON('@Url.Action("GetDropdownList", "YourControllerName")', function (result) { 

     $("#EventId").html(""); // makes select null before filling process 
     var data = result.data; 
     for (var i = 0; i < data.length; i++) { 
      $("#EventId").append("<option>"+ data[i] +"</option>") 
      console.log(data[i]) 
     } 

    }) 
} 
+0

Setzen Sie den letzten Codeabschnitt in die Ansicht? –

+0

Sie müssen Ihr Formular nicht senden, um Wert von Controller – hasan

+0

zu erhalten Also muss ich durch den JSON analysieren, um ein neues Auswahlelement zu generieren, dann sollte die Funktion die ausgewählte Option an den Controller zurückgeben? –

0

Ein besserer Weg, es zu tun ist, dass Sie einen Postback auf Ihre Dropdown(...) Aktion auf die Schaltfläche klicken Sie und ihre Unterschrift zu Dropdown(string EventId) ändern, die Sie ausgewählt EventId geben sollte.

Hier ist der vollständige Code mit beiden Methoden.

public class EventsController : Controller 
    { 
     public ActionResult Dropdown() 
     { 
      ViewData["ids"] = new[] { 1, 2, 3 }; 
      return View(); 
     } 

     [HttpPost] 
     public ActionResult Dropdown(string eventId) 
     { 
      //call your sp instead of going back to the same page 

      ViewData["ids"] = new[] { 1, 2, 3 }; 
      return View(); 
     } 

     public ActionResult Direct(int id) 
     { 
      //call your sp instead of going back to the same page 

      ViewData["ids"] = new[] { 1, 2, 3 }; 
      return View("Dropdown"); 
     } 

    } 

@{ 
    Layout = null; 
} 
<!DOCTYPE html> 
<html> 
<head> 
    <meta name="viewport" content="width=device-width" /> 
    <title></title> 
    <script 
       src="https://code.jquery.com/jquery-3.2.1.min.js" 
       integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" 
       crossorigin="anonymous"></script> 
    <script> 
     function showValue() { 
      var list = document.getElementById("EventId"); 
      var text = list.options[list.selectedIndex].text; 
      $.getJSON('/Events/Direct/' + text, function(data) { 
       console.log(data); 
      }); 
     } 
    </script> 
</head> 
<body> 
    <div> 
     @using (Html.BeginForm("Dropdown", "Events", FormMethod.Post)) 
     { 
     <select id="EventId" name="eventId"> 
      @{ 
       var ids = ViewData["ids"] as int[]; 
       for (var i = 0; i < ids.Length; i++) 
       { 
       <option>@ids[i]</option> 
       } 
       } 
     </select> 
     <button type="submit">Postback</button> 
     } 

     <button onclick="showValue()">Get JSON</button> 
    </div> 
</body> 
</html> 
+0

Soll ich den Postback in meinem JavaScript oder einfach im 'onClick' aufrufen? –

+0

Ok, ich denke, wir schaffen es irgendwie. Ich bin gerade dabei, zu Mittag zu essen, ich werde mehr nachsehen. Hoffentlich bist du bis dahin noch da, aber ich schreibe vielleicht zurück, wenn ich auf etwas stoße. Danke für die Hilfe bis jetzt! –

+0

Es scheint ein Problem beim Eingeben von 'ActionResult Dropdown (string eventId)' zu geben. Ich habe 'Console.WriteLine (eventId); 'an den Anfang hinzugefügt und es wird nie aufgerufen –

Verwandte Themen