Question

我需要将值从下拉列表分配到自动填充文本框..现在我已经完成了这个

但是您可以看到我无法将Dropdown中的值分配给文本框。我已经通过JQuery PlugIn＆＃34; Prop.js＆＃34;

实现了自动完成功能

这是我创建的代码

  <link href="~/Content/popr.css" rel="stylesheet" />
  <script src="~/Scripts/popr.js"></script>
  <script src="~/Scripts/popr.min.js"></script>

 <div id="address" >

 <label>Country</label>

    <table>
        <tr>
            <td>@Html.TextBox("Country")</td>
            <td>
                <div class="popr" data-id="demo">^</div>
                <div class="popr-box" data-box-id="demo">

                </div>
            </td>
        </tr>
    </table>



</div>

<script type="text/javascript">

$(document).ready(function () {

    $("#Country").autocomplete({
        source: function (request, response) {

            $.ajax({
                url: "/Location/GetAllCountry",
                type: "POST",
                dataType: "json",
                data: { term: request.term },
                success: function (data) {
                    response(data);

                }
            })
        },
        appendTo: '#menu-container',
        messages: {
            noResults: "", results: ""
        }
    });

    $.ajax({
        url: "/Location/GetAllCountry",
        type: 'POST',
        data: { term: "" },
        success: function (states) {

            var $select = $('div[data-box-id="demo"]');
            $.each(states, function (i, state) {
                $('<option>', {
                    value: state
                }).html(state).appendTo($select)
                .addClass("popr-item");
            });
        },
        error: function (xhr) { alert("Something seems Wrong"); }
    });

});

$('.popr').popr();


$('.popr').popr({
    'speed': 200,
    'mode': 'bottom'
});

我搜索了试图在div中单击以获取选定值的解决方案

$(".popr-item").click(function (e) {
    e.stopPropagation();

});

$(".popr-box").click(function (e) {
    e.stopPropagation();
    alert("popr-box");
});

这不起作用

我尝试了另一个插件＆＃34;选择＆＃34; ..但它在级联下拉列表中失败了..我无法尝试另一个插件......我严格要用这种方式使用

如果有另一个插件可用，我需要查看具有级联下拉列表的示例

我只需要从下拉列表中选择值，我该如何实现？

Answer 1

在自动填充

中添加此选择选项

$("#Country").autocomplete({
        source: function (request, response) {

            $.ajax({
                url: "/Location/GetAllCountry",
                type: "POST",
                dataType: "json",
                data: { term: request.term },
                success: function (data) {
                    response(data);

                }
            })
        },
              select: function( event, ui ) {
                            $( "#Country" ).val( ui.item.label );
                            return false;
                        },
        appendTo: '#menu-container',
        messages: {
            noResults: "", results: ""
        }
    });

从自动完成下拉列表中获取价值

1 个答案: