Wie man Textbox Wert zu JSON-Array senden

Question

Dies kann sehr einfach sein, aber ich habe noch keinen richtigen Ansatz dafür gefunden.

@Html.EditorFor(model => model.Name) 
    @Html.DropDownListFor(model => model.Destination) 

Jetzt möchte ich wissen, wie Wert von diesen stark typisierten HTML-Helfer durch Jquery auswählen. Ich möchte diese ausgewählten Eingabewerte in JSON-Array veröffentlichen. Etwas wie folgt aus:

{ Name: "ausgewählte Werte von Textbox", Ziel: "ausgewählten Wert aus Dropdown" }

Ich weiß, wie es mit einfachen Textbox zu tun:

@Html.TextBox("myname") 

zu Wert aus diesem Feld zu bekommen, einfach

$("myname").val(); 

Prevoiusly verwenden, ich war in der Lage statische zu senden Daten über JSON Array wie folgt an die Steuerung:

<script> 
    var auth = { 
     ClientId : "ApiIntegration", 
     Origin : "Delhi", 
    } 

    $("#btnPost").click(function() { 
     $.ajax(
      { 
       url: "/api/Flight/About", 
       type: "Post", 
       contentType: "application/json", 
       data: JSON.stringify(auth), 
       success: function(result) 
       { 
        alert(result); 
       } 
     }); 
    }); 

Aber jetzt möchte ich Wert in Origin Objekt von json von Textbox nicht statisch, diese Zeit zu füllen. Mein Redakteur ist wie folgt:

@Html.EditorFor(model => model.Origin) 

mir bitte helfen.

Answer 1

Sie können Wert von Eingang Namen wie diese:

$("input[name=myname]").val(); 

Answer 2

var jList=[]; 
var jOobj={Name:""}; 

jObj.Name=$("#myname").val(); 
jList.push(jObj); 

Answer 3

Es ist eine gute Praxis immer Versprechen zu verwenden, wenn mit AJAX. In Ihrem eigenen Fall fügen Datentyp wie folgt:

function SaveRecord(data) { 
      return $.ajax({ 
       url: "/api/Flight/About", 
       contentType: 'application/json; charset=utf-8', 
       dataType: 'json', 
       type: 'POST', 
       data: data 
      }); 
     } 

Dann können Sie es auf diese Weise verwenden:

var data = { 
     ClientId : $("#Name").val(), 
     Origin : $(#Destination").val() 
}; 

$.when(SaveRecord(data)).then(function (res) { 
    ///handle success calback here 
}).fail(function(err){}); 

Ich hoffe, das

Answer 4

@Html.EditorFor(model => model.Name, new { htmlAttributes = new { @id="Name" } }) 
@Html.DropDownList(model => model.Destination, new { htmlAttributes = new { @id = "Destination" } }) 
<script type="text/javascript"> 


    var auth = {ClientId: "",Origin: ""} 

    auth.ClientId = $("#Name").val(); 
    auth.Origin= $("#Destination option:selected").text(); 

    $("#btnPost").click(function() { 
     $.ajax({ 
       url: "/api/Flight/About", 
       type: "Post", 
       contentType: "application/json", 
       data: JSON.stringify(auth), 
       success: function (result) { 
        alert(result); 
       } 
      }); 
    }); 


</script> 

Answer 5

Versuchen Sie, das hilft:

var originvalue = $('#Origin').val();  

    $("#btnPost").click(function() { 
      $.ajax(
       { 
        url: "/api/Flight/About", 
        type: "Post", 
        data: '{"ClientId":"ApiIntegration"' + ',"Origin":"' + originvalue + '"}', 
        contentType: 'application/json; charset=utf-8', 
        success: function(result) 
        { 
         alert(result); 
        } 
      }); 
     });