0

私は自分の質問に対する可能な解決策を探してみましたが、これまでに見たものはどれもうまくいきません。とにかく、私は MVC 3 を使用しており、Add Event というフォームがあります。そのページには、ユーザーが選択できる場所のリストを含むドロップダウン リストがあります。そのドロップダウンリストのすぐ下に、ユーザーが新しい場所を追加できるリンクがあります。これで、リンクをクリックするとドロップダウンリストの下に表示される部分ビューで新しい場所を作成するためのテキストボックス、ドロップダウンなどができました。

とにかく、ドロップダウンリストだけを更新して、新しい場所を追加するとリストに表示されるようにする必要があります。保存をクリックした後、部分ビューが非表示になり、ページ全体を更新してドロップダウンリストの新しい場所を取得する必要があります。これにより、テキストボックスと同じドロップダウンリストに入力したすべてが削除されますページ。

javascript/ajaxを使用してこれを行うにはどうすればよいですか?

4

3 に答える 3

0

これはあなたを助けるかもしれません..

var opt = document.createElement("option");
     // Assign text and value to Option object
    opt.text = Text;
    opt.value = Value;        

    // Add an Option object to Drop Down
    document.getElementById("YourDropDownID").options.add(opt,null);
于 2012-09-26T09:20:26.557 に答える
0

jQuery を使用すると、必要な要素のみをリロードできます。

$('#menu').load("myServerScript.php #menu");

http://api.jquery.com/load/

于 2012-09-26T09:25:34.593 に答える
0

これは jQuery で実行できます。私のやり方はこうなります。次のようなフォームがあるとします。

<form method="post" action="#">
    <select id="myList" name="myList">
        <option value="1">Value 1</option>
        <option value="2">Value 2</option>
    </select>
    <input type="text" id="newValue" name="newValue" />
    <a href="#" id="btn">add new value</a>            
    <input type="submit" value="Submit">
</form>

myList は新しい値を追加して更新するドロップダウン、newValue はドロップダウン (myList) に追加される新しい値を受け取るテキスト フィールド、id btn のリンクは追加ボタンです。次のような jQuery を追加できます。

<script type="text/javascript">
    $(document).ready(function () {
        $("#btn").click(function (event) {
            event.preventDefault();
            $.post("/home/addvalue", { value: $("#newValue").val() }, function (result) {
                if (result != null) {
                    $("#myList").append("<option value='" + result.id + "' selected='selected'>" + result.text + "</option>");
                }
            });
        });
    });
 </script>

リンク (btn) をクリックすると、テキスト ボックスから値 (およびその値のみ) を収集し、サーバーに POST (フォームの送信) を実行します。サーバーが、新しく挿入された値の ID を含む何らかの回答を返すことを期待していると思います。サーバーがその新しいIDを送り返す場合、新しい結果をリストに追加します(そして、それを選択したものとして設定します)

サーバー側では、コードは次のようになります

[HttpPost]
public JsonResult AddValue(FormCollection collection) 
{ 
    //do database inser for the new value and get the id
    var response = new Dictionary<string, object>();
    response.Add("id", 3);//3 here represents that last id
    response.Add("text", collection["value"]); //the value you sent for the new option
    return Json(response);
}

POST(ed) データを受け取り、データベースに保存します。値が保存され、新しい ID がディクショナリに保存されたら、それをシリアライズして上記の JavaScript を json として送り返します。これによりフォームが更新されるため、実際に送信したときに myList の値が新しい値になります。これが役に立てば幸いです(そうであれば、答えを受け入れてください)

于 2012-09-26T11:02:16.830 に答える